topic Re: not extracting values correctly from URL in ArcGIS JavaScript Maps SDK Questions

not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Thu, 30 Aug 2012 15:47:13 GMT

Hello,

I am trying to create a URL from the current extent (and including other parameters), and then be able to extract that extent from the URL and zoom to that extent on opening the app, with a default extent if there are no parameters in the URL.

What I am getting instead is an empty map when I load a URL with parameters. I am not getting any errors in Firebug. Below is the relevant code:

(to extract parameters:)

    
    var urlToObject = locale.substring(locale.indexOf("?") + 1, locale.length);    
    var testURLExtent;    
    urlToObject = dojo.queryToObject(urlToObject);
  
  if ( urlToObject.urlxmin != null) 

  { 
   alert ("passed in extent from url");
  
   var locXmin = urlToObject.urlxmin;
   var locYmin = urlToObject.urlymin;
   var locXmax = urlToObject.urlxmax;
   var locYMax = urlToObject.urlymax;

  }
  
  else
  {
   alert ("no params, preset extent");
   var locXmin = 896338.273119375;
   var locYmin = 116730.668986593;
   var locXmax = 1089315.70367493;
   var locYMax = 274621.293986593;
  }
  
  var testURLExtent = new esri.geometry.Extent (locXmin, locYmin, locXmax, locYMax,  new esri.SpatialReference({ wkid: 2263}));

(and to create URL, from a new extent:)

    var curExtent = {
   urlxmin: pointExtent.xmin,
   urlymin: pointExtent.ymin,
   urlxmax: pointExtent.xmax,
   urlymax: pointExtent.ymax,
   
    };
    
          var url = "http://127.0.0.1:8020/MyApp/index.html";
    var queryStr = dojo.objectToQuery(curExtent);
    url= url + "?" + queryStr;
    alert (" url: " + url);

I notice that if I use only one parameter (such as xmin), and set the rest to constant values. the value is passed correctly from the URL, making me think there is a problem with the parsing of the parameters at the '&' sign?
Any help would be appreciated, thanks //

Re: not extracting values correctly from URL

KellyHutchins — Thu, 30 Aug 2012 15:57:43 GMT

Try using the esri.urlToObject to convert the url params to an object. Here's a sample that shows how this works:

http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples/exp_history.html

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Thu, 30 Aug 2012 16:07:48 GMT

Thanks, I did see that example and tried using the esri function, but without success... Is there an esri objectToUrl function?

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Thu, 30 Aug 2012 16:23:09 GMT

I think my problem is that with either the dojo or esri function, I do not understand how to extract multiple parameters. Also, I am using v2.1 of the JS API, if that is relevant. Thanks again /

Re: not extracting values correctly from URL

KellyHutchins — Sun, 12 Dec 2021 00:07:45 GMT

Here's a snippet that will extract the current extent from the url and zoom to that

        var urlObj = esri.urlToObject(document.location.href);
        if(urlObj.query && urlObj.query.extent){
            map.setExtent(new esri.geometry.Extent(dojo.fromJson(urlObj.query.extent)));
        }

Here's a sample url that includes the extent.
http://localhost/test.html?extent={%22xmin%22:-13680584.814157216,%22ymin%22:5950709.454900841,%22xmax%22:-13678688.22039284,%22ymax%22:5952207.142923844,%22spatialReference%22:{%22wkid%22:102100}}

And here's an example of creating the url params to append to the url

  extent = "?extent=" + dojo.toJson(map.extent.toJson());

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Thu, 30 Aug 2012 16:56:11 GMT

When I tried this, the URL is created as expected (output to console), but when I cut and paste the URL and try to navigate to it, I get "NetworkError: 500 Internal Server Error" followed by the URL , in Firebug. Ideas?

Re: not extracting values correctly from URL

KellyHutchins — Thu, 30 Aug 2012 21:00:05 GMT

Sounds like the url you are trying to navigate to is invalid. Can you post it here so we can take a look?

When I tried this, the URL is created as expected (output to console), but when I cut and paste the URL and try to navigate to it, I get "NetworkError: 500 Internal Server Error" followed by the URL , in Firebug. Ideas?

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Wed, 05 Sep 2012 13:55:15 GMT

