Git Product home page Git Product logo

the-subway-of-china's Introduction

the-subway-of-china

**地铁图

项目介绍

**地铁图,支持PC、移动端多种浏览器。覆盖北上广多个城市。

  • 技术点

    1. svg绘制
    2. 调用svg-pan-zoom.js以及hammer.js缩放
    3. gulp文件打包
  • 数据来源

    1. 百度地图

项目运行

  • 环境依赖

    1. node v6.10.2
  • 部署步骤

    1. npm install //安装node运行环境
    2. gulp //前端编译

目录结构描述

├── Readme.md                   //help
├── dest                        //发布包
│   ├── css
│   ├── js                
│   └── *.html        
├── libs                        //第三方文件
├── node_modules                  
├── rev                         //静态版本json
├── src                         //开发包
└── gulpfile.js

页面预览

更新记录

2018.7.17

    -  first-init 新增gitHub预览设置 

2018.7.23

    -  gulp打包上线

2018.7.24

    -  解决cnpm install 后node_modules包无法push,改用npm install
    -  更改依赖配置,新增版本号?v=
    -  新增gulp-sourcemaps地图

2018.7.30

    -  indexOf()==-1替换为includes():返回布尔值,表示是否找到了参数字符串。

2018.12.06

    -  修复香港地区地铁图无法显示问题
    -  字体类型Helvetica, Arial, sans-serif-->黑体
    -  标签替换ellipse-->circle 
    -  样式stroke-width调整: path 4 --> 5 ; cicle 2.5 --> 1

项目总结

  • 1.stroke color -->加“#”
  • 2.svg image标签路径赋值 -->image[0].href.baseVal = ;
  • 3.pc微信内置浏览器不显示-->es6兼容
  • 4.中转站存在text内容及image相同重叠问题 -->repeatStr.includs(uid)

the-subway-of-china's People

Contributors

stavinli avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.