美文网首页
高德地图API绘制Polygon多边形以及清除

高德地图API绘制Polygon多边形以及清除

作者: 牛奶大泡芙 | 来源:发表于2018-05-31 18:39 被阅读0次

    今天讨论这样一个场景:根据一组给定的坐标来绘制很多很多的多边形,并且在一个事件里面清除所有的形状,我用的是高德地图api,有的细节和思路在文档里面不能快速找到清晰的说明,大家看了以下的代码希望能有所启发
    绘制图像:

            items.map(item => {
              let { fenceid, fence } = item;
      
              const pathPoint = fence.map(value => {
                return [x, y];
              });
      
                let polygon = new AMap.Polygon({
                  path: pathPoint,
                  strokeWeight: 1,
                  strokeColor: '#ff8f1f',
                  strokeOpacity: 0.9,
                  fillColor: '#4876FF',
                  fillOpacity: 0,
                  map: this.map
                });
                this.cache[fenceid] = {
                  fence,
                  polygon
                }; 
    
                polygon.setMap(this.map);    
            });
    

    清除图像:

    clearFence = ()=>{
          if(this.cache){
            for(let i in this.cache){
              var _i = i;
              this.cache[i].polygon.hide();
            }
            this.cache = {};
          }
          return;
        }
    

    相关文章

      网友评论

          本文标题:高德地图API绘制Polygon多边形以及清除

          本文链接:https://www.haomeiwen.com/subject/roccsftx.html