模仿百度三维地图的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 相关文章推荐
走出JavaScript初学困境—js初学
Dec 29 Javascript
Javascript 日期处理之时区问题
Oct 08 Javascript
JavaScript 高级篇之DOM文档,简单封装及调用、动态添加、删除样式(六)
Apr 07 Javascript
详解jQuery移动页面开发中的ui-grid网格布局使用
Dec 03 Javascript
jQuery实现两个select控件的互移操作
Dec 22 Javascript
关于webpack2和模块打包的新手指南(小结)
Aug 07 Javascript
浅谈vue自定义全局组件并通过全局方法 Vue.use() 使用该组件
Dec 07 Javascript
微信小程序授权登录及解密unionId出错的方法
Sep 26 Javascript
卸载vue2.0并升级vue_cli3.0的实例讲解
Feb 16 Javascript
es6函数之尾调用优化实例分析
Apr 25 Javascript
如何在Vue中使localStorage具有响应式(思想实验)
Jul 14 Javascript
JavaScript缓动动画函数的封装方法
Nov 25 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
php设计模式 DAO(数据访问对象模式)
2011/06/26 PHP
ThinkPHP、ZF2、Yaf、Laravel框架路由大比拼
2015/03/25 PHP
PHP MVC框架路由学习笔记
2016/03/02 PHP
PHP实现无限分类的实现方法
2016/11/14 PHP
PHP实现链表的定义与反转功能示例
2018/06/09 PHP
求解开jscript.encode代码的asp函数
2007/02/28 Javascript
JavaScript Accessor实现说明
2010/12/06 Javascript
关于页面嵌入swf覆盖div层的问题的解决方法
2014/02/11 Javascript
javascript中的取反再取反~~没有意义
2014/04/06 Javascript
jQuery实现form表单元素序列化为json对象的方法
2015/12/09 Javascript
JS原型、原型链深入理解
2016/02/27 Javascript
Angular 常用指令实例总结整理
2016/12/13 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
JavaScript实现简单的双色球(实例讲解)
2017/07/31 Javascript
node.js中axios使用心得总结
2017/11/29 Javascript
vue将单页面改造成多页面应用的方法
2018/11/25 Javascript
vue实现点击按钮下载文件功能
2019/10/11 Javascript
JavaScript实现简单进度条效果
2020/03/25 Javascript
微信小程序实现简单购物车功能
2020/12/30 Javascript
使用python实现扫描端口示例
2014/03/29 Python
Python写的Socks5协议代理服务器
2014/08/06 Python
简单了解python中的与或非运算
2019/09/18 Python
使用Python给头像戴上圣诞帽的图像操作过程解析
2019/09/20 Python
给你一面国旗 教你用python画中国国旗
2019/09/24 Python
flask 框架操作MySQL数据库简单示例
2020/02/02 Python
python使用梯度下降算法实现一个多线性回归
2020/03/24 Python
pyCharm 设置调试输出窗口中文显示方式(字符码转换)
2020/06/09 Python
Python 实现RSA加解密文本文件
2020/12/30 Python
HTML5自定义视频播放器源码
2020/01/06 HTML / CSS
德国亚洲食品网上商店:asiafoodland.de
2019/12/28 全球购物
澳洲的UGG雪地靴超级市场:Uggs.com.au
2020/04/06 全球购物
简历的个人自我评价范文
2014/01/03 职场文书
车间统计员岗位职责
2014/01/05 职场文书
《记承天寺夜游》教学反思
2014/02/16 职场文书
国窖1573广告词
2014/03/21 职场文书
超市开业庆典活动策划方案
2014/09/15 职场文书