高德地图 成都市地图显示 VSCODE代码

高德地图是一个提供在线地图服务的平台，常用于Android和iOS应用开发以及Web项目中。在Visual Studio Code (VSCODE) 中，如果你想通过JavaScript或TypeScript使用高德地图API来展示成都市地图，你可以按照以下步骤操作：

1. **安装依赖**：首先，在VSCODE中创建一个新的JavaScript或TypeScript项目，确保已经安装了Node.js环境。然后，可以使用npm（Node Package Manager）来安装`@agm/core`库，它包含了高德地图的相关组件：

   npm install @agm/core

2. **引入模块**：在你的代码文件（通常是`index.html`或`.ts`文件）中，导入`@agm/core`和相关的地图模块：

   import { AgmCoreModule } from '@agm/core';
   // 如果你使用TypeScript，加上这个注解
   // import * as googleMaps from '@agm/core'; // TypeScript only

3. **初始化地图**：

   const map = new google.maps.Map(document.getElementById('map-canvas'), {
     zoom: 12,
     center: { lat: 30.6749, lng: 104.0665 }, // 成都坐标
     libraries: ['places'] // 加入位置搜索功能
   });

4. **添加高德地图插件**：
如果需要特定于高德地图的功能，例如公交路线、POI检索等，你需要加载对应的JS脚本，并在适当的时候注册它们。

5. **显示成都市地图**：
设置地图的中心点和缩放级别，将地图元素添加到HTML页面上相应的位置。

<!-- index.html -->
<div id="map-canvas"></div>