You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@superset.apache.org by GitBox <gi...@apache.org> on 2018/02/16 01:49:02 UTC
[GitHub] mistercrunch closed pull request #4437: Fix separator visualization by propagating header height - Resolves issue #3619
mistercrunch closed pull request #4437: Fix separator visualization by propagating header height - Resolves issue #3619
URL: https://github.com/apache/incubator-superset/pull/4437
This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:
As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):
diff --git a/superset/assets/javascripts/chart/Chart.jsx b/superset/assets/javascripts/chart/Chart.jsx
index cc18bb4fe6..0e064278f5 100644
--- a/superset/assets/javascripts/chart/Chart.jsx
+++ b/superset/assets/javascripts/chart/Chart.jsx
@@ -20,6 +20,7 @@ const propTypes = {
containerId: PropTypes.string.isRequired,
datasource: PropTypes.object.isRequired,
formData: PropTypes.object.isRequired,
+ headerHeight: PropTypes.number,
height: PropTypes.number,
width: PropTypes.number,
setControlValue: PropTypes.func,
@@ -63,6 +64,7 @@ class Chart extends React.PureComponent {
this.getFilters = this.getFilters.bind(this);
this.clearFilter = this.clearFilter.bind(this);
this.removeFilter = this.removeFilter.bind(this);
+ this.headerHeight = this.headerHeight.bind(this);
this.height = this.height.bind(this);
this.width = this.width.bind(this);
}
@@ -129,6 +131,10 @@ class Chart extends React.PureComponent {
return this.props.width || this.container.el.offsetWidth;
}
+ headerHeight() {
+ return this.props.headerHeight || 0;
+ }
+
height() {
return this.props.height || this.container.el.offsetHeight;
}
diff --git a/superset/assets/javascripts/dashboard/components/GridCell.jsx b/superset/assets/javascripts/dashboard/components/GridCell.jsx
index 2ae9ea49c0..91fe83943b 100644
--- a/superset/assets/javascripts/dashboard/components/GridCell.jsx
+++ b/superset/assets/javascripts/dashboard/components/GridCell.jsx
@@ -73,16 +73,21 @@ class GridCell extends React.PureComponent {
height(slice) {
const widgetHeight = this.props.widgetHeight;
- const headerId = this.getHeaderId(slice);
+ const headerHeight = this.headerHeight(slice);
const descriptionId = this.getDescriptionId(slice);
- const headerHeight = this.refs[headerId] ? this.refs[headerId].offsetHeight : 30;
let descriptionHeight = 0;
if (this.props.isExpanded && this.refs[descriptionId]) {
descriptionHeight = this.refs[descriptionId].offsetHeight + 10;
}
+
return widgetHeight - headerHeight - descriptionHeight;
}
+ headerHeight(slice) {
+ const headerId = this.getHeaderId(slice);
+ return this.refs[headerId] ? this.refs[headerId].offsetHeight : 30;
+ }
+
render() {
const {
isExpanded, isLoading, isCached, cachedDttm,
@@ -130,6 +135,7 @@ class GridCell extends React.PureComponent {
chartKey={chartKey}
datasource={datasource}
formData={formData}
+ headerHeight={this.headerHeight(slice)}
height={this.height(slice)}
width={this.width()}
timeout={timeout}
diff --git a/superset/assets/visualizations/markup.js b/superset/assets/visualizations/markup.js
index 8b437162e2..193eb4d65f 100644
--- a/superset/assets/visualizations/markup.js
+++ b/superset/assets/visualizations/markup.js
@@ -9,6 +9,13 @@ function markupWidget(slice, payload) {
overflow: 'auto',
});
+ // markup height is slice height - (marginTop + marginBottom)
+ let iframeHeight = slice.height() - 20;
+ if (slice.props.vizType === 'separator') {
+ // separator height is the entire chart container: slice height + header
+ iframeHeight = slice.height() + slice.headerHeight();
+ }
+
const iframeId = `if__${slice.containerId}`;
const html = `
<html>
@@ -22,7 +29,7 @@ function markupWidget(slice, payload) {
jqdiv.html(`
<iframe id="${iframeId}"
frameborder="0"
- height="${slice.height() - 20}"
+ height="${iframeHeight}"
sandbox="allow-same-origin allow-scripts allow-top-navigation allow-popups">
</iframe>
`);
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services