高德地图 JS 把shp文件绘制到地图上

要在高德地图上绘制shp文件，你需要使用高德地图的JavaScript API和一个用于解析shp文件的库，如shpjs。以下是一个简化的代码示例，展示了如何使用shpjs将shp文件加载并绘制到高德地图上：

首先，确保你已经在你的HTML文件中包含了高德地图的JavaScript API和shpjs库：

<script src="https://webapi.amap.com/maps?v=1.4.15&key=YOUR_AMAP_KEY"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/shpjs/2.4.0/shp.min.js"></script>

然后，使用以下JavaScript代码来加载并绘制shp文件：

// 初始化高德地图
var map = new AMap.Map('container', {
    zoom: 10,
    center: [116.397428, 39.90923] // 设置中心点坐标
});
 
// 使用shpjs加载shp文件
shp(shp_url).then(function(geojson) {
    // 将加载的shp数据转换为GeoJSON
    var geoJSON = shp.parse(geojson);
 
    // 在高德地图上添加GeoJSON图层
    new AMap.GeoJSON({
        geoJSON: geoJSON, // 加载的GeoJSON对象
        map: map // 要添加到的地图实例
    }).then(function(geoJSONLayer) {
        // 完成绘制后的操作，例如：
        map.setFitView(); // 自动调整视图以展示所有图层
    });
});

在这个代码中，shp_url 是指向你的shp文件的URL。shpjs 库用于加载shp文件，并将其转换为GeoJSON格式。然后，我们使用高德地图的AMap.GeoJSON类将GeoJSON图层添加到地图上。

请确保替换YOUR_AMAP_KEY为你的高德地图API密钥，并在实际环境中正确设置shp_url。