How to replace data in my javascript file with hyperlink to this file

Question

I'm having a script to view polygons on google maps, but I want to change my polygon coordinates when I click on hyperlink. This the script which I'm using:

<!DOCTYPE html>
 <html>
    <head>
    <script src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY_IS_HERE&libraries=geometry,places&ext=.js" ></script>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <div id="map_canvas" ></div>
    <style>
            /* Always set the map height explicitly to define the size of the div
            * element that contains the map. */
            #map_canvas {
                height: 100%;
            }
            /* Optional: Makes the sample page fill the window. */
            html, body {
                height: 100%;
                margin: 0;
                padding: 0;
            }
            </style>
    </head>
    <body> 
    <script>
        var map;
        var bounds = new google.maps.LatLngBounds();

        // your POLYGON
        var polygonStr = "POLYGON (24.935955 42.32732, 24.943297 42.3268, 24.944593 42.322991, 24.94438 42.317172, 24.940584 42.317919, 24.936224 42.320232, 24.933244 42.322896, 24.927394 42.327057, 24.934312 42.328296, 24.93242 42.326795)";


       function initialize() {
           map = new google.maps.Map(
           document.getElementById("map_canvas"), {
               center: new google.maps.LatLng(42.156801, 24.749468),
               zoom: 4,
               mapTypeId: google.maps.MapTypeId.ROADMAP
           });
          drawPoly(polygonStr);
          map.fitBounds(bounds);
      }

      function drawPoly(multipolygonWKT) {
          var polylines = [];
          var toReturn = [];
          multipolygonWKT = multipolygonWKT.replace("POLYGON ", "");
          var formattedValues = multipolygonWKT.replace("))", "");
          formattedValues = formattedValues.replace("((", "");

          var linesCoords = formattedValues.split("), (");

          for (i = 0; i < linesCoords.length; i++) {
              polylines[i] = [];
              var singleLine = linesCoords[i].split(", ");

              for (j = 0; j < singleLine.length; j++) {
                  var coordinates = singleLine[j].split(" ");
                  var latlng = new google.maps.LatLng(parseFloat(coordinates[1]), parseFloat(coordinates[0]));
                  bounds.extend(latlng);

                  polylines[i].push(latlng);

              }
          }

          toReturn.push(
              new google.maps.Polygon({
                  map: map,
                  paths: polylines,
                  strokeColor: 'red',
                  strokeOpacity: 1,
                  strokeWeight: 2,
                  zIndex: 1
              }));
              return toReturn;
          }

          google.maps.event.addDomListener(window, "load", initialize);
    </script>
    </body> 
</html>

When I try to call the file with a hyperlink with new coordinates nothing hapens for example 'file:///C:\Users\Desktop\MyfileName.html?q="POLYGON (here I put my new coordinates)" My idea is to change the coordinates which are in the script with the new one from my hyperlink. Is that possible? If it is possible how? Almost forgot to say that the file is on my computer and I want to open it from where it is.

EDIT: Here is some more info about what I want to do.I have created an attribute in the program which I use - Geomedia and I can create a hyperlink with coordinates of the drawn polygon. enter image description here I want when I click link to have the polygon opened in google maps. I tryed to make the hyperlink directly to google , but I couldn't find how to configure the url. I mean that for a single place there is "?q=" , but I didn't find how tell google it is a polygon , so I go ahead and start searching for alternative way. I found the script which is fine if I ad the coordinates manually it's working , but I need to make it work with the given hyperlink. I think that there should be a way to do it , but my javascript skills are very low so please be patient when trying to tell me how to do it :).

NEW EDIT: I'm totaly stuck with this and I realy need some help , bacause I tryed a lot of different examples and functions and still no progres. I'm doing something wrong and I can't get it to work. Probably I must give up since even here I can't get a helpfull soliution.At least if someone can give me a link to an example where I can see how is made and how to modify my file it will be nice.

Stéphane Ammar · Answer 1 · 2017-09-12T12:24:51.733

0

If you want what is after the "?", you might use

var search = window.location.search

Then if you have something like ?"POLYGON (1.8,2.5)" you might use

 var regexp = /\"POLYGON \(([\d\.]+)\,([\d\.]+)\)\"/gi
 var coords = regexp.exec(search);

then, parseFloat(coords[1]) and parseFloat(coords[2]) have your coordonates. Use them where you used to have your coordonates

edited Sep 12 '17 at 12:24

answered Sep 12 '17 at 12:12

Stéphane Ammar

1,454
10
17

My skills are very low so can you tell me where to put it ? – Boris Dimitrov Sep 12 '17 at 12:16
Nothing hapens and still there are the default coordinates – Boris Dimitrov Sep 12 '17 at 12:32
Don't you need to reload your object after changing your coordinates ? I don't know the API you are using, I can't help you more – Stéphane Ammar Sep 12 '17 at 12:41
I am using a javascript API – Boris Dimitrov Sep 12 '17 at 12:49
it seems that you are using google map javascript api. Please refer to the documentation of this API. – Stéphane Ammar Sep 12 '17 at 12:52
I'm using a google maps API bacause I want to see my polygon on their map. But if there is another way to do it tell me , because I'm not sure how to do it. If there is a problem with the script I'm using can you tell me another script which to use. – Boris Dimitrov Sep 12 '17 at 12:58

score 0 · Accepted Answer · answered Sep 12 '17 at 12:15

0

in order to acess to the coordinates in the hyperlink, you must extract them, for exampl you can use php, so you polygone will be like this:

    var polygonStr = <?php print($_GET['q']) ?>;

answered Sep 12 '17 at 12:15

Nadjib Bendaoud

546
1
8
19

Uncaught SyntaxError: Unexpected token ? – Boris Dimitrov Sep 12 '17 at 12:33
Are you using a localhost server, or you page is located in server, if this the case, you file extension must be (.php) not (.html), the solution that i gave you will work only if this is a server side web page. – Nadjib Bendaoud Sep 12 '17 at 12:39
I'm using the file from my desktop it's not uploaded to a web page , because I want to use it only localy on my PC. – Boris Dimitrov Sep 12 '17 at 12:48
Ok so you can do that by using pure javascript, take a look at this post : https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript – Nadjib Bendaoud Sep 12 '17 at 12:55
I'm reading it and I can't understand where to put this function in my script and do I need to make any changes. It will be very nice if you can give me any idea how to remake my script. – Boris Dimitrov Sep 12 '17 at 13:10
At last I make it working thanks for giving me a tip how to do it and the post you reffer do the rest. I just installed XAMPP and paste my html file there and when I pointed the hyperlink to the htdocs folder where i put the file it's working just perfect.Thanks again. – Boris Dimitrov Sep 14 '17 at 20:30

How to replace data in my javascript file with hyperlink to this file

2 Answers2