English Wikipedia @ Freddythechick

Template:Graph:Map with marks

This is the current revision of this page, as edited by imported>Izno at 23:15, 10 June 2023 (orphan the templatestyles page per tfd). The present address (URL) is a permanent link to this version.

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

<graph> { 

 //
 // ATTENTION: This code is maintained at https://www.mediawiki.org/wiki/Template:Graph:Map_with_marks
 //            Please do not modify it anywhere else, as it may get copied and override your changes.
 //            Suggestions can be made at https://www.mediawiki.org/wiki/Template_talk:Graph:Map_with_marks
 //
 "version": 2, "width":400, "height": 200, "padding": 0,
 "signals":[
   // These signals allow us to quickly move the map within the image, e.g. to leave space for the legend
   {"name":"imgXC", "init": {"expr": "width/2"} },
   {"name":"imgYC", "init": {"expr": "height/2"} },
   {"name":"imgWidth", "init": {"expr": "width"} },
   {"name":"imgHeight", "init": {"expr": "height"} },
   // Bounding box uses [left, bottom, right, top]
   // Longitude: max left..right range is -180..180
   // Latitude: max bottom..top range is -90..90
   {"name":"imgBoundingBox", "init": {"expr": "[-180,-90,180,90]"} }
 ],
 "data": [
   {
     "name": "data",
     "values": [ 
       {"lat":20, "lon":-120, "color":"#0f0"},
       {"lat":40, "lon":-120, "shape":"diamond", "color":"#0f0", "size": 80, "text": "Some cool text", "textColor": "#0ff", "textFontSize": 20, "textBaseline": "middle"},
       // BUG!  raw SVG image will NOT render properly on the server. Make sure to specify image pixel size, e.g. "|32"
       {"lat":-10, "lon":20, "img":"wikirawupload:https://upload.wikimedia.org/wikipedia/commons/thumb/b/b3/Volcano_red_32x32.svg/32px-Volcano_red_32x32.svg.png", "offsetY":-10},
       {"lat":0, "lon":0, "img":"wikirawupload:https://upload.wikimedia.org/wikipedia/commons/thumb/b/b3/Volcano_red_32x32.svg/32px-Volcano_red_32x32.svg.png", "width":25, "height": 25, "offsetY":-10, "text": "Big volcano", "textFontWeight": "bold", "textFontSize": 20, "textColor": "#fff"}
       
     ],
     "transform": [
       {
         "type": "geo",
         "projection": "equirectangular",
         "scale": {"expr": "max(360/(imgBoundingBox[2]-imgBoundingBox[0]),180/(imgBoundingBox[3]-imgBoundingBox[1]))*imgWidth/2/PI"},
         "translate": [{"expr": "imgXC"}, {"expr": "imgYC"}],
         "center": [{"expr": "(imgBoundingBox[0]+imgBoundingBox[2])/2"}, {"expr": "(imgBoundingBox[1]+imgBoundingBox[3])/2"}],
         "lon": "lon", "lat": "lat"
       },
       { "type": "formula", "field":"layout_x", "expr": "datum.layout_x + (datum.offsetX || 0)" },
       { "type": "formula", "field":"layout_y", "expr": "datum.layout_y + (datum.offsetY || 0)" },
       { "type": "formula", "field":"color", "expr": "datum.color || '#ff0000'" },
       { "type": "formula", "field":"textColor", "expr": "datum.textColor || datum.color" }
     ]
   }
 ],
 "marks": [{
     "type": "image",
     "properties": {
       "enter": {
         "url": {"value": "wikirawupload:"},
         "xc": {"signal": "imgXC"}, "yc": {"signal": "imgYC"},
         "width": {"signal": "imgWidth"}, "height": {"signal": "imgHeight"}
       }
     }
   },
   {
     // Places an image of a given name and size at the [lan,lon] location
     "type": "image",
     "from": {
       "data": "data",
       "transform": [
         { "type": "filter", "test": "datum.img" },
         { "type": "formula", "field":"iconWidth", "expr": "datum.width || 0" },
         { "type": "formula", "field":"iconHeight", "expr": "datum.height || 0" }
     ]},
     "properties": {
       "enter": {
         "url": {"field": "img"},
         "xc": {"field": "layout_x"}, "yc": {"field": "layout_y"},
         "width": {"field": "iconWidth"}, "height": {"field": "iconHeight"}
       }
     }
   },
   {
     // Draw marks of a given color, shape, and size at the [lan,lon] location
     "type": "symbol",
     "from": {
       "data": "data",
       "transform": [{ "type": "filter", "test": "!datum.img" }]
     },
     "properties": {
       "enter": {
         "x": {"field": "layout_x"},
         "y": {"field": "layout_y"},
         "fill": {"field": "color"},
         "size": {"field": "size"},
         "shape": {"field": "shape"}
       }
     }
   },
   {
     // Draw text with the given color and size at the [lan,lon] location
     // See https://github.com/vega/vega/wiki/Marks#text for all parameter description (prepend "text" and capitalize them)
     "type": "text",
     "from": {
       "data": "data",
       "transform": [
         { "type": "filter", "test": "datum.text" },
         // Figure out if this is an LTR or RTL page. For LTR, show label to the right of the icon, left-aligned. For RTL, reverse.
         { "type": "formula", "field":"isLTR", "expr": "'‎' == '\\u200E'" },
         // If these values are not defined ("undefined" is not allowed, so test for truthiness and not 0)
         { "type": "formula", "field":"textDx", "expr": "if(!datum.textDx && datum.textDx != 0, if(datum.isLTR,8,-8), datum.textDx)" },
         { "type": "formula", "field":"textAlign", "expr": "if(!datum.textAlign, if(datum.isLTR,'left','right'), datum.textAlign)" },
         { "type": "formula", "field":"textBaseline", "expr": "datum.textBaseline || 'middle'" }
     ]},
     "properties": {
       "enter": {
         "text": {"field": "text"},
         "x": {"field": "layout_x" },
         "y": {"field": "layout_y"},
         "dx": {"field": "textDx" },
         "dy": {"field": "textDy"},
         "fill": {"field": "textColor"},
         "align": {"field": "textAlign"},
         "baseline": {"field": "textBaseline"},
         "radius": {"field": "textRadius"},
         "theta": {"field": "textTheta"},
         "angle": {"field": "textAngle"},
         "font": {"field": "textFont"},
         "fontSize": {"field": "textFontSize"},
         "fontWeight": {"field": "textFontWeight"},
         "fontStyle": {"field": "textFontStyle"}
       }
     }
   }
 ]

}

</graph>

Retrieved from "https://enwiki.freddythechick.net/index.php?title=Template:Graph:Map_with_marks&oldid=7866111"