Check for property-function support on data styles

This commit is contained in:
pjsier 2017-10-05 06:08:55 -05:00
parent 2ffb3e73e1
commit 1d29f67065

View file

@ -261,13 +261,11 @@ export default class ZoomSpecProperty extends React.Component {
} }
renderProperty() { renderProperty() {
let functionBtn = null const functionBtn = <MakeFunctionButtons
if(this.props.fieldSpec['zoom-function']) { fieldSpec={this.props.fieldSpec}
functionBtn = <MakeFunctionButtons onZoomClick={this.makeZoomFunction.bind(this)}
onZoomClick={this.makeZoomFunction.bind(this)} onDataClick={this.makeDataFunction.bind(this)}
onDataClick={this.makeDataFunction.bind(this)} />
/>
}
return <InputBlock return <InputBlock
doc={this.props.fieldSpec.doc} doc={this.props.fieldSpec.doc}
label={labelFromFieldName(this.props.fieldName)} label={labelFromFieldName(this.props.fieldName)}
@ -296,8 +294,9 @@ export default class ZoomSpecProperty extends React.Component {
} }
function MakeFunctionButtons(props) { function MakeFunctionButtons(props) {
return <div> let makeZoomButton, makeDataButton
<Button if (props.fieldSpec['zoom-function']) {
makeZoomButton = <Button
className="maputnik-make-zoom-function" className="maputnik-make-zoom-function"
onClick={props.onZoomClick} onClick={props.onZoomClick}
> >
@ -307,17 +306,24 @@ function MakeFunctionButtons(props) {
doc={"Turn property into a zoom function to enable a map feature to change with map's zoom level."} doc={"Turn property into a zoom function to enable a map feature to change with map's zoom level."}
/> />
</Button> </Button>
<Button
className="maputnik-make-data-function" if (props.fieldSpec['property-function']) {
onClick={props.onDataClick} makeDataButton = <Button
> className="maputnik-make-data-function"
<DocLabel onClick={props.onDataClick}
label={<MdInsertChart />} >
cursorTargetStyle={{ cursor: 'pointer' }} <DocLabel
doc={"Turn property into a data function to enable a map feature to change according to data properties and the map's zoom level."} label={<MdInsertChart />}
/> cursorTargetStyle={{ cursor: 'pointer' }}
</Button> doc={"Turn property into a data function to enable a map feature to change according to data properties and the map's zoom level."}
</div> />
</Button>
}
return <div>{makeZoomButton}{makeDataButton}</div>
}
else {
return null
}
} }
function DeleteStopButton(props) { function DeleteStopButton(props) {