任务描述:

啊,美妙的春节结束了。酸奶小妹和妈妈的山西平遥之旅也宣告成功!距离平遥古城7km,有一个同样身为“世界文化遗产”的寺庙,叫做“双林寺”。双林寺的精致、纯木质结构、保存完好等特点,让我不由得为之一振。这让我想到了,万事万物都需要对比,“取其精华,去其糟粕”。

双林寺如是,API也如是。这不,上班第一天,我就迫不及待地做起了API性能测试。

如何实现:

使用不同家的API,分别以随机新增覆盖物为测试用例,观察内存消耗变化。

需要使用到不同家API来分别写测试用例。测试工具为IE6。

目前,有baidu、google、mapbar和mapabc。(2011-02-09 15:14更新,添加51地图)

图示:

说明:

在这里,我只列举了marker的代码,以作示范。

按这个原理,我还测试了标签、多边形、圆形、折线、信息窗口等覆盖物。

运行代码,请点击以下链接:

百度marker:http://ui-love.com/baidumap/apitest/marker-baidu.htm

谷歌marker:http://ui-love.com/baidumap/apitest/marker-google.htm

mapbar:http://ui-love.com/baidumap/apitest/marker-mapbar.htm

mapabc:http://ui-love.com/baidumap/apitest/marker-mapabc.htm

51ditu:http://ui-love.com/baidumap/apitest/marker-51ditu.htm

源代码:

百度marker:

代码

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>Marker 性能</title>
<style type="text/css">/*<![CDATA[*/
body{margin:0;padding:0;font-family:Times New Roman, serif}
p{margin:0;padding:0}
#wrapper{width:100%;margin:auto;text-align:left;height:100%}
#map_container{height:480px;margin:0}
#notes{position:absolute;right:10px;width:200px;top:10px}

@media print{
input{display:none}
#notes{display:none}
#map_container{margin:10px;border:none}
}
/*]]>*/</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.1&services=true"></script>
</head>

<body>
<div id="map_container"></div>
<div id="test_container">
<input type="button" onclick="test_mem()" value="mem_test" />
<input type="button" onclick="stop_mem()" value="stop_test" />
</div>
</div>

</body>
<script type="text/javascript">
if (typeof console == "undefined"){
window.console = {
log: function(){
}
}
}

// 创建地图对象并初始化
var mp = new BMap.Map("map_container");
var point = new BMap.Point(116.404, 39.915);
mp.centerAndZoom(point, 14);

// 内存性能测试
var count = 0;

function createInfo() {
mp.clearOverlays();
if (count > 5000) {
clearInterval(window._timer);
alert("测试结束,一共运行"+count+"次。");
}
createMarkers();
}
function createMarkers(){
var bounds = mp.getBounds();
var lngSpan = bounds.maxX - bounds.minX;
var latSpan = bounds.maxY - bounds.minY;
for (var i = 0; i < 30; i ++) {
count ++;
var point = new BMap.Point(bounds.minX + lngSpan * (Math.random() * 0.7 + 0.15),
bounds.minY + latSpan * (Math.random() * 0.7 + 0.15));
var marker = new BMap.Marker(point);
mp.addOverlay(marker);
}
}
function test_mem() {
window._timer = setInterval(createInfo, 10);
}
function stop_mem() {
clearInterval(window._timer);
alert("运行了"+count+"次");
}
</script>
</html>

谷歌marker:

代码

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>Marker 性能</title>
<style type="text/css">/*<![CDATA[*/
body{margin:0;padding:0;font-family:Times New Roman, serif}
p{margin:0;padding:0}
#wrapper{width:100%;margin:auto;text-align:left;height:100%}
#map_container{height:480px;margin:0}
#notes{position:absolute;right:10px;width:200px;top:10px}

@media print{
input{display:none}
#notes{display:none}
#map_container{margin:10px;border:none}
}
/*]]>*/</style>
<script src="http://ditu.google.cn/maps?file=api&amp;v=2&amp;key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA&hl=zh-CN"
type="text/javascript"></script>
</head>

