Add label to filter editor

This commit is contained in:
Lukas Martinelli 2017-01-09 16:40:09 +01:00
parent ed9b806143
commit d9b458d7fd
2 changed files with 15 additions and 7 deletions

View file

@ -1,10 +1,11 @@
import React from 'react'
import GlSpec from 'mapbox-gl-style-spec/reference/latest.min.js'
import GlSpec from 'mapbox-gl-style-spec/reference/latest.js'
import input from '../../config/input.js'
import colors from '../../config/colors.js'
import { margins } from '../../config/scales.js'
import DocLabel from '../fields/DocLabel'
import Button from '../Button'
import SelectInput from '../inputs/SelectInput'
import StringInput from '../inputs/StringInput'
@ -148,18 +149,20 @@ export default class CombiningFilterEditor extends React.Component {
static propTypes = {
/** Properties of the vector layer and the available fields */
properties: React.PropTypes.object.isRequired,
filter: React.PropTypes.array.isRequired,
filter: React.PropTypes.array,
onChange: React.PropTypes.func.isRequired,
}
// Convert filter to combining filter
combiningFilter() {
let combiningOp = this.props.filter[0]
let filters = this.props.filter.slice(1)
let filter = this.props.filter || ['all']
let combiningOp = filter[0]
let filters = filter.slice(1)
if(combiningFilterOps.indexOf(combiningOp) < 0) {
combiningOp = 'all'
filters = [this.props.filter.slice(0)]
filters = [filter.slice(0)]
}
return [combiningOp, ...filters]
@ -216,6 +219,13 @@ export default class CombiningFilterEditor extends React.Component {
}
return <div>
<DocLabel
label={"Filter"}
doc={GlSpec.layer.filter.doc}
style={{
width: '42.25%',
}}
/>
<CombiningOperatorSelect
value={combiningOp}
onChange={this.onFilterPartChanged.bind(this, 0)}

View file

@ -118,7 +118,6 @@ export default class LayerEditor extends React.Component {
onChange={v => this.changeProperty(null, 'source-layer', v)}
/>
}
{this.props.layer.filter &&
<div style={input.property}>
<FilterEditor
filter={this.props.layer.filter}
@ -126,7 +125,6 @@ export default class LayerEditor extends React.Component {
onChange={f => this.changeProperty(null, 'filter', f)}
/>
</div>
}
</div>
case 'properties': return <PropertyGroup
layer={this.props.layer}