我正在使用ESRI Map地理编码方法来检索详细指针的地址。例如,如果某人点击地图的街道,将会打开一个包含这些信息的信息窗口。地址,城市和地址。其他信息检索完美,但在街道部分,它显示USA.PointAddress。我不知道为什么这个$ {Loc_name}没有显示正确的街道,甚至城市也显示位置。看看小提琴作为参考。
有关此问题的任何帮助都会受到关注。
// Add Location MAP Code star from 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,
});
// this service returns geocoding results in geographic - convert to web mercator to 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 the info window with the 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 for this 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 a {
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>