vue2使用高德地图长沙市

要在 Vue 2 中使用高德地图，可以按照以下步骤进行：

1. 在 index.html 文件中添加高德地图 JavaScript SDK 的引用

<script src="https://webapi.amap.com/maps?v=1.4.15&key=你的高德地图API Key"></script>

2. 在 Vue 组件中添加地图容器

<template>
  <div id="mapContainer" style="height: 400px;"></div>
</template>

3. 在 Vue 组件的 mounted 钩子函数中初始化地图

mounted() {
  // 初始化地图
  const map = new AMap.Map('mapContainer', {
    zoom: 13, // 缩放级别
    center: [113.000000, 28.216666], // 地图中心点坐标
  });
}

其中，`AMap` 是高德地图 JavaScript SDK 中提供的全局变量，可以直接使用。`zoom` 和 `center` 分别表示地图的缩放级别和中心点坐标，可以根据实际需求进行调整。

4. 在 Vue 组件的 destroyed 钩子函数中销毁地图

destroyed() {
  // 销毁地图
  this.map.destroy();
}

完整代码示例：

<template>
  <div id="mapContainer" style="height: 400px;"></div>
</template>

<script>
export default {
  mounted() {
    // 初始化地图
    this.map = new AMap.Map('mapContainer', {
      zoom: 13, // 缩放级别
      center: [113.000000, 28.216666], // 地图中心点坐标
    });
  },
  destroyed() {
    // 销毁地图
    this.map.destroy();
  },
};
</script>

<style>
#mapContainer {
  width: 100%;
}
</style>

注意：在使用高德地图时，需要在高德开放平台申请 API Key，并在引用高德地图 JavaScript SDK 时将其作为参数传入。