Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weโ€™ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Introducing choroplethmapbox traces #3988

Merged
merged 26 commits into from
Jul 3, 2019
Merged

Introducing choroplethmapbox traces #3988

merged 26 commits into from
Jul 3, 2019

Conversation

etpinard
Copy link
Contributor

@etpinard etpinard commented Jun 26, 2019

Based off #3987


This PR adds a new mapbox-based trace type: choroplethmapbox ๐ŸŽ‰ ๐Ÿ—บ๏ธ ๐Ÿ›ฐ๏ธ

Example: https://codepen.io/etpinard/pen/orGQNe

In brief, choroplethmapbox traces have a very similar API as their geo-subplot cousin choropleth. Both use locations and z to set the polygon-to-color mapping. But unlike choropleth, choroplethmapbox traces (currently) must be set with a geojson attribute that contains polygon coordinates.

Note that, this PR also fixes a choropleth bug in 91e0319 - where we didn't use the correct marker.line.color default.

Things that work

  • geojson can be set either as URL string or { } GeoJSON object. We accept GeoJSONs of type Feature and FeatureCollection and geometries of type Polygon and MultiPolygon.
  • colorscale / coloraxis work just like choropleth
  • hover and selections reuse the choropleth logic, where the polygons' centroid is used.
  • GeoJSON properties fields are accessible in hovertemplate (example)

Things worthy of discussion

  • The below default. below (like in mapbox.layers) sets the id of the layer just below where the choroplethmapbox trace will be plotted. I tentatively chose the layer just above the last "water" layer. That is, choroplethmapbox traces are plotted below roads and labels by default.
  • Maybe instead of some "smart" default for below, we could plot choroplethmapbox traces above all background layers (but below scattermapbox traces) and have a default marker.opacity of e.g. 0.7?

Things that we could add

  • topojson support, that way users could (easily) use https://cdn.plot.ly/world_110m.json and friends
  • locationmode. The current behavior would correspond to locationmode: 'geojson-id'. Some users might expect to identify GeoJSON features using their properties.name (this would correspond to e.g. locationmode: 'geojson-prop-name'. Moreover, we could also support the locationmode values found in geo traces: 'ISO-3', 'USA-states', 'country names'
  • some zkey attribute as an alternative to the z array. For example, zkey: 'value' would read off the properties.value values in the GeoJSON set by geojson

cc @plotly/plotly_js @nicolaskruchten @chriddyp

etpinard added 14 commits June 26, 2019 16:18
- valid choropleth datum must have a valid location AND `z` value
- set calcdata[i][j].index during calc
  so that choroplethmapbox can use it in its convert.js
... and update choropleth baselines that
    didn't show the "correct" default "black"
for geo AND mapbox base plot modules

... that way we do this only once when geo and mapbox modules
    are registered
- reusing choropleth calc, hover, select, eventData and
  feature2polygon
- use `PlotlyGeoAssets` to stash fetched geojson url data
- use two layers, one fill (to filled choropleth polygon), one
  line to draw `marker.line` styles
- add mockAxis on mapbox subplot instances,
  used to format choroplethmapbox 'z' on hover
... similar to how we do things on geo subplots
- use _rehover wrapper similar to cartesian subplots and
  call it on moveend
- split fx init code into prototype.initFx
- where by default chroroplethmapbox traces are placed
  above the top most "water" layer
- N.B. we need to remove/add again layers when *below* is updated
@etpinard etpinard added bug something broken status: reviewable labels Jun 26, 2019
@etpinard etpinard added this to the v1.49.0 milestone Jun 26, 2019
lib/index-mapbox.js Outdated Show resolved Hide resolved
src/traces/choropleth/calc.js Outdated Show resolved Hide resolved
src/traces/choroplethmapbox/convert.js Show resolved Hide resolved
src/traces/choroplethmapbox/defaults.js Outdated Show resolved Hide resolved
src/traces/choroplethmapbox/plot.js Show resolved Hide resolved
src/plots/mapbox/mapbox.js Outdated Show resolved Hide resolved
moduleType: 'trace',
name: 'choroplethmapbox',
basePlotModule: require('../../plots/mapbox'),
categories: ['mapbox', 'gl', 'noOpacity'],
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Later on the road, it may be of interest to have traces with opacity. Right?

Copy link
Contributor Author

@etpinard etpinard Jun 27, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

opacity here for choroplethmapbox traces would be equivalent to marker.opacity, so we don't need it.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What about dimming marker.lines? Trace opacity may be handy for adjusting both.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe, but I'm not going to do this now for consistency with choropleth:

categories: ['geo', 'noOpacity'],

etpinard added 5 commits June 27, 2019 10:05
- move isNonBlankString in outer scope
- add "" around URL in invalid-url error msg
... when marker.line.width===0
... and set for
    npm run test-jasmine "$s" --tags=gl --skip-tags=noCI

    so that suites (e.g. choroplethmapbox_test.js) where all
    @gl tests are also @noci do not fail.
@etpinard
Copy link
Contributor Author

etpinard commented Jul 2, 2019

Is everyone subscribed to this PR ok with the behavior?

@etpinard
Copy link
Contributor Author

etpinard commented Jul 3, 2019

No news, good news I guess. Merging this PR into #3987 to have all 1.49.0 mapbox items in one place

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug something broken
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants