更新：

18-9-21：填了个坑，更新了canvas绘制过程。

根据的是百度提供的坐标，canvas的坐标是大的坐标在后面，所以跟实际生活方向相反。
所以canvas里的北方在下方，实际生活中北方在上方。

因为根据的是真实坐标，所以跟广州地铁提供的地图不一样。

左侧地图一种写法，右侧地图另一种写法。

左侧可以下拉菜单选择线路查看路线，还可以查询站名属于哪个路线；右侧是全地图。

暂时没有其他功能……欢迎指点。

看代码可以戳链接：https://github.com/littleHiuman/GZsubway-canvas

可以戳相册地址看高清图：http://hiuman.iteye.com/picture/136749

附上超级大图……：

canvas写的地铁地图的更多相关文章

  1. 用Canvas写桌球游戏！！！

    声明:本文为原创文章,如需转载,请注明来源WAxes,谢谢! 昨天上班的时候闲着无事,就用Canvas写了个桌球游戏来玩玩....所以就拿这游戏上来水一发.或许对一些刚学canvas的人有帮助. 话说 ...

  2. canvas写的一个小时钟demo

    <!DOCTYPE html> <html> <head> <title>HTML5 Canvas Demo of clock</title> ...

  3. 用Canvas写一个简单的游戏--别踩白块儿

    第一次写博客也不知怎么写,反正就按照我自己的想法来吧!怎么说呢?还是不要扯那些多余的话了,直接上正题吧! 第一次用canvas写游戏,所以挑个简单实现点的来干:别踩白块儿,其他那些怎么操作的那些就不用 ...

  4. 简单的运动学，用canvas写弹力球

    声明:本文为原创文章,如需转载,请注明来源WAxes,谢谢! 跟之前的随笔一样,因为本人仍是菜鸟一只,所以用到的技术比较简单,不适合大神观看...... 学canvas学了有一个多礼拜了,觉得canv ...

  5. 原生canvas写的飞机游戏

    一个原生canvas写的飞机游戏,实用性不大,主要用于熟悉canvas的一些熟悉用法. 项目地址:https://github.com/BothEyes1993/canvas_game

  6. 封装构造函数，用canvas写饼状图和柱状图

    封装构造函数,用canvas写饼状图和柱状图 封装函数 // 场景 function XDLScence( options ) { this.stage = options.stage; //执行场景 ...

  7. 利用canvas写一个验证码小功能

    刚刚开始接触canvas,写个验证码小功能练练手,实现效果图如下: 主要代码如下: html <!DOCTYPE html> <html lang="en"> ...

  8. 基于 HTML5 Canvas 的交互式地铁线路图

    前言 前两天在 echarts 上寻找灵感的时候,看到了很多有关地图类似的例子,地图定位等等,但是好像就是没有地铁线路图,就自己花了一些时间捣鼓出来了这个交互式地铁线路图的 Demo,地铁线路上的点是 ...

  9. 用Canvas写一个炫酷的时间更新动画玩玩

    正文必须要写点什么...   // '; var WINDOW_WIDTH = 913; var WINDOW_HEIGHT = 400; var RADIUS = 7; //球半径 var NUMB ...

随机推荐

  1. ARC077D 11 组合数

    ---题面--- 题解: 做这道题的时候zz了,,,, 写了个很复杂的式子,然而后面重新想就发现很简单了. 考虑用总的情况减去重复的. 假设唯一重复的两个数的位置分别是l和r,那么唯一会导致重复的方案 ...

  2. BZOJ3165 & 洛谷4097：[HEOI2013]Segment——题解

    https://www.lydsy.com/JudgeOnline/problem.php?id=3165 https://www.luogu.org/problemnew/show/P4097 要求 ...

  3. [BZOJ1131/POI2008]Sta树的深度

    Description 给出一个N个点的树,找出一个点来,以这个点为根的树时,所有点的深度之和最大 Input 给出一个数字N,代表有N个点.N<=1000000 下面N-1条边. Output ...

  4. POI 2018.10.20

    [POI2005]BANK-Cash Dispenser 有多少个4位字符串是所有操作序列的子串. 10^4枚举字符串.暴力判断会TLE 发现,我们就是在每个操作序列中不断找第一个出现的c字符. 预处 ...

  5. 【DP】【Uva437】UVA437 The Tower of Babylon

    传送门 Description Input Output Sample Input Sample Output Case : maximum height = Case : maximum heigh ...

  6. vim 打开中文乱码

    [root@yu ~]# find / -name vimrc/etc/vimrc [root@yu ~]# vim /etc/vimrc set fileencodings=utf-8,gb2312 ...

  7. Leetcode 94. 二叉树的中序遍历

    1.问题描述 给定一个二叉树,返回它的中序 遍历. 示例: 输入: [1,null,2,3] 1 \ 2 / 3 输出: [1,3,2] 进阶: 递归算法很简单,你可以通过迭代算法完成吗? 2.解法一 ...

  8. 深度解析Java多线程的内存模型

    内部java内存模型 硬件层面的内存模型 Java内存模型和硬件内存模型的联系 共享对象的可见性 资源竞速 Java内存模型很好的说明了JVM是如何在内存里工作的,JVM可以理解为java执行的一个操 ...

  9. 杭电多校第八场-A-Character Encoding

    题目描述 In computer science, a character is a letter, a digit, a punctuation mark or some other similar ...

  10. 安装在Linux下的jenkins执行windows下的bat命令

    launch method里面没有 launch agent via java web start 默认是disable 需要改成random 转载自: http://blog.csdn.net/so ...