[GIS] How to add hyperlink in geojson popup in Leaflet

geojsonhyperlinkleafletpopup

I am trying to add a geojson layer with interactive functionality to my leaflet map. I am mostly using this (dated)blog: http://palewi.re/posts/2012/03/26/leaflet-recipe-hover-events-features-and-polygons/

My result to date: http://185.19.29.113:8080/cresh_map/mapgeojson.html

Could anybody help me with this question:

How can I show feature.url_temp as a hyperlink in the popup?

Best Answer

If you mean you want this to be an actual clickable link, you are most of the way there. I would break up how you construct the content of the popup to be a little more explicit: 

var hed = $("<div>", {
  css: {fontSize: "16px", marginBottom: "3px"}
}).appendTo(popup);

var span = $("<span>", {
    text: "District " + properties.datazone + ": "
}).appendTo(hed);

var link = $("<a>", {
  href: properties.url_temp,
  text: "click",
  target: "_blank"
}).appendTo(span);

You may need to shift the css around, or better yet, add ids or classes and make style declarations outside of your javascript

Related Question