Как получить координаты многоугольника из встроенной карты esri, используя JavaScript и REST API? - PullRequest
0 голосов
/ 16 января 2020

У меня есть файл HTML, и я вложил в него картографический сервис или карту esri. Когда я запускаю этот файл html, я вижу встроенную карту и могу рисовать многоугольники на этой карте. Мне также нужно получить координаты вершин многоугольника. Как я могу сделать это, используя JavaScript REST API или любой другой API? Пожалуйста помоги. По одному коду я удалил ссылку на сервис, так как он является приватным. Пожалуйста, смотрите код ниже.

<html>
<head>
	<title>Test</title>
</head>
<body>
	<center> 
        <h1 style="color:green"> 
          Test 
      </h1> 
		<p>Test</p>
			<embed src="" 
               width="1000" 
               height="1000"
               style="border:none;" /> 
	</center>
</body>
</html>

1 Ответ

1 голос
/ 26 января 2020

Вы не можете сделать это с помощью встраивания. Вам нужно использовать Esri JavaScript API , чтобы поместить объект Map в div и выполнять любые взаимодействия через JavaScript API напрямую.

Вот Учебное пособие Esri о размещении векторного слоя на карте .

В этом учебном пособии показано как размещать пользовательскую графику и рисовать точки, линии и уловки на карте .

После второго урока вы должны получить что-то вроде этого:

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>ArcGIS JavaScript Tutorials: Create a Starter App</title>
  <style>
    html, body, #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.13/esri/css/main.css">
  <script src="https://js.arcgis.com/4.13/"></script>

  <script>  
    require([
      "esri/Map",
      "esri/views/MapView",
      "esri/layers/GraphicsLayer",
      "esri/widgets/Sketch",
    ], function(Map, MapView, GraphicsLayer, Sketch) {

      var graphicsLayer = new GraphicsLayer();

      var map = new Map({
        basemap: "topo-vector",
        layers: [graphicsLayer]
      });

      var view = new MapView({
        container: "viewDiv",
        map: map,
        center: [-118.80500,34.02700],
        zoom: 13
      });

      var sketch = new Sketch({
        view: view,
        layer: graphicsLayer
      });

      view.ui.add(sketch, "top-right");

    });
  </script>
</head>
<body>
  <div id="viewDiv"></div>
</body>
</html>

Теперь, это использует только встроенный виджет "Sketch" esri. Если вы не хотите, чтобы точки и линии были нарисованы, вам нужно заглянуть в документ Sketch для виджетов , чтобы узнать, можете ли вы ограничить функциональность. Я искал для вас и, похоже, вы можете с помощью свойства availableCreateTools. По умолчанию это ["point", "polyline", "polygon", "rectangle", "circle"], поэтому этот код должен разрешать только полигоны:

      var sketch = new Sketch({
        view: view,
        layer: graphicsLayer,
        avaliableCreateTools: ["polygon"]
      });

Пример Esri также не показывает, как вы можете выполнять какие-либо действия после того, как пользователь завершил создание чего-либо. После того, как пользователь закончил, вы можете прослушать событие create с:

sketch.on('create', function(event) {
   // Check if the sketch is completed:
   if (event.state === "complete") {
       // Polygon has been created
   }
});

Это событие можно найти в разделе «События» в Документация Esri Sidch Widget

...