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

293 阅读 0 评论 194 点赞

我是靠谱客的博主忧心老师，最近开发中收集的这篇文章主要介绍模仿百度三维地图的js数据分享，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

百度三维地图的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数据就和百度上相同了。