<body>
<div id="map_container"></div>
<div id="test_container">
<input type="button" onclick="test_mem()" value="mem_test" />
<input type="button" onclick="stop_mem()" value="stop_test" />
</div>
</div>

</body>
<script type="text/javascript">
if (typeof console == "undefined"){
window.console = {
log: function(){
}
}
}
//谷歌地图初始化
var map = new GMap2(document.getElementById("map_container"));
map.setCenter(new GLatLng(39.917, 116.397), 14);
// 内存性能测试
var count = 0;
function createInfo() {
map.clearOverlays();
if (count > 5000) {
clearInterval(window._timer);
alert("测试结束"+count);
}
createMarkers();
}
function createMarkers(){
// 随机向地图添加 30 个标记
var bounds = map.getBounds();
var southWest = bounds.getSouthWest();
var northEast = bounds.getNorthEast();
var lngSpan = northEast.lng() - southWest.lng();
var latSpan = northEast.lat() - southWest.lat();
for (var i = 0; i < 30; i++) {
count ++;
var latlng = new GLatLng(southWest.lat() + latSpan * Math.random(),
southWest.lng() + lngSpan * Math.random());
map.addOverlay(new GMarker(latlng));
}
}
function test_mem() {
window._timer = setInterval(createInfo, 10);
}
function stop_mem() {
clearInterval(window._timer);
alert("计数器"+count);
}
</script>
</html>

mapbar:

代码

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>Marker 性能</title>
<style type="text/css">/*<![CDATA[*/
body{margin:0;padding:0;font-family:Times New Roman, serif}
p{margin:0;padding:0}
#wrapper{width:100%;margin:auto;text-align:left;height:100%}
#map_container{height:480px;margin:0}
#notes{position:absolute;right:10px;width:200px;top:10px}

@media print{
input{display:none}
#notes{display:none}
#map_container{margin:10px;border:none}
}
/*]]>*/</style>
<script type="text/javascript" src="http://union.mapbar.com/apis/maps/free?f=mapi&v=31.2&k=aCW9cItqL7sqT7AxaB0zdHZoZSWmbBsuT7JhMHTsMeD6ZIl9NzFsZHT=@JBL979@Iu7lJJZWWq0IDu9xZMzMxq7I9AhH7LAAA6hqzZHZZLTbZZauxlDz7C7DD9ZCFGT=">
</script>
</head>

<body>
<div id="map_container"></div>
<div id="test_container">
<input type="button" onclick="test_mem()" value="mem_test" />
<input type="button" onclick="stop_mem()" value="stop_test" />
</div>
</div>

</body>
<script type="text/javascript">
if (typeof console == "undefined"){
window.console = {
log: function(){
}
}
}
//地图初始化
maplet = new Maplet("map_container");
maplet.centerAndZoom(new MPoint(116.38672,39.90805), 8);
maplet.addControl(new MStandardControl());

// 内存性能测试
var count = 0;

function createInfo() {
maplet.clearOverlays();
if (count > 3000) {
clearInterval(window._timer);
alert("测试结束"+count);
}
createMarkers();
}
function createMarkers(){
var lngSpan = 116.43683 - 116.29069;
var latSpan = 39.98916 - 39.88337;
for (var i = 0; i < 30; i ++) {
count ++;
var point = new MPoint(116.29069 + lngSpan * (Math.random() * 0.7 + 0.15),
39.88337 + latSpan * (Math.random() * 0.7 + 0.15));

var marker = new MMarker(
point,
new MIcon("http://union.mapbar.com/apidoc/images/tb1.gif",32,32)
);
maplet.addOverlay(marker);

}
}
function test_mem() {
window._timer = setInterval(createInfo, 10);
}
function stop_mem() {
clearInterval(window._timer);
alert("计数器"+count);
}
</script>
</html>

