Invalid value for <image> attribute x=“NaN”

Question

I'm working a jQuery Mobile page with an ESRI jsapi map and a dialog which calls on a geocoding service to return an x/y which I plunk a graphic on the map and then center up on.

This site runs very nicely on my desktop.. However, on the phone the results do not populate the map. I used the chrome debugging tools for android on my phone and my tablet to capture the error.

'Error: Invalid value for attribute x="NaN"..

The madding thing is that the console and watch shows me the values for x and y are correct.

Is there a different place other than the point geometry for the mobile that I need to set the x and y coordinates?

Andy..

var map = new Map('ui-map-content', {
           basemap: "topo",
           autoResize:false,
           center: [-96.7968380, 32.7762360],
           zoom: 12,
           slider: true
       });

//Yep it was a success ('IknowwhereIam...)..
       function IknowwhereIam(data) {
           try {             

               clearGraphics(map, pointGraphicLayer);
               var x, y;
               x = data.geometries[0].x;
               y = data.geometries[0].y;

               console.log("IknowwhereIam,  x: " + x + ",  y: " + y);              

               var pt = new Point(x, y, map.spatialReference);

               var location = new Graphic(pt);
               console.log(location);
               pointGraphicLayer.add(location);

               map.centerAndZoom(pt, 16);


           }
           catch (e) {
               alert("problem inside the 'IKnowwhereIam' function: " + e.message);
           }
           finally {

           }
       }

Answer 1

Well.. This was a learning experience for me. 1st didn't know what the svg.js was (Scalable Vector Graphics) and the coordinate the code was looking for was not a spatial coordinate that I supplied but one that the basemap tiles would have supplied if I had waited for the information to make it across the network (on the phone only).

Soo...

I introduced a half-second delay in the function that seems to do the trick. I do not know if this is the best way to do this or not but it is working.

Andy

 setTimeout(function () {                 
       map.centerAndZoom(pt, 16);
 }, 500);