在vue中更改arcgis地图位置onClick

在Vue中更改ArcGIS地图位置onClick，可以通过以下步骤实现：

首先，确保你已经安装了ArcGIS API for JavaScript，并在Vue项目中引入相关的库文件。
在Vue组件中，可以使用@click指令来监听点击事件，并在对应的方法中处理地图位置的更改。
在方法中，首先获取到ArcGIS地图对象，可以使用esri-loader库来加载ArcGIS API，并通过loadModules方法加载esri/Map和esri/views/MapView模块。
创建一个地图实例，并指定地图的中心点和缩放级别。可以使用Map类来创建地图对象，通过center属性设置地图的中心点坐标，通过zoom属性设置地图的缩放级别。
更新地图的位置，可以通过调用地图视图对象的goTo方法来实现。goTo方法接受一个参数，可以是一个包含center和zoom属性的对象，用于指定地图的新中心点和缩放级别。

下面是一个示例代码：

<template>
  <div>
    <div id="mapView" style="height: 400px;"></div>
    <button @click="changeMapLocation">更改地图位置</button>
  </div>
</template>

<script>
import { loadModules } from 'esri-loader';

export default {
  mounted() {
    this.initMap();
  },
  methods: {
    async initMap() {
      const [Map, MapView] = await loadModules(['esri/Map', 'esri/views/MapView']);

      const map = new Map({
        basemap: 'streets'
      });

      this.mapView = new MapView({
        container: 'mapView',
        map: map,
        center: [-122.4194, 37.7749], // 初始中心点坐标
        zoom: 12 // 初始缩放级别
      });
    },
    changeMapLocation() {
      const newLocation = {
        center: [-118.2437, 34.0522], // 新的中心点坐标
        zoom: 10 // 新的缩放级别
      };

      this.mapView.goTo(newLocation);
    }
  }
};
</script>

在上述示例中，我们创建了一个包含地图和按钮的Vue组件。在initMap方法中，我们使用esri-loader库加载了esri/Map和esri/views/MapView模块，并创建了一个地图实例和地图视图实例。在changeMapLocation方法中，我们定义了新的地图位置，并通过goTo方法更新地图的位置。

请注意，上述示例中的代码仅供参考，具体的实现方式可能会根据你的项目需求和ArcGIS API的版本而有所不同。另外，如果你需要更多关于ArcGIS API for JavaScript的信息，可以参考腾讯云提供的ArcGIS API for JavaScript产品介绍。