Select to view content in your preferred language

I have fetched the data from sql server and returned it as a JSon object. How to bind the Json object to Arcgis javascript map?

3030
16
06-19-2017 06:36 PM
MRReddy
Regular Contributor

var map;

require([

"esri/map",

"esri/symbols/SimpleLineSymbol",

"esri/graphic",

"esri/symbols/SimpleMarkerSymbol",

"esri/Color",

"dojo/on",

"dojo/dom",

"esri/geometry/Point",

"dojo/domReady!"

], function (

Map, SimpleLineSymbol, Graphic, SimpleMarkerSymbol, Color, on, dom, Point

) {

var markers = JSON.parse('<%=ConvertDataTabletoString() %>');

map = new Map("map", {

basemap: "osm",

center: [-122.9007, 47.0379],

zoom: 9

//scale

});

map.on("load", function () {

map.infoWindow.resize(250, 100);

});

map.on("click", addPoint);

function addPoint(evt) {

var lat = evt.mapPoint.getLatitude();

var long = evt.mapPoint.getLongitude();

document.getElementById("ContentPlaceHolder1_txtLat").value = lat;

document.getElementById("ContentPlaceHolder1_txtLng").value = long;

//map.infoWindow.setTitle("Coordinates");

//map.infoWindow.setContent(

// "lat/lon : " + latitude.toFixed(2) + ", " + longitude.toFixed(2) +

// "<br>screen x/y : " + evt.screenPoint.x + ", " + evt.screenPoint.y

//);

// map.infoWindow.show(evt.mapPoint, map.getInfoWindowAnchor(evt.screenPoint));

}

});

Tags (1)
0 Kudos
16 Replies
MRReddy
Regular Contributor

result json look likes Array 

0 Kudos
MRReddy
Regular Contributor

result json look likes Array 

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

What is the arrays structure? Just saying it is an array does not answer the issue of that does the key value pairs of the returned json look like.

0 Kudos
MRReddy
Regular Contributor

It's a dictionary object

0 Kudos
MRReddy
Regular Contributor

I am binding rows in that  object

0 Kudos
MRReddy
Regular Contributor

column name and data

0 Kudos
ChristopherSchreiber
Frequent Contributor

Malla,

Take a look at the Graphics Layer Link in the JS API.

 GraphicsLayer | API Reference | ArcGIS API for JavaScript 3.20 

There is a property in it that expects an array of graphics. They make up the layer.

Here is the link to the JS API for an individual graphic.

Graphic | API Reference | ArcGIS API for JavaScript 3.20 

Here is an example of adding an individual graphic to a map using JSON, notice the "MyPoint" variable is raw JSON, I think this is what rscheitlin‌, is looking for when he asks what your JSON output is.

require([
  "esri/graphic" 
], function(Graphic) {
  var myPoint = {"geometry":{"x":-104.4140625,"y":69.2578125,
    "spatialReference":{"wkid":4326}},"attributes":{"XCoord":-104.4140625,
    "YCoord":69.2578125,"Plant":"Mesa Mint"},"symbol":{"color":[255,0,0,128],
    "size":12,"angle":0,"xoffset":0,"yoffset":0,"type":"esriSMS",
    "style":"esriSMSSquare","outline":{"color":[0,0,0,255],"width":1,
    "type":"esriSLS","style":"esriSLSSolid"}},
    "infoTemplate":{"title":"Vernal Pool Locations","content":"Latitude: ${YCoord} <br/> Longitude: ${XCoord} <br/> Plant Name:${Plant}"}};
  var gra = new Graphic(myPoint);
  ...
});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

The JSON above includes the point's geometry, Spatial Reference, attributes, symbology, and InfoTemoplate (Popup) information.  

NOTE: I used the "Point" example above, but there are also examples for lines and Polygons. 

I hope this helps!

Chris