텐 센트 클 라 우 드 지 도 를 통합 하여 기하학 적 도형 을 그립 니 다.

​




  
  
  
  





  

  

    

    

    

  
  

      ：        

      ：  ctrl        

      ：       delete             

      ：          ，            ，            

      ：              ，              

      ：               ，             

      ：  esc        ，          ，       
  
  
    var map, editor, shape;

    function drawShape(e) {
      console.log("drawPolygon!!: ", e)
      shape = e
      document.getElementById(shape).className = "toolItem active";
      editor.setActiveOverlay(shape)
      editor.setActionMode(TMap.tools.constants.EDITOR_ACTION.DRAW);
    };
    function initMap() {
      //      
      map = new TMap.Map("map-container", {
        zoom: 17, //         
        center: new TMap.LatLng(40.04019000341765, 116.27446815226199) //          
      });

      //            
      editor = new TMap.tools.GeometryEditor({
        map, //           
        overlayList: [ //      
          {
            overlay: new TMap.MultiPolygon({
              map,
              styles: {
                highlight: new TMap.PolygonStyle({
                  color: 'rgba(255, 255, 0, 0.6)'
                }),
                highlight2: new TMap.PolygonStyle({
                  color: 'rgba(255, 0, 0, 0.6)'
                })
              }
            }),
            id: 'polygon',
            selectedStyleId: 'highlight'
          }, {
            overlay: new TMap.MultiCircle({
              map,
              styles: {
                highlight2: new TMap.CircleStyle({
                  color: 'rgba(255, 0, 0, 0.6)'
                })
              }
            }),
            id: 'circle',
            selectedStyleId: 'highlight2'
          }
        ],
        actionMode: TMap.tools.constants.EDITOR_ACTION.INTERACT, //         
        activeOverlayId: 'polygon', //     
        selectable: true, //       
        snappable: true //     
      });

      //     、  、  、      
      let evtList = ['delete', 'adjust'];
      evtList.forEach(evtName => {
        editor.on(evtName + '_complete', evtResult => {
          console.log(evtName, evtResult);
        });
      });
      //         ，        
      editor.on('draw_complete', (geometry) => {
        document.getElementById(shape).className = "toolItem";
        editor.setActionMode(TMap.tools.constants.EDITOR_ACTION.INTERACT);
      });
    }
  




​