ArcGIS JavaScript的vue2地图小工具鹰眼

在 ArcGIS JavaScript API 中，可以使用小部件（Widget）来添加一些地图上的交互元素，如鹰眼视图（Overview Map）。

如果你想在 Vue 2 中使用 ArcGIS JavaScript API 来实现鹰眼小工具，可以按照以下步骤操作：

1. 在你的 Vue 2 项目中安装 ArcGIS JavaScript API。可以通过 npm 或者 CDN 等方式进行安装。

2. 在 Vue 的组件中引入 ArcGIS JavaScript API 并创建一个小部件（Widget）。

<template>
  <div>
    <div ref="mapViewNode"></div>
    <div ref="overviewMapDiv"></div>
  </div>
</template>

<script>
import EsriMap from "esri/Map";
import MapView from "esri/views/MapView";
import OverviewMap from "esri/widgets/OverviewMap";

export default {
  name: "MapView",
  data() {
    return {
      mapView: null,
      overviewMap: null
    };
  },
  mounted() {
    this.initMap();
  },
  methods: {
    initMap() {
      const map = new EsriMap({
        basemap: "streets-navigation-vector"
      });

      this.mapView = new MapView({
        container: this.$refs.mapViewNode,
        map: map,
        center: [-118.80500, 34.02700],
        zoom: 13
      });

      this.overviewMap = new OverviewMap({
        view: this.mapView,
        container: this.$refs.overviewMapDiv,
        visible: true
      });

      this.mapView.ui.add(this.overviewMap, {
        position: "bottom-right"
      });
    }
  }
};
</script>

在上面的代码中，我们首先引入了 EsriMap、MapView 和 OverviewMap 等需要使用的模块。然后在组件的 `mounted` 方法中调用 `initMap` 方法来初始化地图和小工具。

在 `initMap` 方法中，我们首先创建一个地图，然后在地图上创建一个 MapView。接着，我们创建一个 OverviewMap 小工具，并将其添加到 MapView 的 UI 中。

最后，在组件的模板中，我们需要添加两个容器，分别用来放置 MapView 和 OverviewMap。

<div ref="mapViewNode"></div>
<div ref="overviewMapDiv"></div>

这样，就可以在 Vue 2 中使用 ArcGIS JavaScript API 来实现鹰眼小工具了。