标签: esri-leaflet

我想要的是使用传单地图+功能，我可以在其中传递纬度/经度并接收带有地址的短信。

我正在尝试使用 esri 插件，但是我做错了。目前我正在获取函数内部的地址，但我不知道如何正确地将其传递给变量。

这是我的代码：

var map = L.map('map').setView([40.725, -73.985], 7);

L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var geocodeService = L.esri.Geocoding.geocodeService();

map.on('click', function(e) {
  geocodeService.reverse().latlng(e.latlng).run(function(error, result) {
    L.marker(result.latlng).addTo(map).bindPopup(result.address.Match_addr).openPopup();
  });
});

var message;

message = geocodeService.reverse().latlng([40.725, -73.985]).run(function(error, result) {
  //alert(result.address.Match_addr); //this alert works here ok and can retur addrress
  return result.address.Match_addr;
});

//this alert won't work, why I can get the address here outside the function
alert(message); 

这是完整的示例： https: //jsfiddle.net/5aq6z1vL/

如何将地理编码器用作如下函数：

var address = convertToAddress([40.725, -73.985]);

function convertToAddress(]lat,lon])
{ …

安装 npmesri-leaflet和leaflet软件包后，出现以下错误

这是我的地图组件：

import React from 'react'
import ReactDOM , {render} from 'react-don'

import L from 'esri-leaflet'
// import L from 'leaflet'     <-- won't work as well


class Map extends React.Component{

    componentDidMount(){

        let element = this.refs.mapRef

        // let map = L.map(element).setView([-41.2858, 174.78682], 14);
        var map = L.map(this.refs.mapRef).setView([45.528, -122.680], 13)

        L.esri.basemapLayer("Streets").addTo(map);

        console.log("ESRI::",L.esri);

        var parks = L.esri.featureLayer({
            url: "https://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Portland_Parks/FeatureServer/0",
            style: function() {
             return {
                 color: "#70ca49",
                 weight: 2
             };
            }
        }).addTo(map);
    }


    render(){
        return(
            <div>
                <h1>Maps page</h1>
                <div …

在以下链接中，有在线演示案例展示了如何使用 esri-leaflet-geosearch 插件，https: //codepen.io/exomark/pen/dafBD

var searchControl = new L.esri.Controls.Geosearch().addTo(map);

var results = new L.LayerGroup().addTo(map);

searchControl.on('results', function(data){
    results.clearLayers();
    for (var i = data.results.length - 1; i >= 0; i--) {
      results.addLayer(L.marker(data.results[i].latlng));
    }
});

这个在线演示可以很好地支持地理搜索功能。

在我的 React 应用程序中，我还计划添加诸如用于传单的搜索框。但无法弄清楚如何做到这一点。

由于esri-leaflet-geosearch取决于esri-leaflet，所以安装了两个 npm 包，但找不到下一步。所以有什么帮助吗？