高德地图多边形覆盖物鼠标移入移除事件并改变覆盖物的颜色样式,根据省市县名称画出轮廓图,根据经纬度画出轮廓图。

var name = "北京市"
var RegionData = [[116.254,39.256],[116.254,39.256],[116.254,39.256],[116.254,39.256]]
    var district = null;
    var polygon;
    function drawBounds(name,RegionData) {
        //加载行政区划插件
        console.log(name);
        if(!district){
            //实例化DistrictSearch
            var opts = {
                subdistrict: 0,   //获取边界不需要返回下级行政区
                extensions: 'all',  //返回行政区边界坐标组等具体信息
                level: 'district'  //查询行政级别为 市
            };
            district = new AMap.DistrictSearch(opts);
        }
        //行政区查询
     //   district.setLevel(level)
        district.search(name, function(status, result) {
            if(polygon){
              map.remove(polygon)//清除上次结果
          	  polygon  = null;
            }
            var bounds = result.districtList[0].boundaries;
            if (bounds) {
              //生成行政区划polygon
              for(var i=0;i<bounds.length;i+=1){//构造MultiPolygon的path
                bounds[i] = [bounds[i]]
              }
              polygon = new AMap.Polygon({
                strokeWeight: 3,
                path: bounds,
                fillOpacity: 0.1,
                fillColor: '#80d8ff',
                strokeColor: '#BCFCF5'
              });
                map.add(polygon)

                  // 添加鼠标移入事件
            polygon.on("mousemove", function (event) {
                polygon.setOptions({
                    strokeWeight: 3,
                    fillOpacity: 0.4,
                    fillColor: '#fff',
                    strokeColor: '#fff'
                });
            });
            // 添加鼠标移出事件
            polygon.on("mouseout", function (event) {
                polygon.setOptions({

                    strokeWeight: 3,
                    fillOpacity: 0.1,
                    fillColor: '#80d8ff',
                    strokeColor: '#BCFCF5'
                });
            });
              //map.setFitView(polygon);//视口自适应
            }
             var myda = JSON.parse(RegionData);
                var polygon1 = new AMap.Polygon({
                    path: myda,
                    strokeWeight: 3,
                    fillOpacity: 0.1,
                   fillColor: '#FCF20F',
                   strokeColor: '#55FA64'
                })
            map.add([polygon1]);
            
        // 添加鼠标移入事件
        polygon1.on("mousemove", function (event) {
            polygon1.setOptions({
                path: myda,
                strokeWeight: 3,
                fillOpacity: 0.4,
                fillColor: '#fff',
                strokeColor: '#fff'
            });
        });
        // 添加鼠标移出事件
        polygon1.on("mouseout", function (event) {
            polygon1.setOptions({
                path: myda,
                strokeWeight: 3,
                fillOpacity: 0.1,
                fillColor: '#FCF20F',
                strokeColor: '#55FA64'
            });
        });
       

        });


         @*var Regio = RegionData.split(",");
            var myda = [];
            for (var i = 0; i < Regio.length / 2; i++) {
                myda.push([Regio[2*i], Regio[2*i+1]])
            }
            var path1 = [[101.28784915479986, 39.233284558137996], [120.28784915479986, 38.233284558137996],
                [96.28784915479986, 35.233284558137996], [115.28784915479986, 37.233284558137996],
                [105.28784915479986, 37.233284558137996], [112.28784915479986, 36.233284558137996]]
            var polygon1 = new AMap.Polygon({
                path: myda,
                strokeWeight: 1,
                fillOpacity: 0.4,
                fillColor: '#FCF20F',
                strokeColor: '#FC0000'
            })
            map.add([polygon1]);*@

    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
高德地图中,多边形是一种常见的覆盖物类型。您可以使用JavaScript API提供的`AMap.Polygon`类来添加、获取和删除多边形。下面是一些示例代码,演示如何使用`AMap.Polygon`类来操作多边形覆盖物。 ### 添加多边形覆盖物 要在地图上添加多边形覆盖物,您可以使用以下代码: ```javascript var map = new AMap.Map('container', { zoom: 13, center: [116.39, 39.9] }); var path = [[116.403322, 39.920255], [116.410703, 39.897555], [116.402292, 39.892353], [116.389846, 39.891365]]; var polygon = new AMap.Polygon({ map: map, path: path, strokeColor: '#FF33FF', strokeWeight: 6, fillColor: '#1791fc', fillOpacity: 0.4 }); ``` 在上面的代码中,我们创建了一个地图对象,然后定义了多边形的路径(path)和样式(strokeColor、strokeWeight、fillColor、fillOpacity),最后使用`new AMap.Polygon()`方法创建多边形覆盖物,并将其添加到地图上。 ### 获取多边形覆盖物 要获取多边形覆盖物的属性(如路径、样式等),您可以使用以下代码: ```javascript var path = polygon.getPath(); // 获取多边形的路径 var strokeColor = polygon.getOptions().strokeColor; // 获取多边形的边框颜色 var fillColor = polygon.getOptions().fillColor; // 获取多边形的填充颜色 ``` 在上面的代码中,我们使用`getPath()`方法获取多边形的路径,使用`getOptions()`方法获取多边形的选项,并从选项中获取边框颜色和填充颜色。 ### 删除多边形覆盖物 要删除多边形覆盖物,您可以使用以下代码: ```javascript polygon.setMap(null); // 将多边形从地图上删除 ``` 在上面的代码中,我们使用`setMap(null)`方法将多边形从地图上删除。 总结一下,您可以使用`AMap.Polygon`类来添加、获取和删除多边形覆盖物。您可以根据您的需求,修改多边形的属性和样式,实现更多地图功能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值