here it is:

http://127.0.0.1:8020/SchoolSafety/index.html?urlextent={"xmin":981583.5277170027,"ymin":195611.84174998308,"xmax":981583.5301690912,"ymax":195611.84374998306,"spatialReference":{"wkid":2263}}

thanks, Jason

Re: not extracting values correctly from URL

KellyHutchins — Wed, 05 Sep 2012 14:38:42 GMT

Jason,

Use encodeURIComponent to encode the URL parameter. Here's some more info:

http://stackoverflow.com/questions/75980/best-practice-escape-or-encodeuri-encodeuricomponent

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Wed, 05 Sep 2012 18:06:47 GMT

I tried following the examples on that page:

        var url = "http://127.0.0.1:8020/SchoolSafety/index.html";
    urlParam = encodeURIComponent(dojo.toJson(pointExtent.toJson()));
    url = url + "/?urlextent=" + urlParam;

and

        var url = "http://127.0.0.1:8020/SchoolSafety/index.html";
    urlextent = "/?urlextent=" + dojo.toJson(pointExtent.toJson());
    url = url + urlextent;
    url = encodeURI(url);

..and some other variations, but all resulted in the same 'Internal Service Error'. What am I missing?

Re: not extracting values correctly from URL

KellyHutchins — Wed, 05 Sep 2012 19:02:00 GMT

If you navigate to just this portion of the url does the page load successfully?

http://127.0.0.1:8020/SchoolSafety/index.html

If you add a breakpoint to your app what is the line of code where your app fails?

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Wed, 05 Sep 2012 19:38:36 GMT

If you navigate to just this portion of the url does the page load successfully?

yes it does.

http://127.0.0.1:8020/SchoolSafety/index.html

If you add a breakpoint to your app what is the line of code where your app fails?

well, I am trying to open the app with the created URL..so the page never loads at all, it immediately opens with the 'internal service error' message on a white screen.

(btw, this is the URL that is created using 'urlextent = "/?urlextent=" + dojo.toJson(pointExtent.toJson());' )

http://127.0.0.1:8020/SchoolSafety/index.html/?urlextent=%7B%22xmin%22:981583.5277170027,%22ymin%22:195611.84174998308,%22xmax%22:981583.5301690912,%22ymax%22:195611.84374998306,%22spatialReference%22:%7B%22wkid%22:2263%7D%7D

Re: not extracting values correctly from URL

KellyHutchins — Sun, 12 Dec 2021 00:07:48 GMT

This part of the url is incorrect

'urlextent = "/?urlextent=" + dojo.toJson(pointExtent.toJson());' )

There shouldn't be a / in front of the ?.

Here's an example that works for me:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Topographic Map</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/claro/claro.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      .esriScalebar{
        padding: 20px 20px;
      }
      #map{
        padding:0;
      }
    </style>
    <script type="text/javascript">var djConfig = {parseOnLoad: true};</script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script>
    <script type="text/javascript">
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");

      
      var map;

      function init() {
        var initExtent = new esri.geometry.Extent({"xmin":-122.46,"ymin":37.73,"xmax":-122.36,"ymax":37.77,"spatialReference":{"wkid":4326}});
        map = new esri.Map("map",{
          extent:esri.geometry.geographicToWebMercator(initExtent)
        });

        var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
        map.addLayer(basemap);

        
         //if there are url params zoom to location 
         var coords, zoomLevel;
         var urlObject = esri.urlToObject(document.location.href);
  
  
        if(urlObject.query && urlObject.query.urlExtent){
          map.setExtent(new esri.geometry.Extent(dojo.fromJson(urlObject.query.urlExtent)));
        }


        
        dojo.connect(map, 'onLoad', function(theMap) { 
          //resize the map when the browser resizes
          dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
        });
      }

       function generateUrl(){
          //construct url param at current extent 
          var extent = dojo.toJson(map.extent.toJson());
          
          var url = location.protocol + '//' + location.host + location.pathname + '?urlExtent=' + encodeURIComponent(extent);
          console.log(url);
          
       }
      dojo.addOnLoad(init);
    </script>
  </head>
  
  <body class="claro">
    <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width: 100%; height: 100%; margin: 0;">
      <div dojotype='dijit.layout.BorderContainer' region='top' style='height:20px;'>
      <input type='button' onClick='generateUrl();' value='Generate URL (see console)'/>
      </div>
      
      <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;padding:0;">
     </div>
    </div>
  </body>

