0
votes

I'm new to using Mapbox. I've been able to import a shapefile containing multiple polygon data sets. I'd like to be able to create a map which allows the user to switch between different datasets. The issue is the initial import creates a single layer and I'm not sure how to create a different layer or object for each new field I'd like the user to be able to switch between. As an example here's the simple TileMill code block that imports the shape file and accesses the first data object

#COPrecincts {
   line-color:black;
   line-width:0.5;
}

#COPrecincts {
  [P_08 > 0.5] {polygon-fill: lighten(blue,40%);}
  [P_08 > 0.6] {polygon-fill: lighten(blue,30%);}
  [P_08 > 0.7] {polygon-fill: lighten(blue,20%);}
  [P_08 > 0.8] {polygon-fill: lighten(blue,10%);}
  [P_08 > 0.9] {polygon-fill: blue;}
  [P_08 = 0.5] {polygon-fill: lighten(blue,50%);}
  [P_08 < 0.5] {polygon-fill: lighten(red,40%);}
  [P_08 < 0.4] {polygon-fill: lighten(red,30%);}
  [P_08 < 0.3] {polygon-fill: lighten(red,20%);}
  [P_08 < 0.2] {polygon-fill: lighten(red,10%);}
  [P_08 < 0.1] {polygon-fill: red;}
}
1

1 Answers

0
votes

To do this, you are going to need to create multiple TileMill projects so that you can export multiple map layers to switch between. Whether you use JavaScript or some other presentation, having multiple map layers is how you will let the user choose the one in view. You won't be able to hide portions of a single map layer.

One project that will likely be useful to you in creating multiple similar TileMill projects is ProjectMill:

https://github.com/mapbox/projectmill

But also consider stepping back a moment and possibly drawing the data client-side in JavaScript instead of TileMill projects. If you look at this: https://www.mapbox.com/mapbox.js/example/v1.0.0/polyline/ and other vector overlay examples with MapBox.js, you might find something that will work better for your project and not require so much upfront processing and rendering.