forked from MapComplete/MapComplete
		
	Automatically place the label below the icon
This commit is contained in:
		
							parent
							
								
									a50913a094
								
							
						
					
					
						commit
						b6b22526dd
					
				
					 3 changed files with 8 additions and 5 deletions
				
			
		|  | @ -325,7 +325,7 @@ export default class LayerConfig { | |||
|         const weight = rendernum(this.width, 5); | ||||
| 
 | ||||
|         const iconW = num(iconSize[0]); | ||||
|         const iconH = num(iconSize[1]); | ||||
|         let iconH = num(iconSize[1]); | ||||
|         const mode = iconSize[2] ?? "center" | ||||
| 
 | ||||
|         let anchorW = iconW / 2; | ||||
|  | @ -375,7 +375,7 @@ export default class LayerConfig { | |||
|             const rotation = render(self.rotation, "0deg"); | ||||
| 
 | ||||
|             let htmlParts: UIElement[] = []; | ||||
|             let sourceParts = iconUrl.split(";").filter(prt => prt != ""); | ||||
|             let sourceParts = Utils.NoNull(iconUrl.split(";").filter(prt => prt != "")); | ||||
|             for (const sourcePart of sourceParts) { | ||||
|                 htmlParts.push(genHtmlFromString(sourcePart)) | ||||
|             } | ||||
|  | @ -410,8 +410,11 @@ export default class LayerConfig { | |||
|                 htmlParts.push(badgesComponent) | ||||
|             } | ||||
| 
 | ||||
|             if(sourceParts.length ==0){iconH = 0} | ||||
| 
 | ||||
|             const label = self.label.GetRenderValue(tgs)?.Subs(tgs).SetClass("block w-min text-center") | ||||
|             const label = self.label.GetRenderValue(tgs)?.Subs(tgs) | ||||
|                 .SetClass("block w-min text-center") | ||||
|                 .SetStyle("margin-top: "+(iconH + 2) +"px") | ||||
|             console.log("Generating label gave ", label, " source: ", self.label, "tags: ", tgs) | ||||
|             if (label !== undefined) { | ||||
|                 htmlParts.push(new Combine([label]).SetClass("flex flex-col items-center")) | ||||
|  |  | |||
|  | @ -131,7 +131,7 @@ export interface LayerConfigJson { | |||
|     rotation?: string | TagRenderingConfigJson; | ||||
|     /** | ||||
|      * A HTML-fragment that is shown at the center of the icon, for example:  | ||||
|      * <div style="margin-top: 50px; background: white; display: block">{name}</div> | ||||
|      * <div style="background: white; display: block">{name}</div> | ||||
|      */ | ||||
|     label?: string | TagRenderingConfigJson ; | ||||
|      | ||||
|  |  | |||
|  | @ -43,7 +43,7 @@ | |||
|     "mappings": [ | ||||
|       { | ||||
|         "if": "name~*", | ||||
|         "then": "<div style='margin-top: 42px; background: white; padding: 0.25em; border-radius:0.5em'>{name}</div>" | ||||
|         "then": "<div style='background: white; padding: 0.25em; border-radius:0.5em'>{name}</div>" | ||||
|       } | ||||
|     ] | ||||
|   }, | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue