Mfcttrf

I am wondering how to make a hyperlink from GeoJSON file properties to the local drive file.
I found two options here:

Clickable hyperlink from GeoJSON field in feature
this option refers to a whole .geojson file, whereas I need to have an unique hyperlink for every single object property included in this file

This option:

How to make a displayed geoJson property a link to another property in a Leaflet popup

Looks better, but I have problems with implementation it into my code, that looks:

var church = L.geoJSON(test, 
 pointToLayer: function(feature, latlng) 
 feature.properties.myKey =
 feature.properties.Title + ", " + feature.properties.Head;
 return L.circleMarker(latlng, geojsonMarkerOptions2);
 ,
 onEachFeature: function(feature, layer) 
 layer.bindPopup(
 '<h1><u><font color="red">' +
 feature.properties.Title +
 "</h1></u></font><h2>Address: " +
 feature.properties.Head +
 "</h2><p>" +
 feature.properties.Description +
 "</p><a href='" +
 feature.properties.URL +
 "'>"
 );
 
).addTo(map);

Once I put a single link in GeoJSON file property, then works fine:

 "type": "FeatureCollection",
 "features": [
 
 "type": "Feature",
 "properties": 
 "Title": "Sitec IS",
 "Head": "7400 Beach Drive",
 "Description": "Gavin Sinclair"
 ,
 "geometry": 
 "type": "Point",
 "coordinates": [0.16964435577392578, 52.29220753602784]
 
 ,
 
 "type": "Feature",
 "properties": 
 "Title": "JHG",
 "Head": "Shortstanton sidings",
 "Description": "Conor Murphy",
 "URL": "<a href='https://www.johnhenrygroup.co.uk/' target='blank'>JHG</a>"
 ,
 "geometry": 
 "type": "Point",
 "coordinates": [0.05458831787109375, 52.29163006501503]
 
 
 ]

However I would like to have a path to my local file instead of URL...

 "type": "FeatureCollection",
 "features": [
 
 "type": "Feature",
 "properties": 
 "Title": "Priory Court",
 "Head": "188 Albany Road",
 "Description": "MDU",
 "URL": "file:\Z:Fixed LineDesign & Build2. ClientsOpenreach3. MDU DesignsCoventryOR66 - Priory Court, Coventry"
 ,
 "geometry": 
 "type": "Point",
 "coordinates": [-1.530101, 52.400199]
 
 ,
 
 "type": "Feature",
 "properties": 
 "Title": "Stretham house",
 "Head": "Flat to leave",
 "Description": "N/A"
 ,
 "geometry": 
 "type": "Point",
 "coordinates": [0.211212, 52.344149]
 
 
 ]

but the code doesn't work at all.
I believe, that problem lies somewhere in the apostrophs/quotation marks. I have an empty text instead or nothing.

Is there some option to make the hyperlink towards a specified path in the local drive file/folder, analogically i.e to the MS Excel?

Couple of subtly wrong things here.

1. A file URL starts with file:///, not with file:\, as per the WhatWG URL specification




2. Backslashes in JSON must be escaped (from to \), as explained in this answer on stackoverflow

Therefore, you should replace...

 "properties": 
 "URL": "file:\Z:Fixed LineDesign ..."
 ,

...with something like...

 "properties": 
 "URL": "file:///Z:\Fixed Line\Design ..."
 ,

Note that, because it's a escaped string, doing a console.log(feature.properties.URL) will output file:///Z:Fixed LineDesign....

Also note that, because of how you're concatenating strings together at...

layer.bindPopup("<a href='" + feature.properties.URL + "'>");

...things will fail if your filenames contain quotes or double quotes. Consider using encodeURI() (don't forget to check the reference), e.g.:

layer.bindPopup("<a href='" + encodeURI(feature.properties.URL) + "'>");