如何在ArcGIS API for JavaScript 3.40中创建经纬度输入表单标记点位

直接在你现有官方示例代码基础上做少量修改即可实现需求，具体步骤如下：

• 新增经纬度输入UI：在右侧功能面板#info的顶部加入经度、纬度输入框和标记触发按钮，给每个控件设置唯一ID方便后续获取值。
• 补充依赖模块：原有示例没有引入点几何类，需要在AMD依赖列表中加入esri/geometry/Point模块。
• 绑定标记逻辑：给标记按钮加点击事件，先校验输入的经纬度是否在合法范围内，再创建点几何对象，复用示例里已定义的点样式把标记加到地图上，同时自动把地图视角定位到标记点位置。

踩坑提示：ArcGIS JS 3.x的Point构造函数参数顺序为经度在前、纬度在后，写反会导致点位出现在完全错误的位置，创建点时要和地图当前空间参考保持一致，避免坐标偏移。

核心修改代码 #

1. 面板内新增的表单HTML（插入到#info容器的最开头，原有绘图按钮上方）：

<div style="margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #ccc;">
  <label>经度：</label>
  <input type="number" id="lngInput" step="0.000001" style="width: 100%; margin: 4px 0;">
  <label>纬度：</label>
  <input type="number" id="latInput" step="0.000001" style="width: 100%; margin: 4px 0;">
  <button id="markByCoordBtn" style="width: 100%; margin-top: 6px;">标记坐标点</button>
</div>

2. JS部分依赖补充，在原有require数组里加入Point模块，对应回调函数参数同步新增Point：

require([
  "esri/map", "esri/toolbars/draw",
  "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol",
  "esri/symbols/PictureFillSymbol", "esri/symbols/CartographicLineSymbol", 
  "esri/graphic", "esri/geometry/Point",
  "esri/Color", "dojo/dom", "dojo/on", "dojo/domReady!"
], function(
  Map, Draw,
  SimpleMarkerSymbol, SimpleLineSymbol,
  PictureFillSymbol, CartographicLineSymbol, 
  Graphic, Point,
  Color, dom, on
) {
// 下方原有初始化地图、定义符号的代码保持不变

3. 在initToolbar函数内部新增按钮事件绑定代码：

// 原有面板绘图按钮的事件委托代码不变，新增下面这段
on(dom.byId("markByCoordBtn"), "click", function() {
  const lng = parseFloat(dom.byId("lngInput").value);
  const lat = parseFloat(dom.byId("latInput").value);
  // 校验输入合法性
  if (isNaN(lng) || isNaN(lat) || lng < -180 || lng > 180 || lat < -90 || lat > 90) {
    alert("请输入合法经纬度：经度范围-180~180，纬度范围-90~90");
    return;
  }
  // 创建点几何
  const targetPoint = new Point(lng, lat, map.spatialReference);
  // 添加点图形到地图
  map.graphics.add(new Graphic(targetPoint, markerSymbol));
  // 视角定位到标记点
  map.centerAndZoom(targetPoint, 12);
});

修改完成后原有手绘绘图的功能完全保留，同时支持输入经纬度快速打标，点的样式和手动画的点完全一致。

内容的提问来源于stack exchange，提问作者Edisson Gabriel López