模仿百度三维地图的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——表单应用范例
Feb 20 Javascript
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
May 13 Javascript
javascript实现列表切换效果
May 02 Javascript
微信小程序开发之map地图实现教程
Jun 08 Javascript
基于Datatables跳转到指定页的简单实例
Nov 09 Javascript
javascript中一些奇葩的日期换算方法总结
Nov 14 Javascript
发布Angular应用至生产环境的方法
Dec 10 Javascript
vuex页面刷新后数据丢失的方法
Jan 17 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
Mar 28 Javascript
js new Date()实例测试
Oct 31 Javascript
微信小程序canvas开发水果老虎机的思路详解
Feb 07 Javascript
如何在面试中手写出javascript节流和防抖函数
Oct 22 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
德生1994机评
2021/03/02 无线电
php 删除cookie和浏览器重定向
2009/03/16 PHP
php下保存远程图片到本地的办法
2010/08/08 PHP
php park、unpark、ord 函数使用方法(二进制流接口应用实例)
2010/10/19 PHP
php自定义错误处理用法实例
2015/03/20 PHP
thinkPHP实现将excel导入到数据库中的方法
2016/04/22 PHP
浅谈PHP array_search 和 in_array 函数效率问题
2019/10/15 PHP
Add a Table to a Word Document
2007/06/15 Javascript
JavaScript 闭包深入理解(closure)
2009/05/27 Javascript
javascript 正则表达式相关应介绍
2012/11/27 Javascript
图片动画横条广告带上下滚动的JS代码
2013/10/25 Javascript
妙用Bootstrap的 popover插件实现校验表单提示功能
2016/08/29 Javascript
js常用的继承--组合式继承
2017/03/06 Javascript
jQuery插件FusionCharts绘制的2D条状图效果【附demo源码】
2017/05/13 jQuery
JS非行间样式获取函数的实例代码
2018/06/05 Javascript
Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖
2018/11/25 Javascript
vue props default Array或是Object的正确写法说明
2020/07/30 Javascript
Python3中的真除和Floor除法用法分析
2016/03/16 Python
常见的python正则用法实例讲解
2016/06/21 Python
Java多线程编程中ThreadLocal类的用法及深入
2016/06/21 Python
使用python将图片格式转换为ico格式的示例
2018/10/22 Python
判断python对象是否可调用的三种方式及其区别详解
2019/01/31 Python
python安装scipy的步骤解析
2019/09/28 Python
python的等深分箱实例
2019/11/22 Python
在Matplotlib图中插入LaTex公式实例
2020/04/17 Python
全球领先的鞋类零售商:The Walking Company
2016/07/21 全球购物
资产经营总监岗位职责
2013/12/04 职场文书
农民工工资发放承诺书
2014/03/31 职场文书
公司经理任命书
2014/06/05 职场文书
国家税务局领导班子对照检查材料思想汇报
2014/10/04 职场文书
2014年客房服务员工作总结
2014/11/18 职场文书
大学生国家助学金感谢信
2015/01/23 职场文书
毕业生就业推荐表自我评价
2015/03/02 职场文书
起诉意见书范文
2015/05/19 职场文书
网络妈妈观后感
2015/06/08 职场文书
Java spring定时任务详解
2021/10/05 Java/Android