百度地图实现多点轨迹回放

最新推荐文章于 2020-11-02 17:50:25 发布

IT~少年人

最新推荐文章于 2020-11-02 17:50:25 发布

阅读量2.9k

点赞数 2

分类专栏：原生javascript 百度地图

本文链接：https://blog.youkuaiyun.com/qq_43634982/article/details/106224530

版权

效果图如：

在这里插入图片描述
复制急用
不喜勿喷

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>百度地图api</title>
    <style>
        * {
   
            margin: 0;
            padding: 0;
        }

        html,
        body {
   
            width: 100%;
            height: 100%;
        }

        body {
   
            padding: 20px;
            box-sizing: border-box;
        }

        #map {
   
            width: 100%;
            height: 100%;
        }
    </style>
</head>

<body>
    <div id="map"></div>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=OGXWW2p8X4EO89AoQet4wAVX9Og30PAS">
    </script>
    <script>
        const pathArr = [{
   
            "lat": "34.831103",
            "lng": "113.565289"
        }, {
   
            "lat": "34.833303",
            "lng": "113.550581"
        }, {
   
            "lat": "34.833481",
            "lng": "113.538634"
        }, {
   
            "lat": "34.795103",
            "lng": "113.537225"
        }, {
   
            "lat": "34.754263",
            "lng": "113.533147"
        }, {
   
            "lat": "34.741741",
            "lng": "113.539167"
        }, {
   
            "lat": "34.720785",
            "lng": "113.542186"
        }, {
   
            "lat": "34.720208",
            "lng": "113.540752"
        }, {
   
            "lat": "34.729402",
            "lng": "113.545023"
        }, {
   
            "lat": "34.730109",
            "lng": "113.544672"
        }, {
   
            "lat": "34.730332",
            "lng": "113.543938"
        }, {
   
            "lat": "34.729661",
            "lng": "113.544417"
        }, {
   
            "lat": "34.730087",
            "lng": "113.544987"

最低0.47元/天解锁文章