https://github.com/stavinli/beijingsubway
北京地铁图
https://github.com/stavinli/beijingsubway
Last synced: about 1 year ago
JSON representation
北京地铁图
- Host: GitHub
- URL: https://github.com/stavinli/beijingsubway
- Owner: StavinLi
- License: mit
- Created: 2018-12-06T11:18:28.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T19:07:46.000Z (over 3 years ago)
- Last Synced: 2023-03-05T13:13:45.396Z (over 3 years ago)
- Language: JavaScript
- Size: 590 KB
- Stars: 28
- Watchers: 1
- Forks: 12
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
### 北京地铁图
北京地铁图，基于svg开发，支持PC、移动端多种浏览器。
- [线上开源地址 https://github.com/StavinLi/beiJingSubway](https://github.com/StavinLi/beiJingSubway) 点个赞吧！
- [项目预览 暂时无法]
-------------------
#### 项目介绍
- 技术点
1.`node`代理请求`https://map.bjsubway.com/`数据
```
app.use('/', proxy({
target: 'https://map.bjsubway.com/',
pathRewrite: {
'^/apis': '' // 重写请求，比如我们源访问的是api/old-path，那么请求会被解析为/api/new-path
},
changeOrigin: true
}));
```
2.请求结果`XML`格式解析
```
$.ajax({
url: "/apis/subwaymap/beijing.xml",
dataType: 'xml',
type: 'GET',
timeout: 5000,
success: function(data) {
var ls = $(data).find("sw").children()
...
})
});
```
3.gulp构建工具，文件打包
```
//监控文件变化
gulp.task('watch', function() {
gulp.watch(["src/css/*.css", "src/js/*.js"], ['default']);
});
gulp.task('default', function(cb) {
runSequence('other', ['css', 'js'], 'html')(cb);
})
```
- 数据来源--北京地铁官网
#### 项目安装
> git clone https://github.com/StavinLi/beiJingSubway.git
#### 项目运行
> 1.环境依赖 `npm i`
> 2.本地运行 `npm run start`
> 3.打包运行 `npm run build`
#### 目录结构描述
```
├── Readme.md //help
├── dest //发布包
│ ├── css
│ ├── js
│ └── *.html
├── libs //第三方文件
├── node_modules
├── rev //静态版本json
├── src //开发包
└── gulpfile.js
```
#### 更新记录
##### 2018.12.06
```
- init commit
```
##### 2018.12.07
```
- node 跨求请求xml
- 跨域 pathRewrite
```
##### 2018.12.10
```
- require("open") 本地运行打开新窗口
- 西二旗坐标空格导致移动端显示错误
```
##### 2018.12.19
```
- 新增站点hover 信息
```
##### 2018.12.20
```
- 新增自定义线路
- 修复少换乘切换相同换乘次数时，未综合考虑时间因素
- 新增耗时、途径、换乘、票价
```
##### 2018.12.21
```
- 新增起止点转换
```
##### 2019.9.6
```
- node 新增 设置证书免校验
```
#### 总结注意
> 1.line 标签西二旗属性 `lb="西二旗" x="757 "` 其中x属性中空格在移动端造成坐标失效，解决办法： ` $(this).attr("x")*1`