This is an automated email from the ASF dual-hosted git repository.
maximebeauchemin pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
The following commit(s) were added to refs/heads/master by this push:
new ccf505a [mapbox] fix viewport alterations (#3293)
ccf505a is described below
commit ccf505a4805203684e7416d2d9789f6f54f2f9ad
Author: Maxime Beauchemin <maximebeauche...@gmail.com>
AuthorDate: Wed Aug 16 11:23:01 2017 -0700
[mapbox] fix viewport alterations (#3293)
* [mapbox] fix viewport alterations
Since explorev2 it appears that altering the viewport hasn't been
changing the controls as it used to. This PR addresses it.
* lint
---
.../explore/components/ChartContainer.jsx | 3 ++-
.../explore/components/controls/TextControl.jsx | 6 ++----
superset/assets/visualizations/mapbox.jsx | 20 ++++++++++----------
3 files changed, 14 insertions(+), 15 deletions(-)
diff --git a/superset/assets/javascripts/explore/components/ChartContainer.jsx
b/superset/assets/javascripts/explore/components/ChartContainer.jsx
index 3243f32..d5b4545 100644
--- a/superset/assets/javascripts/explore/components/ChartContainer.jsx
+++ b/superset/assets/javascripts/explore/components/ChartContainer.jsx
@@ -178,7 +178,8 @@ class ChartContainer extends React.PureComponent {
const mockSlice = this.getMockedSliceObject();
this.setState({ mockSlice });
try {
- visMap[this.props.viz_type](mockSlice, this.props.queryResponse);
+ const viz = visMap[this.props.viz_type];
+ viz(mockSlice, this.props.queryResponse,
this.props.actions.setControlValue);
} catch (e) {
this.props.actions.chartRenderingFailed(e);
}
diff --git
a/superset/assets/javascripts/explore/components/controls/TextControl.jsx
b/superset/assets/javascripts/explore/components/controls/TextControl.jsx
index c3f7aa5..4fe558e 100644
--- a/superset/assets/javascripts/explore/components/controls/TextControl.jsx
+++ b/superset/assets/javascripts/explore/components/controls/TextControl.jsx
@@ -29,13 +29,10 @@ const defaultProps = {
export default class TextControl extends React.Component {
constructor(props) {
super(props);
- const value = props.value ? props.value.toString() : '';
- this.state = { value };
this.onChange = this.onChange.bind(this);
}
onChange(event) {
let value = event.target.value || '';
- this.setState({ value });
// Validation & casting
const errors = [];
@@ -58,6 +55,7 @@ export default class TextControl extends React.Component {
this.props.onChange(value, errors);
}
render() {
+ const value = this.props.value ? this.props.value.toString() : '';
return (
<div>
<ControlHeader {...this.props} />
@@ -66,7 +64,7 @@ export default class TextControl extends React.Component {
type="text"
placeholder=""
onChange={this.onChange}
- value={this.state.value}
+ value={value}
/>
</FormGroup>
</div>
diff --git a/superset/assets/visualizations/mapbox.jsx
b/superset/assets/visualizations/mapbox.jsx
index 9a86853..c01ad28 100644
--- a/superset/assets/visualizations/mapbox.jsx
+++ b/superset/assets/visualizations/mapbox.jsx
@@ -8,6 +8,7 @@ import ScatterPlotOverlay from
'react-map-gl/dist/overlays/scatterplot.react';
import Immutable from 'immutable';
import supercluster from 'supercluster';
import ViewportMercator from 'viewport-mercator-project';
+
import {
kmToPixels,
rgbLuminance,
@@ -17,8 +18,9 @@ import {
DEFAULT_LATITUDE,
DEFAULT_ZOOM,
} from '../utils/common';
+import './mapbox.css';
-require('./mapbox.css');
+const NOOP = () => {};
class ScatterPlotGlowOverlay extends ScatterPlotOverlay {
drawText(ctx, pixel, options = {}) {
@@ -201,9 +203,10 @@ class MapboxViz extends React.Component {
}
onChangeViewport(viewport) {
- this.setState({
- viewport,
- });
+ this.setState({ viewport });
+ this.props.setControlValue('viewport_longitude', viewport.longitude);
+ this.props.setControlValue('viewport_latitude', viewport.latitude);
+ this.props.setControlValue('viewport_zoom', viewport.zoom);
}
render() {
@@ -220,11 +223,6 @@ class MapboxViz extends React.Component {
const clusters = this.props.clusterer.getClusters(bbox,
Math.round(this.state.viewport.zoom));
const isDragging = this.state.viewport.isDragging === undefined ? false :
this.state.viewport.isDragging;
-
- d3.select('#viewport_longitude').attr('value',
this.state.viewport.longitude);
- d3.select('#viewport_latitude').attr('value',
this.state.viewport.latitude);
- d3.select('#viewport_zoom').attr('value', this.state.viewport.zoom);
-
return (
<MapGL
{...this.state.viewport}
@@ -259,6 +257,7 @@ class MapboxViz extends React.Component {
MapboxViz.propTypes = {
aggregatorName: PropTypes.string,
clusterer: PropTypes.object,
+ setControlValue: PropTypes.func,
globalOpacity: PropTypes.number,
mapStyle: PropTypes.string,
mapboxApiKey: PropTypes.string,
@@ -273,7 +272,7 @@ MapboxViz.propTypes = {
viewportZoom: PropTypes.number,
};
-function mapbox(slice, json) {
+function mapbox(slice, json, setControlValue) {
const div = d3.select(slice.selector);
const DEFAULT_POINT_RADIUS = 60;
const DEFAULT_MAX_ZOOM = 16;
@@ -331,6 +330,7 @@ function mapbox(slice, json) {
clusterer={clusterer}
pointRadius={DEFAULT_POINT_RADIUS}
aggregatorName={aggName}
+ setControlValue={setControlValue || NOOP}
/>,
div.node(),
);
--
To stop receiving notification emails like this one, please contact
['"comm...@superset.apache.org" <comm...@superset.apache.org>'].
