javascript - Esri MAP Showing ARE.StreetName instead of Actual street name or address. -
i using esri map geocodes method retrieve addresses of particulars pointer. e.g if person clicked on streets of map, there info window open these informations. adress, city , address. other informations retrieving in streets section showing usa.pointaddress. don't know why ${loc_name} not showing proper street , city showing location. @ fiddle reference.
any regarding issue appriciated.
// add location map code star here // /* esri map geolocation */ var map, gsvc, pt; var o; function getaddress() { $("#txtincidentlongitude").val(o.location.x); $("#txtincidentlatitude").val(o.location.y); $("#txtincidentstreet").val(o.address.loc_name); $("#txtincidentarea").val(o.address.neighborhood); $("#txtincidentcity").val(o.address.city); $("#txtincidentemirate").val(o.address.region); }; require([ "esri/map", "esri/tasks/locator", "esri/graphic", "esri/tasks/geometryservice", "esri/tasks/projectparameters", "esri/spatialreference", "esri/infotemplate", "esri/dijit/search", "esri/geometry/webmercatorutils", "esri/symbols/simplemarkersymbol", "esri/symbols/picturemarkersymbol", "esri/symbols/simplelinesymbol", "esri/color", "dojo/number", "dojo/parser", "dojo/dom", "dojo/on", "dijit/registry", "dijit/layout/bordercontainer", "dijit/layout/contentpane", "dojo/domready!" ], function ( map, locator, graphic, geometryservice, projectparameters, spatialreference, infotemplate, search, webmercatorutils, simplemarkersymbol, picturemarkersymbol, simplelinesymbol, color, number, parser, dom, on, registry) { parser.parse(); map = new map("map", { basemap: "streets", center: [-74.6851, 40.6884], zoom: 9 }); var locator = new locator("https://geocode.arcgis.com/arcgis/rest/services/world/geocodeserver"); gsvc = new geometryservice("https://tasks.arcgisonline.com/arcgis/rest/services/geometry/geometryserver"); var search = new search({ map: map }, "search"); $('#search_input').attr('placeholder', 'find address'); search.startup(); search.on("select-result", showlocation); function showlocation(e) { map.graphics.clear(); var point = e.result.feature.geometry; var ppy = point.getlatitude().tofixed(4); var ppx = point.getlongitude().tofixed(4); }; dojo.connect(map, "onclick", function (evt) { map.graphics.clear(); var def = locator.locationtoaddress(esri.geometry.webmercatortogeographic(evt.mappoint), 100); def.then(function (candidate) { if (candidate.address) { o = candidate; /*$("#txtincidentstreet").val(o.address.loc_name); $("#txtincidentarea").val(o.address.neighborhood); $("#txtincidentcity").val(o.address.city);*/ var infotemplate = new infotemplate("location", "<table width='100%' class='m-t'><tr><td>address: </td><td>${address}</td></tr><tr><td>city: </td><td>${city}</td></tr><tr><td>street: </td><td>${loc_name}</td></tr></table><p style='margin:0' class='text-center'><a class='btn m-t btn-sm btn-primary' onclick='getaddress();' id='addloc' href='javascript:;'><i class='fa fa-plus-square'></i> add location</a></p>"); var symbol = new picturemarkersymbol({ "url": 'dist/images/active.png', "height": 27, "width": 16, "yoffset": 12, }); // service returns geocoding results in geographic - convert web mercator display on map var location = esri.geometry.geographictowebmercator(candidate.location); var graphic = new esri.graphic(location, symbol, candidate.address, infotemplate); map.graphics.add(graphic); map.infowindow.settitle(graphic.gettitle()); map.infowindow.setcontent(graphic.getcontent()); //display info window address information var screenpnt = map.toscreen(location); map.infowindow.resize(300, 250); map.infowindow.show(screenpnt, map.getinfowindowanchor(screenpnt)); } else { //no address found console.log("no address found location"); } }, function (error) { var latitude = evt.mappoint.getlatitude(); var longitude = evt.mappoint.getlongitude(); map.infowindow.settitle("location"); map.infowindow.setcontent( "<strong>address not available</strong><br>" + "latitude: " + latitude.tofixed(4) + "<br>logitude: " + longitude.tofixed(4) ); map.infowindow.show(evt.mappoint, map.getinfowindowanchor(evt.screenpoint)); console.log("error: " + error.message); }); }); });
#map, .map.container { padding: 0; margin: 0; height: 100%; width: 100%; } #info { top: 2px; color: #444; height: auto; font-family: arial; font-weight: bold; left: 69px; margin: 5px; padding: 10px; position: absolute; width: 260px; z-index: 40; border: solid 1px #003300; border-radius: 4px; background-color: #e5e5e5; } #search { display: block; position: absolute; z-index: 2; top: 36px; left: 74px; } /*beginning of search box modifications*/ .arcgissearch .searchclear { background-color: #e5e5e5; } .arcgissearch .esriiconzoom { background-image: url("finding.png"); background-size: 20px 20px; } .esriiconzoom:before { content: ""; } .arcgissearch .searchgroup .searchinput, .arcgissearch .searchbtn, .arcgissearch .noresultsmenu, .arcgissearch .suggestionsmenu { border: 1px solid #003300; background-color: #e5e5e5; } .arcgissearch .novaluetext { color: red; font-size: 14px; } /*beginning of popup modifications*/ .esripopup .titlepane { background-color: #015a82; border-bottom: 1px solid #121310; font-weight: bold; } .esripopup { color: #dae896; }
<link href="http://js.arcgis.com/3.16/esri/css/esri.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="http://js.arcgis.com/3.16/init.js"></script> <div id="search"></div> <div id="map"></div>
Comments
Post a Comment