高德地图线路规划方法

问题描述：

线路规划成功后，地图标记点怎么加文本标注和点击事件

答

请问你是在什么情况下用高德地图的服务的？请详细说明。

答

你都说标记点了，标记点就是数据结构里的一个节点，节点可以设计个文本标注类或连接，点击事件就加在文本类里，或是节点类里。你也没说系统，也没说代码。思路就这思路。

答

文本标记：

<script type="text/javascript">
    var map = new AMap.Map("container", {
        viewMode: '3D',
        zoom: 13,
        center: [116.4,39.92],
        resizeEnable: true
    });

    // 创建纯文本标记
    var text = new AMap.Text({
        text:'纯文本标记',
        anchor:'center', // 设置文本标记锚点
        draggable:true,
        cursor:'pointer',
        angle:10,
        style:{
            'padding': '.75rem 1.25rem',
            'margin-bottom': '1rem',
            'border-radius': '.25rem',
            'background-color': 'white',
            'width': '15rem',
            'border-width': 0,
            'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
            'text-align': 'center',
            'font-size': '20px',
            'color': 'blue'
        },
        position: [116.396923,39.918203]
    });

    text.setMap(map);
</script>

点击事件：

<script type="text/javascript">
    //初始化地图对象，加载地图
    var map = new AMap.Map("container", {
        resizeEnable: true
    });



    function showInfoClick(e){
        var text = '您在 [ '+e.lnglat.getLng()+','+e.lnglat.getLat()+' ] 的位置单击了地图！'
        document.querySelector("#text").innerText = text;
    }
    function showInfoDbClick(e){
        var text = '您在 [ '+e.lnglat.getLng()+','+e.lnglat.getLat()+' ] 的位置双击了地图！'
        document.querySelector("#text").innerText = text;
    }
    function showInfoMove(){
        var text = '您移动了您的鼠标！'
        document.querySelector("#text").innerText = text;
    }
    // 事件绑定
    function clickOn(){
        log.success("绑定事件!");  
        map.on('click', showInfoClick);
        map.on('dblclick', showInfoDbClick);
        map.on('mousemove', showInfoMove);
    }
    // 解绑事件
    function clickOff(){
        log.success("解除事件绑定!"); 
        map.off('click', showInfoClick);
        map.off('dblclick', showInfoDbClick);
        map.off('mousemove', showInfoMove);
    }
    
    // 给按钮绑定事件
    document.getElementById("clickOn").onclick = clickOn;
    document.getElementById("clickOff").onclick = clickOff;

</script>

有问题随时沟通

高德地图线路规划方法

相关推荐