高德地图轨迹坐标
高德地图轨迹坐标
dodotoday 发表于7个月前
高德地图轨迹坐标
  • 发表于 7个月前
  • 阅读 8
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 技术升级10大核心产品年终让利>>>   

摘要: 高德地图轨迹坐标
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    #container {
        width: 800px;
        height: 600px;
    }
</style>
<body>
<div id="container" tabindex="0"></div>
<div id="lnglat" tabindex="0"></div>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=你的KEY值(请在高德官网注册获取)"></script>
<script type="text/javascript">
    var map = new AMap.Map('container', {
        resizeEnable: true,
        zoom: 10,
        center: [116.398258, 39.904600]
    });

    var lineArr = [
        [116.22797, 39.988826], [116.214237, 39.948831],
        [116.207371, 39.92356], [116.207371, 39.88142],
        [116.24033, 39.839254], [116.263675, 39.803392],
        [116.318607, 39.781233], [116.414737, 39.785454],
        [116.472416, 39.797062], [116.531467, 39.819216],
        [116.554813, 39.86034], [116.55756, 39.905653],
        [116.54108, 39.938303], [116.525974, 39.982512],
        [116.472416, 40.002503], [116.414737, 40.01197],
        [116.358433, 40.01197],[116.270542, 40.00671],
        [116.234836, 39.995139],[116.22797, 39.988826],
        [116.214237, 39.948831]
    ];

    var polyline = new AMap.Polyline({
        path: lineArr,          //设置线覆盖物路径
        strokeColor: "#FF00FF", //线颜色
        strokeOpacity: 2,       //线透明度
        strokeWeight: 5,        //线宽
        strokeStyle: "solid",   //线样式
        strokeDasharray: [10, 5] //补充线样式
    });

    polyline.setMap(map);

    function getLnglat(e) {
        map.clearMap();//获取位置之前清除之前的坐标
        var x = e.lnglat.getLng();//经度
        var y = e.lnglat.getLat();//纬度
        document.getElementById("lnglat").innerHTML += "[" + x + "," + y + "],";
    }

    AMap.event.addListener(map, 'click', getLnglat); //点击事件
</script>
</body>
</html>

结果:

标签: 高德 js api
共有 人打赏支持
粉丝 0
博文 5
码字总数 702
×
dodotoday
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: