模仿百度三维地图的js数据分享


Posted in Javascript onMay 12, 2011

百度三维地图的js数据格式:mapData["sign"] ["5,158,141"]={"busStation":{"4,317,282": [{"id":"ff8080811c462eb7011d2e23d5b91083","name":"地安门站","y":579152,"x":650606}, {"id":"ff8080811c462eb7011d2e2414f31085","name":"地安门站","y":579176,"x":650750}],"4,316,283": [{"id":"ff8080811c462eb7011d2cc3d5630ef3","name":"白士站","y":580232,"x":648834}]}}

我们进行模仿,首先了解下作为关联数组的对象的概念:
var o = new Object();
o.x="Hello!";
上面我们定义了一个对象,对象的一个属性是x,这样的形式是我们常见的。JavaScript中的对象可以作为关联数组使用,因为它们能够将任意的数据值和任意的字符串关联起来。如果采用这种方式使用对象,那么要访问的对象就要采用不同的语法,即使用一个由方括号封闭起来的、包含所需属性名的字符串,使用这种语法我们可以将上面的o对象的x属性进行如下赋值:
var o = new Object();
o["x"]="Hello!"
这种方式在某些情况下是必要的,例如在你不知道属性名的情况下,就不能使用"."来存取对象的属性,但是可以使用运算符[]来命名属性,因为它的属性名是一个字符串值(该值是动态的,在运行时可以改变),而不是一个标识符(它是静态的,在程序中必须进行硬编码)。如果使用一个对象时采用的是这种方式,我们称它为关联数组。(详细参见《JavaScript权威指南(第四版)》(155页))
通过上面的描述,我们可以这样来定义一个对象:

(1)<script type="text/javascript">
var o = new Object();
var x =MapData[2];
var y = MapData[3];
o[x] = new Object();
o[x][y] = {"id":MapData[0],"icolor":MapData[1],"x":MapData[2],"y":MapData[3],"coordinate":MapData[4],"type":MapData[5],"attribute":MapData[6]};
//o[x][y]={"busStation":{"4,315,283": [{"id":"ff8080811c462eb7011d238c49a00b35","name":"西板桥公交站","y":580326,"x":646206}, //{"id":"ff8080811c462eb7011d238dc5980b38","name":"西板桥公交站","y":580686,"x":645310}, //{"id":"ff8080811c462eb7011d2391ac470b3f","name":"故宫公交车站","y":581454,"x":645606}, //{"id":"ff8080811c462eb7011d2392aea60b44","name":"故宫公交站","y":581470,"x":645690}]}};
alert(o[x][y]["id"]);
</script>
(2)我们还可以将对象的形式写成如下所示:

<script type="text/javascript">
var d ={"x":{"y":{'id':MapData[0],'icolor':MapData[1],"x":MapData[2],"y":MapData[3],"coordinate":MapData[4],"type":MapData[5],"attribute":MapData[6]}},"x1":{"y1":{"id":MapData[8],"icolor":MapData[1],"x":MapData[2],"y":MapData[3],"coordinate":MapData[4],"type":MapData[5],"attribute":MapData[6]}}}
alert(d["x"]["y"]["icolor"]);
</script>

至此,我们的js数据就和百度上相同了。

Javascript 相关文章推荐
基于jquery的高性能td和input切换并可修改内容实现代码
Jan 09 Javascript
JQuery表格内容过滤的实现方法
Jul 05 Javascript
js判断某个方法是否存在实例代码
Jan 10 Javascript
jQuery实现友好的轮播图片特效
Jan 12 Javascript
jquery插件jquery.nicescroll实现图片无滚动条左右拖拽的方法
Aug 10 Javascript
jQuery position() 函数详解以及jQuery中position函数的应用
Dec 14 Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
Mar 30 Javascript
Javascript中常用的检测方法小结
Oct 08 Javascript
Node.js利用js-xlsx处理Excel文件的方法详解
Jul 05 Javascript
vue动态绘制四分之三圆环图效果
Sep 03 Javascript
vue 手机物理监听键+退出提示代码
Sep 09 Javascript
JS实现简单贪吃蛇小游戏
Oct 28 Javascript
javascript数组去掉重复
May 12 #Javascript
javascript 弹出层组件(升级版)
May 12 #Javascript
ExtJS4 组件化编程,动态加载,面向对象,Direct
May 12 #Javascript
关于js获取radio和select的属性并控制的代码
May 12 #Javascript
js 第二代身份证号码的验证机制代码
May 12 #Javascript
基于JQuery的动态删除Table表格的行和列的代码
May 12 #Javascript
五个jQuery图片画廊插件 推荐
May 12 #Javascript
You might like
CentOS6.5 编译安装lnmp环境
2014/12/21 PHP
深入理解PHP变量的值类型和引用类型
2015/10/21 PHP
php将服务端的文件读出来显示在web页面实例
2016/10/31 PHP
动态表单验证的操作方法和TP框架里面的ajax表单验证
2017/07/19 PHP
PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能
2019/05/21 PHP
js no-repeat写法 背景不重复
2009/03/18 Javascript
JavaScript 精粹读书笔记(1,2)
2010/02/07 Javascript
基于jquery的button默认enter事件(回车事件)。
2011/05/18 Javascript
理解Javascript闭包
2013/11/01 Javascript
按下回车键指向下一个位置的一个函数代码
2014/03/10 Javascript
javascript针对不确定函数的执行方法
2015/12/16 Javascript
Ionic如何实现下拉刷新与上拉加载功能
2016/06/03 Javascript
微信小程序之picker日期和时间选择器
2017/02/09 Javascript
用js实现before和after伪类的样式修改的示例代码
2017/09/07 Javascript
详解基于Node.js的HTTP/2 Server实践
2018/05/31 Javascript
vue.js通过路由实现经典的三栏布局实例代码
2018/07/08 Javascript
nodejs基础之多进程实例详解
2018/12/27 NodeJs
[14:56]教你分分钟做大人:巫医
2014/10/30 DOTA
[49:27]2018DOTA2亚洲邀请赛 4.4 淘汰赛 TNC vs VG 第一场
2018/04/05 DOTA
总结用Pdb库调试Python的方式及常用的命令
2016/08/18 Python
numpy自动生成数组详解
2017/12/15 Python
Python使用Matplotlib实现Logos设计代码
2017/12/25 Python
在python3中pyqt5和mayavi不兼容问题的解决方法
2019/01/08 Python
git查看、创建、删除、本地、远程分支方法详解
2020/02/18 Python
python实现数字炸弹游戏
2020/07/17 Python
HTML5+lufylegend实现游戏中的卷轴
2016/02/29 HTML / CSS
复古风格的女装和装饰品:ModCloth
2017/12/29 全球购物
校园歌手大赛策划书
2014/01/17 职场文书
文明餐桌行动实施方案
2014/02/19 职场文书
市场开发计划书
2014/05/07 职场文书
英文演讲稿
2014/05/15 职场文书
党课心得体会范文
2014/09/09 职场文书
项目技术负责人岗位职责
2015/04/13 职场文书
2015年银行员工工作总结
2015/04/24 职场文书
2016年元旦致辞
2015/08/01 职场文书
中学教代会开幕词
2016/03/04 职场文书