How to write hyperlinks to local files in GeoJSON properties?Clickable hyperlink from GeoJSON field in featureHow to make a displayed geoJson property a link to another property in a Leaflet popupGeoJSON opening hyperlink to local file in the local aplication instead of browserSelect independent objects using GEOJson on OpenlayersSelecting feature programmatically from GeoJSON using OpenLayers?Loading GEOJSON in Leaflet and separating attributesMarkerCluster don't work with geojson layer in leafletChange style of GeoJSON circle marker by feature propertiesLeaflet L.geoJSON from a js variable geojson object not showing on mapHow to append geojson file using featureselectionGet GeoJSON from a database by the AJAX method for OpenLayers

Can a Rogue PC teach an NPC to perform Sneak Attack?

How to gently end involvement with an online community?

Add newline to prompt if it's too long

How to determine car loan length as a function of how long I plan to keep a car

Why isn't "I've" a proper response?

How many String objects would be created when concatenating multiple Strings?

Lost property on Portuguese trains

Most natural way to use the negative with つもり

Did a flight controller ever answer Flight with a no-go?

pgfplots: Missing one group of bars

Can RMSE and MAE have the same value?

“T” in subscript in formulas

Very slow boot time and poor perfomance

Transposing from C to Cm?

Is gzip atomic?

Is there any way to keep a player from killing an NPC?

What is the best type of paint to paint a shipping container?

Disambiguation of "nobis vobis" and "nobis nobis"

How long do you think advanced cybernetic implants would plausibly last?

Uri tokenizer as a simple state machine

Network helper class with retry logic on failure

Is "The life is beautiful" incorrect or just very non-idiomatic?

Are modern clipless shoes and pedals that much better than toe clips and straps?

French abbreviation for comparing two items ("vs")



How to write hyperlinks to local files in GeoJSON properties?


Clickable hyperlink from GeoJSON field in featureHow to make a displayed geoJson property a link to another property in a Leaflet popupGeoJSON opening hyperlink to local file in the local aplication instead of browserSelect independent objects using GEOJson on OpenlayersSelecting feature programmatically from GeoJSON using OpenLayers?Loading GEOJSON in Leaflet and separating attributesMarkerCluster don't work with geojson layer in leafletChange style of GeoJSON circle marker by feature propertiesLeaflet L.geoJSON from a js variable geojson object not showing on mapHow to append geojson file using featureselectionGet GeoJSON from a database by the AJAX method for OpenLayers






.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;








2















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?



Hyperlink to the local file










share|improve this question
































    2















    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?



    Hyperlink to the local file










    share|improve this question




























      2












      2








      2








      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?



      Hyperlink to the local file










      share|improve this question
















      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?



      Hyperlink to the local file







      leaflet javascript geojson hyperlink






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Aug 12 at 14:39









      IvanSanchez

      6,9421 gold badge10 silver badges22 bronze badges




      6,9421 gold badge10 silver badges22 bronze badges










      asked Aug 12 at 14:05









      Mariusz KrukarMariusz Krukar

      497 bronze badges




      497 bronze badges























          1 Answer
          1






          active

          oldest

          votes


















          4















          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 ..."
          ,


          If you were not using Windows but Linux or Mac, you could forego backslashes altogether, e.g. ...



           "properties": 
          "URL": "file:////home/user/Fixed Line/Design ..."
          ,


          Using forward slashes in lieu of backslashes in a Windows environment might or might not work for hyperlinks.



          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) + "'>");





          share|improve this answer





























            Your Answer








            StackExchange.ready(function()
            var channelOptions =
            tags: "".split(" "),
            id: "79"
            ;
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function()
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled)
            StackExchange.using("snippets", function()
            createEditor();
            );

            else
            createEditor();

            );

            function createEditor()
            StackExchange.prepareEditor(
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: false,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: null,
            bindNavPrevention: true,
            postfix: "",
            imageUploader:
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            ,
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            );



            );













            draft saved

            draft discarded


















            StackExchange.ready(
            function ()
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f331746%2fhow-to-write-hyperlinks-to-local-files-in-geojson-properties%23new-answer', 'question_page');

            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            4















            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 ..."
            ,


            If you were not using Windows but Linux or Mac, you could forego backslashes altogether, e.g. ...



             "properties": 
            "URL": "file:////home/user/Fixed Line/Design ..."
            ,


            Using forward slashes in lieu of backslashes in a Windows environment might or might not work for hyperlinks.



            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) + "'>");





            share|improve this answer































              4















              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 ..."
              ,


              If you were not using Windows but Linux or Mac, you could forego backslashes altogether, e.g. ...



               "properties": 
              "URL": "file:////home/user/Fixed Line/Design ..."
              ,


              Using forward slashes in lieu of backslashes in a Windows environment might or might not work for hyperlinks.



              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) + "'>");





              share|improve this answer





























                4














                4










                4









                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 ..."
                ,


                If you were not using Windows but Linux or Mac, you could forego backslashes altogether, e.g. ...



                 "properties": 
                "URL": "file:////home/user/Fixed Line/Design ..."
                ,


                Using forward slashes in lieu of backslashes in a Windows environment might or might not work for hyperlinks.



                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) + "'>");





                share|improve this answer















                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 ..."
                ,


                If you were not using Windows but Linux or Mac, you could forego backslashes altogether, e.g. ...



                 "properties": 
                "URL": "file:////home/user/Fixed Line/Design ..."
                ,


                Using forward slashes in lieu of backslashes in a Windows environment might or might not work for hyperlinks.



                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) + "'>");






                share|improve this answer














                share|improve this answer



                share|improve this answer








                edited Aug 13 at 14:03

























                answered Aug 12 at 14:38









                IvanSanchezIvanSanchez

                6,9421 gold badge10 silver badges22 bronze badges




                6,9421 gold badge10 silver badges22 bronze badges






























                    draft saved

                    draft discarded
















































                    Thanks for contributing an answer to Geographic Information Systems Stack Exchange!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid


                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.

                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function ()
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f331746%2fhow-to-write-hyperlinks-to-local-files-in-geojson-properties%23new-answer', 'question_page');

                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    Popular posts from this blog

                    Category:9 (number) SubcategoriesMedia in category "9 (number)"Navigation menuUpload mediaGND ID: 4485639-8Library of Congress authority ID: sh85091979ReasonatorScholiaStatistics

                    Circuit construction for execution of conditional statements using least significant bitHow are two different registers being used as “control”?How exactly is the stated composite state of the two registers being produced using the $R_zz$ controlled rotations?Efficiently performing controlled rotations in HHLWould this quantum algorithm implementation work?How to prepare a superposed states of odd integers from $1$ to $sqrtN$?Why is this implementation of the order finding algorithm not working?Circuit construction for Hamiltonian simulationHow can I invert the least significant bit of a certain term of a superposed state?Implementing an oracleImplementing a controlled sum operation

                    Magento 2 “No Payment Methods” in Admin New OrderHow to integrate Paypal Express Checkout with the Magento APIMagento 1.5 - Sales > Order > edit order and shipping methods disappearAuto Invoice Check/Money Order Payment methodAdd more simple payment methods?Shipping methods not showingWhat should I do to change payment methods if changing the configuration has no effects?1.9 - No Payment Methods showing upMy Payment Methods not Showing for downloadable/virtual product when checkout?Magento2 API to access internal payment methodHow to call an existing payment methods in the registration form?