mapabc:

代码

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>Marker 性能</title>
<style type="text/css">/*<![CDATA[*/
body{margin:0;padding:0;font-family:Times New Roman, serif}
p{margin:0;padding:0}
#wrapper{width:100%;margin:auto;text-align:left;height:100%}
#map_container{height:480px;margin:0}
#notes{position:absolute;right:10px;width:200px;top:10px}

@media print{
input{display:none}
#notes{display:none}
#map_container{margin:10px;border:none;width:600px; height:500px;overflow:hidden;}
/*]]>*/</style>
<script type="text/javascript" src="http://app.mapabc.com/apis?&t=ajaxmap&v=2.1.2&key=b0a7db0b3a30f944a21c3682064dc70ef5b738b062f6479a5eca39725798b1ee300bd8d5de3a4ae3|29e8ed1f7f6a97d8e99fc568cea6a7dc0ccd920856e07c0718b9885faf7551a18141699c81f526d7">
</script>
</head>

<body>
<div id="map_container"></div>
<div id="test_container">
<input type="button" onclick="test_mem()" value="mem_test" />
<input type="button" onclick="stop_mem()" value="stop_test" />
</div>
</div>

</body>
<script type="text/javascript">
if (typeof console == "undefined"){
window.console = {
log: function(){
}
}
}

var mapOptions = new MMapOptions();//构建地图辅助类
mapOptions.zoom=12;//要加载的地图的缩放级别
mapOptions.center=new MLngLat(116.36890411376953,39.913423004886866);//要加载的地图的中心点经纬度坐标
mapOptions.toolbar = DEFAULT;//设置地图初始化工具条
mapObj=new MMap("map_container",mapOptions); //地图初始化

// 内存性能测试
var count = 0;

function createInfo() {
mapObj.removeAllOverlays();
if (count > 5000) {
clearInterval(window._timer);
alert("测试结束");
}
createMarkers();
}
function createMarkers(){
var bounds = mapObj.getLngLatBounds();
myX = bounds.northEast.lngX - bounds.southWest.lngX;
myY = bounds.northEast.latY - bounds.southWest.latY;
for (var i = 0; i < 30; i ++) {
count ++;
var a = bounds.southWest.lngX + myX * (Math.random() * 0.7 + 0.15);
var b = bounds.southWest.latY + myY * (Math.random() * 0.7 + 0.15);
var markerOption = new MMarkerOptions();
markerOption.imageUrl="http://code.mapabc.com/images/lan_1.png";
Mmarker = new MMarker(new MLngLat(a,b),markerOption);
mapObj.addOverlay(Mmarker,true);
}
}
function test_mem() {
window._timer = setInterval(createInfo, 10);
}
function stop_mem() {
clearInterval(window._timer);
alert("计数器"+count);
}
</script>
</html>

51ditu:

代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>酸奶小妹——百度地图API学习</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<link rel="stylesheet" type="text/css" href="http://ui-love.com/baidumap/base.css" media="screen" />
<script language="javascript" src="http://api.51ditu.com/js/maps.js "></script>
</head>
<body>
<div class="wrapper">
<div class="header">
<h1>地图覆盖物内存优化测试--51地图API</h1>
<p><span class="f-r">2011-02-09</span>描述:</p>
<p>该测试为地图API的marker添加测试。请使用IE6浏览器,打开任务管理器,观察内存消耗变化。<br />
请点击地图下方的开始按钮,测试开始;点击暂停按钮,将观察到运行次数.<br />
一共运行5000次。
</p>
</div>
<div class="container clearfix">
<div class="f-l">
<div id="mapBox" class="myMap"></div>
<p>
<input type="button" onclick="test_mem()" value="开始" />
<input type="button" onclick="stop_mem()" value="暂停" />
</p>
</div>
<div class="f-r">
<img src="51ditu.jpg" alt="51ditu API覆盖物内存消耗" title="百51ditu API覆盖物内存消耗" />
<p>
本次测试全部采用IE6浏览器;<br />
本次测试的覆盖物全部采取随机方式创建;<br />
依次连续不间断做以上测试,不穿插其他测试;<br />
测试时间均为每1毫秒执行一次创建;<br />
测试期间,不新建其他进程。
</p>
</div>
</div>
<div class="info">
<p>谷歌广告:</p>
<div style="clear:both">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-5845154460812025";
/* 横幅728*90 */
google_ad_slot = "8606107205";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</div>
<div class="footer">
<span class="f-r">COPYRIGHT &copy; 酸奶小妹</span>
<span>友情链接:
<a target="_blank" href="http://openapi.baidu.com/map/index.html">百度地图API</a>|
<a target="_blank" href="http://tieba.baidu.com/f?kw=%B0%D9%B6%C8%B5%D8%CD%BCapi&fr=tb0_search&ie=utf-8">百度地图API贴吧</a>|
<a target="_blank" href="http://map.baidu.com/">百度地图</a>|
<a target="_blank" href="http://www.cnblogs.com/milkmap/">酸奶小妹</a>
</span>
</div>
</div>
</body>
<script type="text/javascript">
if (typeof console == "undefined"){
window.console = {
log: function(){
}
}
}

// 创建地图对象并初始化
var mp = new LTMaps( "mapBox" );
mp.cityNameAndZoom( "beijing" , 5 );

// 内存性能测试
var count = 0;

function createInfo() {
mp.clearOverLays();
if (count > 5000) {
clearInterval(window._timer);
alert("测试结束,一共运行"+count+"次。");
}
createMarkers();
}
function createMarkers(){
var bounds = new LTBounds(11630969 , 3979945,11650969 , 3999945);
var lngSpan = bounds.Xmax - bounds.Xmin;
var latSpan = bounds.Ymax - bounds.Ymin;
for (var i = 0; i < 30; i ++) {
count ++;
var point = new LTPoint(bounds.Xmin + lngSpan * (Math.random() * 0.7 + 0.15),
bounds.Ymin + latSpan * (Math.random() * 0.7 + 0.15));
var marker = new LTMarker(point);
mp.addOverLay(marker);
}
}
function test_mem() {
window._timer = setInterval(createInfo, 10);
}
function stop_mem() {
clearInterval(window._timer);
alert("目前运行了"+count+"次");
}
</script>
</html>

附图:

双林寺大雄宝殿一角,对比过多家寺庙,才能发现双林寺的与众不同。当之无愧的“世界文化遗产”!

转载于:https://www.cnblogs.com/milkmap/archive/2011/02/09/1950142.html

【百度地图API】多家地图API内存消耗对比测验(带源码)相关推荐

  1. JAVA计算机毕业设计林家餐厅自助点餐管理系统(附源码、数据库)

    JAVA计算机毕业设计林家餐厅自助点餐管理系统(附源码.数据库) 目运行 环境项配置: Jdk1.8 + Tomcat8.5 + Mysql + HBuilderX(Webstorm也行)+ Ecli ...

  2. c语言复制粘贴源码,c语言函数memccpy()如何复制内存中的内容实例源码介绍

    c语言函数memccpy()如何复制内存中的内容实例源码介绍.引入的头文件:#include memccpy()函数定义:void * memccpy(void *dest, const void * ...

  3. 掌握鸿蒙轻内核静态内存的使用,从源码分析开始

    摘要:静态内存实质上是一个静态数组,静态内存池内的块大小在初始化时设定,初始化后块大小不可变更.静态内存池由一个控制块和若干相同大小的内存块构成.控制块位于内存池头部,用于内存块管理.内存块的申请和释 ...

  4. Linux内存管理 brk(),mmap()系统调用源码分析2:brk()的内存释放流程

    Linux brk(),mmap()系统调用源码分析 brk()的内存释放流程 荣涛 2021年4月30日 内核版本:linux-5.10.13 注释版代码:https://github.com/Rt ...

  5. 基于JAVA林家餐厅自助点餐管理系统计算机毕业设计源码+数据库+lw文档+系统+部署

    基于JAVA林家餐厅自助点餐管理系统计算机毕业设计源码+数据库+lw文档+系统+部署 基于JAVA林家餐厅自助点餐管理系统计算机毕业设计源码+数据库+lw文档+系统+部署 本源码技术栈: 项目架构:B ...

  6. 计算机毕业设计ssm家猪智能饲养管理系统wt2ah系统+程序+源码+lw+远程部署

    计算机毕业设计ssm家猪智能饲养管理系统wt2ah系统+程序+源码+lw+远程部署 计算机毕业设计ssm家猪智能饲养管理系统wt2ah系统+程序+源码+lw+远程部署 本源码技术栈: 项目架构:B/S ...

  7. asp毕业设计——基于asp+access的辅导员之家网站设计与实现(毕业论文+程序源码)——辅导员之家网站

    基于asp+access的辅导员之家网站设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于asp+access的辅导员之家网站设计与实现,文章末尾附有本毕业设计的论文和源码下载地址哦.需要下 ...

  8. Asp.Net Web Api 2 实现多文件打包并下载文件示例源码

    前言 最近由于工作和个人事务,站点也好久没更新了,但这并不影响我对.NET的热情.站点的更新工作还是得想办法抽时间来完成的. 提要 今天利用中午的时间来写一篇关于Asp.Net Web Api下载文件 ...

  9. 使用高德地图微信小程序SDK开发案例-输入提示(附源码)

    闲来无事写一篇使用高德地图的微信小程序SDK开发应用的实例. 接下来先看需求: 我们要做的是,根据用户输入的关键词,给出相应的提示信息,列表中显示地方的名称,地方的详细地址以及对应的经纬度坐标. 当然 ...

最新文章

  1. python 查找文件内容字符串位置_python 查找目录下 文件名中含有某字符串的文件...
  2. 越小越好:为什么电子器件都这么小巧玲珑?
  3. PHP-7.1 源代码学习:虚拟机字节码
  4. leetcode 330. Patching Array | 1798. Maximum Number of Consecutive Values You Can Make
  5. 数学之路(3)-机器学习(3)-机器学习算法-SVM[7]
  6. 低欲望社会有多可怕?仅94万!日本去年新生人口数创历史新低,空房子如瘟疫般蔓延...
  7. Numbers on the Chessboard(CF-1027B)
  8. 是男人就下100层【第五层】——2048游戏从源码到发布市场
  9. Linux高性能server规划——处理池和线程池
  10. Linux中搭建YUM
  11. linux下多线程的创建与等待详解 【转载】
  12. Lynis – 用于Linux服务器的自动安全审计工具
  13. tensorflow之读取jpg图像长和宽
  14. 64 位SQL Server 2005通过DB link链接32位SQL Server 2000 的bug解决
  15. python selenium qwebengineview获取页面元素_selenium操作详解之获取元素状态
  16. 论文阅读笔记——Adversarial Attack on Attackers Post-Process to
  17. 4G的小程序与5G的Chromium OS?
  18. java 流水_Java之流水号生成器实现
  19. Python基础应用-摄氏温度换算
  20. Airbnb产品数据分析

热门文章

  1. strutr2运行流程
  2. 虚拟化Hadoop集群的部署和管理 - 基本操作
  3. js获取字符串的字节数
  4. 安装完补丁后是否需要服务器重新启动
  5. 代码的坏味道:控制结构嵌套太深
  6. 虚拟桌面的备份恢复最佳实践 第二部分
  7. 黑客攻防技术宝典Web实战篇第2版—第7章 攻击会话管理
  8. SpringCloud OpenFeign服务调用客户端介绍及配置使用
  9. ObjectOutputStream 和 ObjectInputStream类的简单介绍,及运用。
  10. Vue mixins学习