<?php

echo <<<_END

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">

    <title>点标记</title>

    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>

    <style>

        .marker {

            color: #ff6600;

            padding: 4px 10px;

            border: 1px solid #fff;

            white-space: nowrap;

            font-size: 12px;

            font-family: "";

            background-color: #0066ff;

        }

    </style>

    <script src="http://webapi.amap.com/maps?v=1.3&key=您申请的key值"></script>

    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>

</head>

<body>

<div id="container"></div>

<script>

    var marker, map = new AMap.Map("container", {

        resizeEnable: true,

        center: [126.60580555556, 45.702363888889],

        zoom: 13

    });

    var getJSON = function(url) {

      return new Promise(function(resolve, reject) {

        var xhr = new XMLHttpRequest();

        xhr.open('get', url, true);

        xhr.responseType = 'json';

        xhr.onload = function() {

          var status = xhr.status;

          if (status == 200) {

            resolve(xhr.response);

          } else {

            reject(status);

          }

        };

        xhr.send();

      });

    };

    getJSON('http://web.cellpies.com/api/driving/getVehicleLocationPoints?vehicleDeviceId=0400000000030603&timeType=4&startTime=2017-03-17%2013:00:00&stopTime=2017-03-17%2014:00:00').then(function(jdata) {

        //alert('Your Json result is:  ' + jdata); //you can comment this, i used it to debug

        //alert(jdata.data[0].gpsx);

        //alert(jdata.data[0].gpsy);

        window.i=0;

        //addMarker(jdata.data[i].gpsx,jdata.data[i].gpsy);

        setInterval("addMarker()","1000");

    }, function(status) { //error detection....

      alert('Something went wrong.');

    });

    // 实例化点标记

 function addMarker() {

     window.i+=0.01;

        marker = new AMap.Marker({

            icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",

            position: [126.60580555556+window.i, 45.702363888889+window.i]

        });

        marker.setMap(map);

    }

</script>

</body>

</html>

</script>

</body>

</html>

_END;

?>

通过setInterval函数在地图上每隔1s打一次点的更多相关文章

  1. 寻路优化（一）——二维地图上A*启发函数的设计探索

    工作中需要优化A*算法,研究了一天,最后取得了不错的效果.看网上的朋友还没有相关的研究,特此记录一下.有错误欢迎大家批评指正.如需转载请注明出处,http://www.cnblogs.com/Leon ...

  2. 定时器相关 setTimeout setInterval 函数节流

    这个问题也是在参加百度的前端技术学院中遇到的 任务中需要用js实现动画  导师给的评价中setInterval会导致bug 当时不理解   下面把自己学习的过程分享出来 再次理解单线程   老是说js ...

  3. 浅谈setTimeout函数和setInterval函数

    前几天学了js,看到了两个非常有趣的函数,他们分别是setTimeout函数和setInterval函数,这两个函数能使网页呈现非常一些网页中比较常见的效果,比如说图片轮播,等一些非常好玩的效果.下面 ...

  4. 获取json数据后在 地图上打点，根据 json不断移动点的位置

    <?php echo <<<_END <!doctype html> <html> <head> <meta charset=&quo ...

  5. 什么是setTimeout函数和setInterval函数?

    我们一般在浏览网页的时候,一般都会有图片轮播等,一些比较好玩的特效,接下来我就给大家讲讲这俩个函数! 一setTimeout函数和setInterval函数的语法以及应用 1.setTimeout函数 ...

  6. 如何在iOS地图上高效的显示大量数据

    2016-01-13 / 23:02:13 刚才在微信上看到这篇由cocoachina翻译小组成员翻译的文章,觉得还是挺值得参考的,因此转载至此,原文请移步:http://robots.thought ...

  7. 插件～使用ECharts动态在地图上标识点~动态添加和删除标识点

    之前写过一个Echarts的文章,没有基础的同学可以先看这<上一篇>,对于一个地图和说,我们在初始化之后,你可能被在地图上标识出一些点,当然这根据你的业务去标识,而如果每次更新数据都加载全 ...

  8. google maps js v3 api教程(2) -- 在地图上添加标记

    原文链接 google maps javascript官方文档:https://developers.google.com/maps/documentation/javascript/ 我们在创建地图 ...

  9. html5定位并在百度地图上显示

    在开发移动端 web 或者webapp时,使用百度地图 API 的过程中,经常需要通过手机定位获取当前位置并在地图上居中显示出来,这就需要用到html5的地理定位功能. navigator.geolo ...

随机推荐

  1. HTTP协议头了解

    Cache-Control:max-age =0 Cache-Control no-cache — 强制每次请求直接发送给源服务器,而不经过本地缓存版本的校验.这对于需要确认认证应用很有用(可以和pu ...

  2. POJ 2137 DP

    思路: 枚举第一个点集中起点是哪个. 因为第i个点集总和第i-1个点集和第i+1个点集相连. 我们就可以DP求出最优解了. f[i][j]=min(f[i][j],f[i-1][k]+dis(i,j, ...

  3. windows 下安装 php-memcached 扩展

    通过 phpinfo()观察 3 个参数,即 php 版本, ts/nts, vc6/vc9 根据上步中的参数,到http://pecl.php.net/ 下载匹配的 memcache.dll 再次观 ...

  4. 敬请关注 Linr 公众号

  5. javascript中缓存

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. SQL Server 2014 中，新建登录用户，分配权限，并指定该用户的数据

    一.运行环境 系统:Windows 10数据库:SQL Server 2014数据库名: APP     新建的用户名: app 二.操作步骤 1.打开 MS SQL Server Managemen ...

  7. 浅谈AVL树,红黑树,B树,B+树原理及应用

    背景:这几天在看<高性能Mysql>,在看到创建高性能的索引,书上说mysql的存储引擎InnoDB采用的索引类型是B+Tree,那么,大家有没有产生这样一个疑问,对于数据索引,为什么要使 ...

  8. 结构化编程-Structured programming

    结构话编程强调的是对流程的控制: 它为面向过程编程提供天然的支持. Structured programming is a programming paradigm aimed at improvin ...

  9. 路飞学城Python-Day23（practise）

    本章总结 练习题 什么是C/S架构? 互联网协议是什么?分别介绍五层协议中每一层的功能? 基于tcp协议通信,为何建立链接需要三次握手,而断开链接却需要四次挥手 为何基于tcp协议的通信比基于udp协 ...

  10. Docker-镜像的操作命令

    2.镜像在Ubuntu中的一些命令 (1)docker image ls 列出镜像 能够罗列出docker中所以的镜像所在的仓库.镜像标签.镜像ID.镜像的创建日期.镜像的大小等等信息. (2)doc ...