md`# Mapbox - Data Driven Styling of Circles Using Mapbox GL Expressions to style circle radius and color. ## Notes & Links * https://www.mapbox.com/help/mapbox-gl-js-expressions/ * GeoJSON data is randomly placed in (long, lat) with random data, \`circle-data\`, in the range (0, 100). See https://www.npmjs.com/package/geojson-random. ## Color Ramps * http://colorbrewer2.org/#type=sequential&scheme=Reds&n=9 > which generated the ramp \`\`\` json ['#fff5f0','#fee0d2','#fcbba1','#fc9272','#fb6a4a','#ef3b2c','#cb181d','#a50f15','#67000d'] \`\`\` > which is then used in the Mapbox function method \`\`\` "circle-color": { "property": "circle-data", "stops": [ [10, "#fff5f0"], [20, "#fee0d2"], [30, "#fcbba1"], [40, "#fc9272"], [50, "#fb6a4a"], [60, "#ef3b2c"], [70, "#cb181d"], [80, "#a50f15"], [90, "#67000d"] ] } \`\`\` Future Research * https://www.mapbox.com/mapbox-gl-js/style-spec/#expressions-interpolate-hcl > Interpolation is performed in the Hue-Chroma-Luminance color space. * https://www.mapbox.com/mapbox-gl-js/style-spec/#expressions-interpolate-lab > Interpolation is performed in the CIELAB color space. `