diff --git a/src/fields/spec.jsx b/src/fields/spec.jsx index 81813c1f..be6c0bb1 100644 --- a/src/fields/spec.jsx +++ b/src/fields/spec.jsx @@ -60,6 +60,14 @@ class ZoomSpecField extends React.Component { } } +function labelFromFieldName(fieldName) { + let label = fieldName.split('-').slice(1).join(' ') + if(label.length > 0) { + label = label.charAt(0).toUpperCase() + label.slice(1); + } + return label +} + /** Display any field from the Mapbox GL style spec and * choose the correct field component based on the @{fieldSpec} * to display @{value}. */ @@ -77,12 +85,13 @@ class SpecField extends React.Component { } render() { + const label = labelFromFieldName(this.props.fieldName) switch(this.props.fieldSpec.type) { case 'number': return ( @@ -103,7 +112,7 @@ class SpecField extends React.Component { ) @@ -111,7 +120,7 @@ class SpecField extends React.Component { ) @@ -130,7 +139,7 @@ export class PropertyGroup extends React.Component { render() { const layerTypeSpec = GlSpec[this.props.groupType + "_" + this.props.layerType] - const specFields = Object.keys(layerTypeSpec).map(propName => { + const specFields = Object.keys(layerTypeSpec).filter(propName => propName !== 'visibility').map(propName => { const fieldSpec = layerTypeSpec[propName] const propValue = this.props.properties.get(propName) return