topic Re: Convert below dojo code to Jquery in ArcGIS JavaScript Maps SDK Questions

Convert below dojo code to Jquery

venkatm3 — Tue, 22 Jan 2013 15:06:57 GMT

Hi

I would like to how to convert the below dojo code to Jquery.

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">
    
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Create Map Display Mouse Coordinates</title>

    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/css/esri.css">

    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/"></script>
    <script>
     dojo.require("esri.map");

      var map;

      function init() {
        map = new esri.Map("map", {
          basemap: "streets",
          center: [-47.109, 14.945],
          zoom: 2
        });
       dojo.connect(map, "onLoad", function() {
          //after map loads, connect to listen to mouse move & drag events
          dojo.connect(map, "onMouseMove", showCoordinates);
          dojo.connect(map, "onMouseDrag", showCoordinates);
        });
      }

      function showCoordinates(evt) {
        //get mapPoint from event
        //The map is in web mercator - modify the map point to display the results in geographic
        var mp = esri.geometry.webMercatorToGeographic(evt.mapPoint);
        //display mouse coordinates
      dojo.byId("info").innerHTML = mp.x.toFixed(3) + ", " + mp.y.toFixed(3);
      }

      dojo.ready(init);
    </script>
</head>
<body class="claro">
    <div id="map" style="position:relative; width:900px; height:600px; border:1px solid #000;">
      <span id="info" style="position:absolute; left:15px; bottom:5px; color:#000; z-index:50;"></span>
    </div>
</body>
</html>

Re: Convert below dojo code to Jquery

JeffPace — Tue, 22 Jan 2013 18:25:35 GMT

why?

There is no advantage in doing this. The api requires dojo so you are already loading it.

Re: Convert below dojo code to Jquery

venkatm3 — Wed, 23 Jan 2013 01:24:32 GMT

I don't know dojo. so I would like apply Jquery instead of dojo.

I would like to know wherever i can use jquery code instead of using dojo.

Can anyone convert the above highlighted code to Jquery ?

Re: Convert below dojo code to Jquery

StephenLead — Wed, 23 Jan 2013 01:29:00 GMT

There's a sample here which might give you some pointers as to what's possible:

http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/#sample/framework_jquery

Note that this sample still uses dojo.connect.

Re: Convert below dojo code to Jquery

venkatm3 — Wed, 23 Jan 2013 02:06:58 GMT

There's a sample here which might give you some pointers as to what's possible:

http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/#sample/framework_jquery

Note that this sample still uses dojo.connect.

I accept.

But do u know the below code can write it on Jquery. Shall I have Jquery code for the same.

dojo.connect(map, "onLoad", function() {
//after map loads, connect to listen to mouse move & drag events
dojo.connect(map, "onMouseMove", showCoordinates);
dojo.connect(map, "onMouseDrag", showCoordinates);
});

I

Re: Convert below dojo code to Jquery

StephenLead — Wed, 23 Jan 2013 02:11:03 GMT

But do u know the below code can write it on Jquery.

No idea, sorry.

Re: Convert below dojo code to Jquery

JeffJacobson — Wed, 23 Jan 2013 19:55:50 GMT

I think you have to use dojo.connect for the map event handling.

Re: Convert below dojo code to Jquery

JianHuang — Wed, 23 Jan 2013 23:54:28 GMT

though it's not recommended, if you really have to avoid dojo.connect, you can simply override the event with the function as events are functions essentially.
For example, you can replace
dojo.connect(map, "onExtentChange", showExtent);
as:
map.onExtentChange = showExtent;

I accept.

But do u know the below code can write it on Jquery. Shall I have Jquery code for the same.

dojo.connect(map, "onLoad", function() {
//after map loads, connect to listen to mouse move & drag events
dojo.connect(map, "onMouseMove", showCoordinates);
dojo.connect(map, "onMouseDrag", showCoordinates);
});

I

Re: Convert below dojo code to Jquery

StephenLead — Sun, 27 Jan 2013 08:21:41 GMT

though it's not recommended, if you really have to avoid dojo.connect, you can simply override the event with the function as events are functions essentially.
For example, you can replace
dojo.connect(map, "onExtentChange", showExtent);
as:
map.onExtentChange = showExtent;

Hi Jian,

Is there any particular reason why this isn't recommended? It seems pretty succinct and straightforward.

Thanks,
Steve