mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-12-29 08:00:32 +01:00
Add label to filter editor
This commit is contained in:
parent
ed9b806143
commit
d9b458d7fd
2 changed files with 15 additions and 7 deletions
|
@ -1,10 +1,11 @@
|
||||||
import React from 'react'
|
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 input from '../../config/input.js'
|
||||||
import colors from '../../config/colors.js'
|
import colors from '../../config/colors.js'
|
||||||
import { margins } from '../../config/scales.js'
|
import { margins } from '../../config/scales.js'
|
||||||
|
|
||||||
|
import DocLabel from '../fields/DocLabel'
|
||||||
import Button from '../Button'
|
import Button from '../Button'
|
||||||
import SelectInput from '../inputs/SelectInput'
|
import SelectInput from '../inputs/SelectInput'
|
||||||
import StringInput from '../inputs/StringInput'
|
import StringInput from '../inputs/StringInput'
|
||||||
|
@ -148,18 +149,20 @@ export default class CombiningFilterEditor extends React.Component {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
/** Properties of the vector layer and the available fields */
|
/** Properties of the vector layer and the available fields */
|
||||||
properties: React.PropTypes.object.isRequired,
|
properties: React.PropTypes.object.isRequired,
|
||||||
filter: React.PropTypes.array.isRequired,
|
filter: React.PropTypes.array,
|
||||||
onChange: React.PropTypes.func.isRequired,
|
onChange: React.PropTypes.func.isRequired,
|
||||||
}
|
}
|
||||||
|
|
||||||
// Convert filter to combining filter
|
// Convert filter to combining filter
|
||||||
combiningFilter() {
|
combiningFilter() {
|
||||||
let combiningOp = this.props.filter[0]
|
let filter = this.props.filter || ['all']
|
||||||
let filters = this.props.filter.slice(1)
|
|
||||||
|
let combiningOp = filter[0]
|
||||||
|
let filters = filter.slice(1)
|
||||||
|
|
||||||
if(combiningFilterOps.indexOf(combiningOp) < 0) {
|
if(combiningFilterOps.indexOf(combiningOp) < 0) {
|
||||||
combiningOp = 'all'
|
combiningOp = 'all'
|
||||||
filters = [this.props.filter.slice(0)]
|
filters = [filter.slice(0)]
|
||||||
}
|
}
|
||||||
|
|
||||||
return [combiningOp, ...filters]
|
return [combiningOp, ...filters]
|
||||||
|
@ -216,6 +219,13 @@ export default class CombiningFilterEditor extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
return <div>
|
return <div>
|
||||||
|
<DocLabel
|
||||||
|
label={"Filter"}
|
||||||
|
doc={GlSpec.layer.filter.doc}
|
||||||
|
style={{
|
||||||
|
width: '42.25%',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<CombiningOperatorSelect
|
<CombiningOperatorSelect
|
||||||
value={combiningOp}
|
value={combiningOp}
|
||||||
onChange={this.onFilterPartChanged.bind(this, 0)}
|
onChange={this.onFilterPartChanged.bind(this, 0)}
|
||||||
|
|
|
@ -118,7 +118,6 @@ export default class LayerEditor extends React.Component {
|
||||||
onChange={v => this.changeProperty(null, 'source-layer', v)}
|
onChange={v => this.changeProperty(null, 'source-layer', v)}
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
{this.props.layer.filter &&
|
|
||||||
<div style={input.property}>
|
<div style={input.property}>
|
||||||
<FilterEditor
|
<FilterEditor
|
||||||
filter={this.props.layer.filter}
|
filter={this.props.layer.filter}
|
||||||
|
@ -126,7 +125,6 @@ export default class LayerEditor extends React.Component {
|
||||||
onChange={f => this.changeProperty(null, 'filter', f)}
|
onChange={f => this.changeProperty(null, 'filter', f)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
}
|
|
||||||
</div>
|
</div>
|
||||||
case 'properties': return <PropertyGroup
|
case 'properties': return <PropertyGroup
|
||||||
layer={this.props.layer}
|
layer={this.props.layer}
|
||||||
|
|
Loading…
Reference in a new issue