仿高德地铁图 JS SDK

本文介绍了一个仿高德地图JS SDK的实现,包括程序目录、接入方式和数据解析步骤。首先,通过高德地铁API获取城市地铁线路数据并解析。接着,详细讲述了数据加载后初始化各层容器,绘制站点热区、线路、连接点和换乘站的过程。此外,还实现了站点交互、起点终点设置以及路径规划的视图展示。
摘要由CSDN通过智能技术生成

仿高德地图 JS SDK 仓库地址
image.png

程序目录

.
├── README.md #说明文档
├── dist
│├── bscroll.js #better-scroll库
├── gy-subway-data.json #地铁线路图数据
├── gy-subway-demo.html #启动页
├── sdk
│└── gy-subway-sdk.js #核心逻辑

接入方式

<script src="sdk/gy-subway-sdk.js"></script>
<script type="text/javascript">
    var map = new GYSubwayMap("wrapper", "tipView", {
    adcode: "1100", focusMiddleSite: true });
	map.onEvent("siteSelected", function (siteObj) {
   //站点选中
		selectedSiteObj = siteObj;
	});
	map.onEvent("loaded", function (dataList) {
   
		// console.log("获取到所有线路数据dataList:" + dataList.length);
		for (var i = dataList.length - 1; i >= 0; i--) {
   
			var metroName = dataList[i].metroName;
			var metroBranch = dataList[i].m
  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值