schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2024-12-26 19:00:39 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixed changing between zoom/data functions.

Browse source
This commit is contained in:
orangemug 2020-06-10 20:26:39 +01:00
parent c4b05b62b3
commit 09373dda44
3 changed files with 90 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

80
src/components/FieldFunction.jsx
View file

@ -200,12 +200,35 @@ export default class FieldFunction extends React.Component {
}
makeZoomFunction = () => {
const zoomFunc = {
stops: [
[6, this.props.value || findDefaultFromSpec(this.props.fieldSpec)],
[10, this.props.value || findDefaultFromSpec(this.props.fieldSpec)]
]
const {value} = this.props;
let zoomFunc;
if (typeof(value) === "object") {
if (value.stops) {
zoomFunc = {
stops: value.stops.map(stop => {
return [stop[0].zoom, stop[1] || findDefaultFromSpec(this.props.fieldSpec)];
})
}
}
else {
zoomFunc = {
stops: [
[6, findDefaultFromSpec(this.props.fieldSpec)],
[10, findDefaultFromSpec(this.props.fieldSpec)]
]
}
}
}
else {
zoomFunc = {
stops: [
[6, value || findDefaultFromSpec(this.props.fieldSpec)],
[10, value || findDefaultFromSpec(this.props.fieldSpec)]
]
}
}
this.props.onChange(this.props.fieldName, zoomFunc)
}
@ -255,17 +278,44 @@ export default class FieldFunction extends React.Component {
this.props.onChange(this.props.fieldName, expression);
}
makeDataFunction = () => {
const functionType = this.getFieldFunctionType(this.props.fieldSpec);
makeDataFunction = (functionType) => {
functionType = functionType || this.getFieldFunctionType(this.props.fieldSpec);
const stopValue = functionType === 'categorical' ? '' : 0;
const dataFunc = {
property: "",
type: functionType,
stops: [
[{zoom: 6, value: stopValue}, this.props.value || findDefaultFromSpec(this.props.fieldSpec)],
[{zoom: 10, value: stopValue}, this.props.value || findDefaultFromSpec(this.props.fieldSpec)]
]
const {value} = this.props;
let dataFunc;
if (typeof(value) === "object") {
if (value.stops) {
dataFunc = {
property: "",
type: functionType,
stops: value.stops.map(stop => {
return [{zoom: stop[0], value: stopValue}, stop[1] || findDefaultFromSpec(this.props.fieldSpec)];
})
}
}
else {
dataFunc = {
property: "",
type: functionType,
stops: [
[{zoom: 6, value: stopValue}, findDefaultFromSpec(this.props.fieldSpec)],
[{zoom: 10, value: stopValue}, findDefaultFromSpec(this.props.fieldSpec)]
]
}
}
}
else {
dataFunc = {
property: "",
type: functionType,
stops: [
[{zoom: 6, value: stopValue}, this.props.value || findDefaultFromSpec(this.props.fieldSpec)],
[{zoom: 10, value: stopValue}, this.props.value || findDefaultFromSpec(this.props.fieldSpec)]
]
}
}
this.props.onChange(this.props.fieldName, dataFunc)
}
@ -310,6 +360,7 @@ export default class FieldFunction extends React.Component {
value={this.props.value}
onDeleteStop={this.deleteStop}
onAddStop={this.addStop}
onChangeToDataFunction={this.makeDataFunction}
onExpressionClick={this.makeExpression}
/>
)
@ -326,6 +377,7 @@ export default class FieldFunction extends React.Component {
value={this.props.value}
onDeleteStop={this.deleteStop}
onAddStop={this.addStop}
onChangeToZoomFunction={this.makeZoomFunction}
onExpressionClick={this.makeExpression}
/>
)

16
src/components/_DataProperty.jsx
View file

@ -91,7 +91,7 @@ export default class DataProperty extends React.Component {
getDataFunctionTypes(fieldSpec) {
if (fieldSpec.expression.interpolated) {
return ["categorical", "interval", "exponential", "identity"]
return ["interpolate", "categorical", "interval", "exponential", "identity"]
}
else {
return ["categorical", "interval", "identity"]
@ -167,6 +167,18 @@ export default class DataProperty extends React.Component {
this.onChange(this.props.fieldName, changedValue)
}
changeDataType(propVal) {
if (propVal === "interpolate") {
this.props.onChangeToZoomFunction();
}
else {
this.onChange(this.props.fieldName, {
...this.props.value,
type: propVal,
});
}
}
changeDataProperty(propName, propVal) {
if (propVal) {
this.props.value[propName] = propVal
@ -284,7 +296,7 @@ export default class DataProperty extends React.Component {
<div className="maputnik-data-spec-property-input">
<InputSelect
value={this.props.value.type}
onChange={propVal => this.changeDataProperty("type", propVal)}
onChange={propVal => this.changeDataType(propVal)}
title={"Select a type of data scale (default is 'categorical')."}
options={this.getDataFunctionTypes(this.props.fieldSpec)}
/>

14
src/components/_ZoomProperty.jsx
View file

@ -126,6 +126,12 @@ export default class ZoomProperty extends React.Component {
this.props.onChange(this.props.fieldName, changedValue)
}
changeDataType = (type) => {
if (type !== "interpolate") {
this.props.onChangeToDataFunction(type);
}
}
render() {
const {fieldName, fieldType, errors} = this.props;
@ -183,7 +189,7 @@ export default class ZoomProperty extends React.Component {
<div className="maputnik-data-spec-property-input">
<InputSelect
value={"interpolate"}
onChange={propVal => this.changeDataProperty("type", propVal)}
onChange={propVal => this.changeDataType(propVal)}
title={"Select a type of data scale (default is 'categorical')."}
options={this.getDataFunctionTypes(this.props.fieldSpec)}
/>
@ -227,11 +233,11 @@ export default class ZoomProperty extends React.Component {
}
getDataFunctionTypes(fieldSpec) {
if (fieldSpec.expression.interpolated) {
return ["categorical", "interval", "exponential", "identity", "interpolate"]
if (fieldSpec['property-type'] === 'data-driven') {
return ["interpolate", "categorical", "interval", "exponential", "identity"];
}
else {
return ["categorical", "interval", "identity", "interpolate"]
return ["interpolate"];
}
}