var infoTemplate = new esri.InfoTemplate("Sales Rep: ${NAME}", ("${*}")); ... repGraphic.setInfoTemplate(infoTemplate); map.graphics.add(repGraphic);
map.infoWindow.show(selectedRepGraphic.geometry);
var selInfoTemplate = new esri.InfoTemplate("Sales Rep: ${NAME}", ("${*}")); //"Rep # : ${rep_no}", "Address : ${ADDR1}"); map.infoWindow.setTitle(selectedRepGraphic.getContent("${NAME}")); selectedRepGraphic.setInfoTemplate(selInfoTemplate); map.infoWindow.show(selectedRepGraphic.geometry); map.graphics.add(selectedRepGraphic);
var selInfoTemplate = new esri.InfoTemplate("Sales Rep: ${NAME}", "${*}");
var popup = new esri.dijit.Popup(null, dojo.create("div")); map = new esri.Map("map", { extent: extent, width: mapWidth, infoWindow: popup, //Define popup for map infowindow showInfoWindowOnClick: false });
var template = new esri.InfoTemplate(); template.setContent(getTextContent); var featureLayer = new esri.layers.FeatureLayer("http://yourserver/ArcGIS/rest/services/yourmapservice/MapServer/0", { mode: esri.layers.FeatureLayer.MODE_SNAPSHOT, outFields: ["Name","rep_no","ADDR1"], infoTemplate: template //Define the template for the FeatureLayer }); function getTextContent(graphic) { var name= graphic.attributes.Name; var rep_no= graphic.attributes.rep_no; var address= graphic.attributes.ADDR1; var content = "<b>Name : </b>" + name + "<br><b>Rep # : </b>" + rep_no + "<br><b>Address : </b>" + address; return content; }
map.infoWindow.hide(); map.infoWindow.clearFeatures(); map.infoWindow.setFeatures(selectedRepGraphic); //I use setFeatures to set the Map InfoWindow/Popup to the selected feature/graphic map.infoWindow.show(selectedRepGraphic.geometry); map.centerAndZoom(selectedRepGraphic.geometry, 7);
function doRepManager(fset){ //draws the rep points, fires populateTable // var infoTemplate = new esri.InfoTemplate(); var symbol = new esri.symbol.SimpleMarkerSymbol(); symbol.style = esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE; symbol.setSize(6); symbol.setColor(new dojo.Color([219, 112, 147, 1])); var repResultFeatures = fset.features; for (var i = 0, il = repResultFeatures.length; i < il; i++) { var repGraphic = repResultFeatures; repGraphic.setSymbol(symbol); var name = repGraphic.attributes.NAME; var rep_no = repGraphic.attributes.rep_no; var address = repGraphic.attributes.ADDR1; var city = repGraphic.attributes.CITY; var state = repGraphic.attributes.ST_ABBR; var zipcode = repGraphic.attributes.ZIP_CODE; var leader = repGraphic.attributes.Ldr_type; var prez = repGraphic.attributes.PCText; var content = "<b>Rep # : </b>" + rep_no + "<br><b>Address : </b>" + address + "<br><b>City : </b>" + city + "<br><b>State : </b>" + state + "<br><b>Zip : </b>" + zipcode + "<br><b> Leader : </b>" + leader + "<br><b>Presidents Club :</b>" + prez; var title = "<b>Name : </b>" + name; map.infoWindow.setTitle(title); map.infoWindow.setContent(content); repGraphic.setInfoTemplate(infoTemplate); map.graphics.add(repGraphic); map.infoWindow.show(repGraphic.geometry); // <--- the popup appears properly (bold field titles) after the point is drawn (points are found by a spatial query from a buffer) // but if you click on the point itself all the bold disappears, and extra fields appear at the bottom (see below) }; var items = []; dojo.forEach(fset.features, function (feature) { var graphic = feature; graphic.setSymbol(symbol); map.graphics.add(graphic); items.push(feature.attributes); }); var data = { identifier: "rep_no", items: items }; store = new dojo.data.ItemFileReadStore({ data: data }); grid.setStore(store); };
function onRowClickHandler(evt){ var clickedRep = grid.getItem(evt.rowIndex).rep_no; var selectedRep; var selectedRepSymbol = new esri.symbol.SimpleMarkerSymbol(); selectedRepSymbol.style = esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE; selectedRepSymbol.setSize(10); selectedRepSymbol.setColor(new dojo.Color([0,255,0, 1])); dojo.forEach(map.graphics.graphics,function(graphic){ if((graphic.attributes) && graphic.attributes.rep_no === clickedRep){ selectedRep = graphic; if (!(map.extent.contains(selectedRep.geometry))) { map.centerAt(selectedRep.geometry); }; this.selectedRepGraphic = new esri.Graphic(selectedRep, selectedRepSymbol); this.selectedRepGraphic.id="highlight"; this.selectedRepGraphic.setSymbol(selectedRepSymbol); var name = selectedRepGraphic.attributes.NAME; var rep_no = selectedRepGraphic.attributes.rep_no; var address = selectedRepGraphic.attributes.ADDR1; var city = selectedRepGraphic.attributes.CITY; var state = selectedRepGraphic.attributes.ST_ABBR; var zipcode = selectedRepGraphic.attributes.ZIP_CODE; var leader = selectedRepGraphic.attributes.Ldr_type; var prez = selectedRepGraphic.attributes.PCText; var content = "<b>Rep # : </b>" + rep_no + "<br><b>Address : </b>" + address + "<br><b>City : </b>" + city + "<br><b>State : </b>" + state + "<br><b>Zip : </b>" + zipcode + "<br><b> Leader : </b>" + leader + "<br><b>Presidents Club :</b>" + prez; var title = "<b>Name : </b>" + name; map.infoWindow.setTitle(title); map.infoWindow.setContent(content); selectedRepGraphic.setInfoTemplate(infoTemplate); map.infoWindow.show(selectedRepGraphic.geometry); dojo.forEach(this.map.graphics.graphics, function (g){ if( g && g.id === "highlight" ){ //remove graphic with specific id this.map.graphics.remove(g); } },this); map.graphics.add(this.selectedRepGraphic); return; }; }); return; };