</html>

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Wed, 05 Sep 2012 19:55:51 GMT

My earlier version did not have the slash; I tried that to see if it would help...

With or without the slash, I get the same error message.

I'll keep trying, thanks.

Re: not extracting values correctly from URL

KellyHutchins — Sun, 12 Dec 2021 00:07:50 GMT

Jason,

Can you try this code and see if it works for you?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Topographic Map</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/claro/claro.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      .esriScalebar{
        padding: 20px 20px;
      }
      #map{
        padding:0;
      }
    </style>
    <script type="text/javascript">var djConfig = {parseOnLoad: true};</script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script>
    <script type="text/javascript">
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");

      
      var map;

      function init() {
        var initExtent = new esri.geometry.Extent({"xmin":-122.46,"ymin":37.73,"xmax":-122.36,"ymax":37.77,"spatialReference":{"wkid":4326}});
        map = new esri.Map("map",{
          extent:esri.geometry.geographicToWebMercator(initExtent)
        });

        var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
        map.addLayer(basemap);

        
         //if there are url params zoom to location 
         var coords, zoomLevel;
         var urlObject = esri.urlToObject(document.location.href);
  
  
        if(urlObject.query && urlObject.query.urlExtent){
          map.setExtent(new esri.geometry.Extent(dojo.fromJson(urlObject.query.urlExtent)));
        }


        
        dojo.connect(map, 'onLoad', function(theMap) { 
          //resize the map when the browser resizes
          dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
        });
      }

       function generateUrl(){
          //construct url param at current extent 
          var extent = dojo.toJson(map.extent.toJson());
          
          var url = location.protocol + '//' + location.host + location.pathname + '?urlExtent=' + encodeURIComponent(extent);
          console.log(url);
          
       }
      dojo.addOnLoad(init);
    </script>
  </head>
  
  <body class="claro">
    <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width: 100%; height: 100%; margin: 0;">
      <div dojotype='dijit.layout.BorderContainer' region='top' style='height:20px;'>
      <input type='button' onClick='generateUrl();' value='Generate URL (see console)'/>
      </div>
      
      <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;padding:0;">
     </div>
    </div>
  </body>

</html>

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Thu, 06 Sep 2012 15:16:32 GMT

When i click the button in your code I get this URL:

http://127.0.0.1:8020/SchoolSafety/testURLcreator.html?urlExtent=%7B%22xmin%22%3A-13632724.275638657%2C%22ymin%22%3A4539817.393862709%2C%22xmax%22%3A-13620513.460370118%2C%22ymax%22%3A4548521.660458673%2C%22spatialReference%22%3A%7B%22wkid%22%3A102100%7D%7D

..but when I cut and paste this URL and try to navigate to it, I get that same "Internal Server Error" message on a blank screen.

In Firebug I get "NetworkError: 500 Internal Server Error" followed by the URL.

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Tue, 11 Sep 2012 15:23:35 GMT

Hello, just checking in again, I didn't see a response..to recap, I was able to run this example, but I received the same error ("Internal Server Error") when I tried to navigate to the generated URL.

Any thoughts on why this is so? Thanks, jason

Re: not extracting values correctly from URL

KellyHutchins — Tue, 11 Sep 2012 15:34:41 GMT

500 errors come from teh server - for some reason the server wasn't able to fulfill the request. Here's some info on troubleshooting 500 errors:

http://pcsupport.about.com/od/findbyerrormessage/a/500servererror.htm

Re: not extracting values correctly from URL

deleted-user-ugCMpXci8bn5 — Thu, 20 Sep 2012 14:01:04 GMT

I am now testing the app from our development server...when I try to navigate to a URL with the extent variables, I now get these errors:

exception in animation handler for: onEnd

TypeError: lod is undefined

Do these errors help give an explanation as to why this isn't working for me?
Thanks, Jason