midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

General cleanup, improve sidewalk rendering

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-10-22 02:16:07 +02:00
parent 20fa5028d9
commit 72edc9bdcc
6 changed files with 53 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

6
Logic/SimpleMetaTagger.ts
View file

@ -97,9 +97,9 @@ export default class SimpleMetaTagger {
/** /**
* Sets the key onto the properties (but doesn't overwrite if already existing) * Sets the key onto the properties (but doesn't overwrite if already existing)
*/ */
function set(key, value) { function set(k, value) {
if (tgs[key] === undefined || tgs[key] === "") { if (tgs[k] === undefined || tgs[k] === "") {
tgs[key] = value tgs[k] = value
somethingChanged = true somethingChanged = true
} }
} }

10
Models/ThemeConfig/LineRenderingConfig.ts
View file

@ -25,10 +25,7 @@ export default class LineRenderingConfig extends WithContextLoader {
this.offset = this.tr("offset", "0"); this.offset = this.tr("offset", "0");
} }
public GenerateLeafletStyle( tags: {} ):
public GenerateLeafletStyle(
tags: UIEventSource<any>
):
{ {
color: string, color: string,
weight: number, weight: number,
@ -48,8 +45,8 @@ export default class LineRenderingConfig extends WithContextLoader {
if (tags === undefined) { if (tags === undefined) {
return deflt return deflt
} }
const str = tr?.GetRenderValue(tags.data)?.txt ?? deflt; const str = tr?.GetRenderValue(tags)?.txt ?? deflt;
return Utils.SubstituteKeys(str, tags.data)?.replace(/{.*}/g, ""); return Utils.SubstituteKeys(str, tags)?.replace(/{.*}/g, "");
} }
const dashArray = render(this.dashArray)?.split(" ")?.map(Number); 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 weight = rendernum(this.width, 5);
const offset = rendernum(this.offset, 0) const offset = rendernum(this.offset, 0)
console.log("Calculated offset:", offset, "for", this.offset)
return { return {
color, color,
weight, weight,

2
Models/ThemeConfig/TagRenderingConfig.ts
View file

@ -141,7 +141,7 @@ export default class TagRenderingConfig {
const mp = { const mp = {
if: TagUtils.Tag(mapping.if, `${mappingContext}.if`), if: TagUtils.Tag(mapping.if, `${mappingContext}.if`),
ifnot: (mapping.ifnot !== undefined ? TagUtils.Tag(mapping.ifnot, `${mappingContext}.ifnot`) : undefined), 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 hideInAnswer: hideInAnswer
}; };
if (this.question) { if (this.question) {

42
UI/ShowDataLayer/ShowDataLayer.ts
View file

@ -16,7 +16,7 @@ export default class ShowDataLayer {
private readonly _features: RenderingMultiPlexerFeatureSource private readonly _features: RenderingMultiPlexerFeatureSource
private readonly _layerToShow: LayerConfig; private readonly _layerToShow: LayerConfig;
private readonly _selectedElement: UIEventSource<any> private readonly _selectedElement: UIEventSource<any>
private readonly allElements : ElementStorage private readonly allElements: ElementStorage
// Used to generate a fresh ID when needed // Used to generate a fresh ID when needed
private _cleanCount = 0; private _cleanCount = 0;
private geoLayer = undefined; private geoLayer = undefined;
@ -31,7 +31,7 @@ export default class ShowDataLayer {
*/ */
private readonly leafletLayersPerId = new Map<string, { feature: any, leafletlayer: any }>() private readonly leafletLayersPerId = new Map<string, { feature: any, leafletlayer: any }>()
private readonly showDataLayerid : number; private readonly showDataLayerid: number;
private static dataLayerIds = 0 private static dataLayerIds = 0
constructor(options: ShowDataLayerOptions & { layerToShow: LayerConfig }) { constructor(options: ShowDataLayerOptions & { layerToShow: LayerConfig }) {
@ -104,7 +104,7 @@ export default class ShowDataLayer {
leafletLayer.openPopup() leafletLayer.openPopup()
} }
}) })
this.update(options) this.update(options)
} }
@ -146,17 +146,21 @@ export default class ShowDataLayer {
continue continue
} }
try { 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 coords = L.GeoJSON.coordsToLatLngs(feat.geometry.coordinates)
const tagsSource = this.allElements?.addOrGetElement(feat) ?? new UIEventSource<any>(feat.properties); const tagsSource = this.allElements?.addOrGetElement(feat) ?? new UIEventSource<any>(feat.properties);
const lineStyle = this._layerToShow.lineRendering[feat.lineRenderingIndex].GenerateLeafletStyle(tagsSource) let offsettedLine;
const offsettedLine = L.polyline(coords, lineStyle); tagsSource.map(tags => this._layerToShow.lineRendering[feat.lineRenderingIndex].GenerateLeafletStyle(tags)).addCallbackAndRunD(lineStyle => {
if (offsettedLine !== undefined) {
this.postProcessFeature(feat, offsettedLine) self.geoLayer.removeLayer(offsettedLine)
}
offsettedLine.addTo(this.geoLayer) offsettedLine = L.polyline(coords, lineStyle);
}else{ this.postProcessFeature(feat, offsettedLine)
offsettedLine.addTo(this.geoLayer)
})
} else {
this.geoLayer.addData(feat); this.geoLayer.addData(feat);
} }
} catch (e) { } catch (e) {
@ -183,20 +187,20 @@ export default class ShowDataLayer {
const tagsSource = this.allElements?.addOrGetElement(feature) ?? new UIEventSource<any>(feature.properties); const tagsSource = this.allElements?.addOrGetElement(feature) ?? new UIEventSource<any>(feature.properties);
// Every object is tied to exactly one layer // Every object is tied to exactly one layer
const layer = this._layerToShow const layer = this._layerToShow
const pointRenderingIndex = feature.pointRenderingIndex const pointRenderingIndex = feature.pointRenderingIndex
const lineRenderingIndex = feature.lineRenderingIndex const lineRenderingIndex = feature.lineRenderingIndex
if(pointRenderingIndex !== undefined){ if (pointRenderingIndex !== undefined) {
return { return {
icon: layer.mapRendering[pointRenderingIndex].GenerateLeafletStyle(tagsSource, this._enablePopups) icon: layer.mapRendering[pointRenderingIndex].GenerateLeafletStyle(tagsSource, this._enablePopups)
} }
} }
if(lineRenderingIndex !== undefined){ if (lineRenderingIndex !== undefined) {
return layer.lineRendering[lineRenderingIndex].GenerateLeafletStyle(tagsSource) 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 { 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) let tagSource = this.allElements?.getEventSourceById(feature.properties.id) ?? new UIEventSource<any>(feature.properties)
const clickable = !(layer.title === undefined && (layer.tagRenderings ?? []).length === 0) 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; const baseElement = style.html;
if (!this._enablePopups) { if (!this._enablePopups) {
baseElement.SetStyle("cursor: initial !important") baseElement.SetStyle("cursor: initial !important")
@ -276,7 +280,7 @@ export default class ShowDataLayer {
feature: feature, feature: feature,
leafletlayer: leafletLayer leafletlayer: leafletLayer
}) })
} }

3
UI/i18n/Translations.ts
View file

@ -26,6 +26,9 @@ export default class Translations {
if (t === undefined || t === null) { if (t === undefined || t === null) {
return undefined; return undefined;
} }
if(typeof t === "number"){
t = ""+t
}
if (typeof t === "string") { if (typeof t === "string") {
return new Translation({"*": t}, context); return new Translation({"*": t}, context);
} }

25
assets/themes/sidewalks/sidewalks.json
View file

@ -41,7 +41,7 @@
"tagRenderings": [], "tagRenderings": [],
"mapRendering": [ "mapRendering": [
{ {
"color": "#ddd", "color": "#ffffff55",
"width": 8 "width": 8
}, },
{ {
@ -49,11 +49,12 @@
"render": "#888" "render": "#888"
}, },
"width": { "width": {
"render": "8", "render": 6,
"mappings": [ "mappings": [
{ {
"if": { "if": {
"or": [ "or": [
"sidewalk:left=",
"sidewalk:left=no", "sidewalk:left=no",
"sidewalk:left=separate" "sidewalk:left=separate"
] ]
@ -62,12 +63,26 @@
} }
] ]
}, },
"offset": -8 "offset": -6
}, },
{ {
"color": "#888", "color": "#888",
"width": 8, "width": {
"offset": 8 "render": 6,
"mappings": [
{
"if": {
"or": [
"sidewalk:right=",
"sidewalk:right=no",
"sidewalk:right=separate"
]
},
"then": 0
}
]
},
"offset": 6
} }
], ],
"allowSplit": true "allowSplit": true