schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2025-01-30 23:15:28 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Tidy and added fallback (exception) color.

Browse source
This commit is contained in:
orangemug 2019-05-18 17:29:59 +01:00
parent c6163b6ba2
commit 1e87765f95
1 changed files with 53 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
src/components/map/FeatureLayerPopup.jsx
View file

@ -33,11 +33,8 @@ class FeatureLayerPopup extends React.Component {
zoom: PropTypes.number, zoom: PropTypes.number,
} }
render() { _getFeatureColor(feature, zoom) {
const sources = groupFeaturesBySourceLayer(this.props.features) try {
const items = Object.keys(sources).map(vectorLayerId => {
const layers = sources[vectorLayerId].map((feature, idx) => {
const paintProps = feature.layer.paint; const paintProps = feature.layer.paint;
let propName; let propName;
@ -54,8 +51,6 @@ class FeatureLayerPopup extends React.Component {
propName = "fill-extrusion-color"; propName = "fill-extrusion-color";
} }
let swatchColor;
if(propName) { if(propName) {
const propertySpec = latest["paint_"+feature.layer.type][propName]; const propertySpec = latest["paint_"+feature.layer.type][propName];
@ -68,18 +63,33 @@ class FeatureLayerPopup extends React.Component {
const exprResult = expression.createExpression(color, propertySpec); const exprResult = expression.createExpression(color, propertySpec);
const val = exprResult.value.evaluate({ const val = exprResult.value.evaluate({
zoom: this.props.zoom zoom: zoom
}, feature); }, feature);
swatchColor = val.toString(); return val.toString();
} }
else { else {
swatchColor = color; return color;
} }
} }
else { else {
// Default color // Default color
swatchColor = "black"; return "black";
} }
}
// This is quite complex, just incase there's an edgecase we're missing
// always return black if we get an unexpected error.
catch (err) {
console.error("Unable to get feature color, error:", err);
return "black";
}
}
render() {
const sources = groupFeaturesBySourceLayer(this.props.features)
const items = Object.keys(sources).map(vectorLayerId => {
const layers = sources[vectorLayerId].map((feature, idx) => {
const featureColor = this._getFeatureColor(feature, this.props.zoom);
return <div return <div
key={idx} key={idx}
@ -87,7 +97,7 @@ class FeatureLayerPopup extends React.Component {
> >
<div <div
className="maputnik-popup-layer__swatch" className="maputnik-popup-layer__swatch"
style={{background: swatchColor}} style={{background: featureColor}}
></div> ></div>
<label <label
className="maputnik-popup-layer__label" className="maputnik-popup-layer__label"