forked from MapComplete/MapComplete
General cleanup, improve sidewalk rendering
This commit is contained in:
parent
20fa5028d9
commit
72edc9bdcc
6 changed files with 53 additions and 35 deletions
|
@ -97,9 +97,9 @@ export default class SimpleMetaTagger {
|
|||
/**
|
||||
* Sets the key onto the properties (but doesn't overwrite if already existing)
|
||||
*/
|
||||
function set(key, value) {
|
||||
if (tgs[key] === undefined || tgs[key] === "") {
|
||||
tgs[key] = value
|
||||
function set(k, value) {
|
||||
if (tgs[k] === undefined || tgs[k] === "") {
|
||||
tgs[k] = value
|
||||
somethingChanged = true
|
||||
}
|
||||
}
|
||||
|
|
|
@ -25,10 +25,7 @@ export default class LineRenderingConfig extends WithContextLoader {
|
|||
this.offset = this.tr("offset", "0");
|
||||
}
|
||||
|
||||
|
||||
public GenerateLeafletStyle(
|
||||
tags: UIEventSource<any>
|
||||
):
|
||||
public GenerateLeafletStyle( tags: {} ):
|
||||
{
|
||||
color: string,
|
||||
weight: number,
|
||||
|
@ -48,8 +45,8 @@ export default class LineRenderingConfig extends WithContextLoader {
|
|||
if (tags === undefined) {
|
||||
return deflt
|
||||
}
|
||||
const str = tr?.GetRenderValue(tags.data)?.txt ?? deflt;
|
||||
return Utils.SubstituteKeys(str, tags.data)?.replace(/{.*}/g, "");
|
||||
const str = tr?.GetRenderValue(tags)?.txt ?? deflt;
|
||||
return Utils.SubstituteKeys(str, tags)?.replace(/{.*}/g, "");
|
||||
}
|
||||
|
||||
const dashArray = render(this.dashArray)?.split(" ")?.map(Number);
|
||||
|
@ -62,7 +59,6 @@ export default class LineRenderingConfig extends WithContextLoader {
|
|||
|
||||
const weight = rendernum(this.width, 5);
|
||||
const offset = rendernum(this.offset, 0)
|
||||
console.log("Calculated offset:", offset, "for", this.offset)
|
||||
return {
|
||||
color,
|
||||
weight,
|
||||
|
|
|
@ -141,7 +141,7 @@ export default class TagRenderingConfig {
|
|||
const mp = {
|
||||
if: TagUtils.Tag(mapping.if, `${mappingContext}.if`),
|
||||
ifnot: (mapping.ifnot !== undefined ? TagUtils.Tag(mapping.ifnot, `${mappingContext}.ifnot`) : undefined),
|
||||
then: Translations.T(mapping.then, `{mappingContext}.then`),
|
||||
then: Translations.T(mapping.then, `${mappingContext}.then`),
|
||||
hideInAnswer: hideInAnswer
|
||||
};
|
||||
if (this.question) {
|
||||
|
|
|
@ -16,7 +16,7 @@ export default class ShowDataLayer {
|
|||
private readonly _features: RenderingMultiPlexerFeatureSource
|
||||
private readonly _layerToShow: LayerConfig;
|
||||
private readonly _selectedElement: UIEventSource<any>
|
||||
private readonly allElements : ElementStorage
|
||||
private readonly allElements: ElementStorage
|
||||
// Used to generate a fresh ID when needed
|
||||
private _cleanCount = 0;
|
||||
private geoLayer = undefined;
|
||||
|
@ -31,7 +31,7 @@ export default class ShowDataLayer {
|
|||
*/
|
||||
private readonly leafletLayersPerId = new Map<string, { feature: any, leafletlayer: any }>()
|
||||
|
||||
private readonly showDataLayerid : number;
|
||||
private readonly showDataLayerid: number;
|
||||
private static dataLayerIds = 0
|
||||
|
||||
constructor(options: ShowDataLayerOptions & { layerToShow: LayerConfig }) {
|
||||
|
@ -104,7 +104,7 @@ export default class ShowDataLayer {
|
|||
leafletLayer.openPopup()
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
this.update(options)
|
||||
|
||||
}
|
||||
|
@ -146,17 +146,21 @@ export default class ShowDataLayer {
|
|||
continue
|
||||
}
|
||||
try {
|
||||
|
||||
if((feat.geometry.type === "LineString" || feat.geometry.type === "MultiLineString")) {
|
||||
|
||||
if ((feat.geometry.type === "LineString" || feat.geometry.type === "MultiLineString")) {
|
||||
const self = this;
|
||||
const coords = L.GeoJSON.coordsToLatLngs(feat.geometry.coordinates)
|
||||
const tagsSource = this.allElements?.addOrGetElement(feat) ?? new UIEventSource<any>(feat.properties);
|
||||
const lineStyle = this._layerToShow.lineRendering[feat.lineRenderingIndex].GenerateLeafletStyle(tagsSource)
|
||||
const offsettedLine = L.polyline(coords, lineStyle);
|
||||
|
||||
this.postProcessFeature(feat, offsettedLine)
|
||||
|
||||
offsettedLine.addTo(this.geoLayer)
|
||||
}else{
|
||||
let offsettedLine;
|
||||
tagsSource.map(tags => this._layerToShow.lineRendering[feat.lineRenderingIndex].GenerateLeafletStyle(tags)).addCallbackAndRunD(lineStyle => {
|
||||
if (offsettedLine !== undefined) {
|
||||
self.geoLayer.removeLayer(offsettedLine)
|
||||
}
|
||||
offsettedLine = L.polyline(coords, lineStyle);
|
||||
this.postProcessFeature(feat, offsettedLine)
|
||||
offsettedLine.addTo(this.geoLayer)
|
||||
})
|
||||
} else {
|
||||
this.geoLayer.addData(feat);
|
||||
}
|
||||
} catch (e) {
|
||||
|
@ -183,20 +187,20 @@ export default class ShowDataLayer {
|
|||
const tagsSource = this.allElements?.addOrGetElement(feature) ?? new UIEventSource<any>(feature.properties);
|
||||
// Every object is tied to exactly one layer
|
||||
const layer = this._layerToShow
|
||||
|
||||
|
||||
const pointRenderingIndex = feature.pointRenderingIndex
|
||||
const lineRenderingIndex = feature.lineRenderingIndex
|
||||
|
||||
if(pointRenderingIndex !== undefined){
|
||||
|
||||
if (pointRenderingIndex !== undefined) {
|
||||
return {
|
||||
icon: layer.mapRendering[pointRenderingIndex].GenerateLeafletStyle(tagsSource, this._enablePopups)
|
||||
}
|
||||
}
|
||||
if(lineRenderingIndex !== undefined){
|
||||
if (lineRenderingIndex !== undefined) {
|
||||
return layer.lineRendering[lineRenderingIndex].GenerateLeafletStyle(tagsSource)
|
||||
}
|
||||
|
||||
throw "Neither lineRendering nor mapRendering defined for "+feature
|
||||
throw "Neither lineRendering nor mapRendering defined for " + feature
|
||||
}
|
||||
|
||||
private pointToLayer(feature, latLng): L.Layer {
|
||||
|
@ -211,7 +215,7 @@ export default class ShowDataLayer {
|
|||
|
||||
let tagSource = this.allElements?.getEventSourceById(feature.properties.id) ?? new UIEventSource<any>(feature.properties)
|
||||
const clickable = !(layer.title === undefined && (layer.tagRenderings ?? []).length === 0)
|
||||
let style : any = layer.mapRendering[feature.pointRenderingIndex].GenerateLeafletStyle(tagSource, clickable);
|
||||
let style: any = layer.mapRendering[feature.pointRenderingIndex].GenerateLeafletStyle(tagSource, clickable);
|
||||
const baseElement = style.html;
|
||||
if (!this._enablePopups) {
|
||||
baseElement.SetStyle("cursor: initial !important")
|
||||
|
@ -276,7 +280,7 @@ export default class ShowDataLayer {
|
|||
feature: feature,
|
||||
leafletlayer: leafletLayer
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -26,6 +26,9 @@ export default class Translations {
|
|||
if (t === undefined || t === null) {
|
||||
return undefined;
|
||||
}
|
||||
if(typeof t === "number"){
|
||||
t = ""+t
|
||||
}
|
||||
if (typeof t === "string") {
|
||||
return new Translation({"*": t}, context);
|
||||
}
|
||||
|
|
|
@ -41,7 +41,7 @@
|
|||
"tagRenderings": [],
|
||||
"mapRendering": [
|
||||
{
|
||||
"color": "#ddd",
|
||||
"color": "#ffffff55",
|
||||
"width": 8
|
||||
},
|
||||
{
|
||||
|
@ -49,11 +49,12 @@
|
|||
"render": "#888"
|
||||
},
|
||||
"width": {
|
||||
"render": "8",
|
||||
"render": 6,
|
||||
"mappings": [
|
||||
{
|
||||
"if": {
|
||||
"or": [
|
||||
"sidewalk:left=",
|
||||
"sidewalk:left=no",
|
||||
"sidewalk:left=separate"
|
||||
]
|
||||
|
@ -62,12 +63,26 @@
|
|||
}
|
||||
]
|
||||
},
|
||||
"offset": -8
|
||||
"offset": -6
|
||||
},
|
||||
{
|
||||
"color": "#888",
|
||||
"width": 8,
|
||||
"offset": 8
|
||||
"width": {
|
||||
"render": 6,
|
||||
"mappings": [
|
||||
{
|
||||
"if": {
|
||||
"or": [
|
||||
"sidewalk:right=",
|
||||
"sidewalk:right=no",
|
||||
"sidewalk:right=separate"
|
||||
]
|
||||
},
|
||||
"then": 0
|
||||
}
|
||||
]
|
||||
},
|
||||
"offset": 6
|
||||
}
|
||||
],
|
||||
"allowSplit": true
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue