Infowindow data is same for all point symbol, missing some loop

1554
8
Jump to solution
06-21-2017 01:16 PM
MRReddy
Occasional Contributor

//data from sql works fine, it binds to infowindow, but same data for all points, I think i'm missing something in the bold selected bottom lines

var map;
require([
"esri/map",
"esri/dijit/Scalebar",
"esri/InfoTemplate",
"esri/symbols/SimpleLineSymbol",
"esri/graphic",
"esri/symbols/SimpleMarkerSymbol",
"esri/Color",
"dojo/on",
"dojo/dom",
"esri/geometry/Point",
"esri/dijit/Search",
"dojo/domReady!"
], function (
Map, Scalebar, InfoTemplate, SimpleLineSymbol, Graphic, SimpleMarkerSymbol, Color, on, dom, Point, Search
) {
var markers = JSON.parse('<%=ConvertDataTabletoString() %>');
map = new Map("map", {
basemap: "osm",
center: [-120.7077, 47.2601],
zoom: 7
});

var scalebar = new Scalebar({
map: map,
// "dual" displays both miles and kilometers // "english" is the default, which displays miles // use "metric" for kilometers
scalebarUnit: "dual"
});
var search = new Search({
map: map
}, "City");
search.startup();
var infoTemplate = new InfoTemplate();
infoTemplate.setTitle("Population in ");
infoTemplate.setContent("<b>2007<br/>" );
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.on("load", addQueryResult);
function addQueryResult() {
for (i = 0; i < markers.length; i++) {
var data = markers
var lat = data.latitude;
var long = data.longitude;
var green = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 11,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([0, 128, 0]),2));
var yellow = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 11,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255, 255, 0]), 2));
var pt = new Point(long, lat);
var graphic = new Graphic();
if (data.PermitStatus == 'Active') {
var graphic = Graphic(pt, green);
}

else {
var graphic = Graphic(pt, yellow);
}

map.graphics.add(graphic);
map.on("click", Pointdata);
function Pointdata(evt) {
if (evt.graphic) {

var latitude = evt.mapPoint.getLatitude();
var longitude = evt.mapPoint.getLongitude();
map.infoWindow.setTitle("FacilityDetails");
map.infoWindow.setContent(select city, industry from location//example query//
);

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


}
}
});thejus kambi@ 

0 Kudos
1 Solution

Accepted Solutions
thejuskambi
Occasional Contributor III

Hello Malla,

I have mentioned this in my earlier post. when adding the graphics add the "data" to attributes values that way each point will have its own data within it. Then when you are call the "setContent" use the value from the graphic attributes. Check the sample link I have sent again.

Now data will contain the last attribute from the loop and it will show for all records.

var graphic = Graphic(pt, green, data);
...
map.infoWindow.setContent(evt.graphicattributes.Facility);//it's a column name coming from sql, 

View solution in original post

8 Replies
thejuskambi
Occasional Contributor III

Hello Malla,

Check out this sample, especially from line 99 onwards. you may have to do something like that.

Feature layer hover | ArcGIS API for JavaScript 3.20 

Also, you would have to updated the attributes property while creating new graphics.

var graphic = Graphic(pt, green, data);

MRReddy
Occasional Contributor

Tried with that, Still the same, Only 1st record is loaded and that is the one shown for all points in infowindow

0 Kudos
KenBuja
MVP Esteemed Contributor

Post your code on what the map.infoWindow.setContent contents are.

0 Kudos
MRReddy
Occasional Contributor

 map.infoWindow.setContent(data.Facility);//it's a column name coming from sql, 

0 Kudos
thejuskambi
Occasional Contributor III

Hello Malla,

I have mentioned this in my earlier post. when adding the graphics add the "data" to attributes values that way each point will have its own data within it. Then when you are call the "setContent" use the value from the graphic attributes. Check the sample link I have sent again.

Now data will contain the last attribute from the loop and it will show for all records.

var graphic = Graphic(pt, green, data);
...
map.infoWindow.setContent(evt.graphicattributes.Facility);//it's a column name coming from sql, 
MRReddy
Occasional Contributor

how to zoom map, where points are loaded thejus.kambi, while map loading i'm using zoom7, it is always same location and same zoom level, how to zoom according to points loaded

0 Kudos
thejuskambi
Occasional Contributor III

You would need to use esri/graphicsUtils module and calucate the extent of map.graphics and then update the map.extent to the extent of all graphics.

SarojThapa1
Occasional Contributor III

Hi Malla,

try Resizing the infoWindow after the loop. 

infoWindow.resize(210, 150);

0 Kudos