console 命令行工具 X clear

console

var url = 'https://webapi.amap.com/maps?v=1.4.15&key=827fb7772a547f1089008109dbb094dc&callback=onLoad';
var jsapi = document.createElement('script');
jsapi.charset = 'utf-8';
jsapi.src = url;
document.head.appendChild(jsapi);

let geoData = [[116.347607,40.010254],[116.258343,40.03234]]
let map,infoWindow,polyline,markers = []
let offsetPos = [] // 按下后的偏移量
window.onLoad  = function(){
    map = new AMap.Map('container');

    infoWindow = new AMap.InfoWindow({offset: new AMap.Pixel(0, -30)});

    geoData.map((v,i)=>{
        let marker = new AMap.Marker({
            map:map,
            position:new AMap.LngLat (v[0],v[1]),
            index:i,
            draggable: true,
            cursor: 'move'
        });
        // 点击标记点触发
        marker.on('click', markerClick);
        // 拖动标记点触发
        marker.on('dragging', draggingFn)
        marker.on('mousedown', mousedownFn)
        markers.push(marker);
    })

    // 鼠标按下事件
    function mousedownFn(e){
        let index = e.target.w.index // index
        offsetPos = [e.lnglat.R - geoData[index][0],e.lnglat.Q - geoData[index][1]]
    }

    // 拖动标记点事件
    function draggingFn(e){
        let index = e.target.w.index // index
        let pos = [e.lnglat.R - offsetPos[0],e.lnglat.Q - offsetPos[1]]//标记点移动后的位置

        geoData[index] = pos
        drawPolyline(geoData)
    }

    // 创建点击标记点事件
    function markerClick(e) {
        //构建信息窗体中显示的内容
        infoWindow.setContent(
        "<ul class='main'><li> 节点： <span style='color:blue'>"+e.target.w.index+"</span></li>" 
        )
        infoWindow.open(map, e.lnglat);
    }

    function drawPolyline(position){
        if(polyline) map.remove(polyline)
        polyline = new AMap.Polyline({
            map: map,
            path:[position[0],position[1]],
            strokeColor: 'red',  //线颜色
            strokeOpacity: 1,     //线透明度
            strokeWeight: 3,      //线宽
            strokeStyle: "solid"  //线样式
        });
    }
    drawPolyline(geoData)
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
  </head>
  <body>
    <div id="container" style="width:100vw;height:100vh;"></div>
  </body>
</html>