位置: 编程技术 - 正文

javascript html5 canvas实现可拖动省份的中国地图

编辑:rootadmin

推荐整理分享javascript html5 canvas实现可拖动省份的中国地图,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

本文实例分享了html5 canvas可拖动省份的中国地图实现方法,供大家参考,具体内容如下

1.数据获取画地图需要省份边界坐标,理论上可以每次都用百度API获取数据并绘图,但为了增加效率,首先将所有坐标都获取下来并存入数据库中。新建省份数据数组轮询该数组,根据省份名称请求百度API获取坐标数据,并将数据以ajax方式放松给php

php得到数据后,解析数据并将数据存储到事先建好的数据库中

javascript html5 canvas实现可拖动省份的中国地图

2.画地图(base地图画在mapCanvas层)轮询省份数组,并以ajax方式请求该省份边界坐标,然后绘图

3.画移动连线(连线和移动的省份画在moveMapCanvas层)当在地图上拖动省份时,出现若干条连接移动的省份和原省份的直线

4.事件鼠标按下事件:当点击到地图上时,要做的事是,判断点击位置,将位置信息转化成经纬度,再通过百度API根据经纬度获得省份名称。

鼠标移动事件:根据点击的省份名,获得数据,并实时重绘移动层的省份

鼠标抬起事件:设置dragging为false,clear移动层。

小结:功能、原理都很简单,但能熟悉canvas的一些属性和方法。canvas层是可以重叠到一起的,这样就可以在不同的层画不同的内容,方便维护和管理。

标签: javascript html5 canvas实现可拖动省份的中国地图

本文链接地址:https://www.jiuchutong.com/biancheng/377494.html 转载请保留说明!

上一篇:js仿百度登录页实现拖动窗口效果(仿百度首页html代码静态)

下一篇:JavaScript获取图片像素颜色并转换为box-shadow显示(js 获取图片大小)

  • 房地产开发企业土地增值税预缴
  • 服务型公司要交多少税
  • 一般纳税人企业所得税多久申报一次
  • 船舶吨税范围
  • 制造费用科目一定无余额
  • 固定资产出售净残值怎么处理
  • 无偿划拨资产的入账价值
  • 个人所得税申报错误如何更正申报
  • 销售不同税率的货物会计处理
  • 折扣折让的销售方式有哪些
  • 股票买卖属于投资活动吗
  • 小规模纳税人可以自己开专票吗
  • 公司增值税发票有限额吗
  • 附加税记入什么科目
  • 什么是税收编码,在哪里查
  • 小规模计提季度怎么算
  • 体育用品怎么才能买到
  • 递延所得税年初数和期末数
  • 销售单怎么设置打几行
  • 工会固定资金是什么
  • 免税企业进项怎么处理
  • 佣金可以开票吗
  • 解除劳动关系取公积金
  • 建筑公司合作模式有哪几种
  • 房地产企业个人所得税
  • 如何让电脑安全
  • 一般纳税人购进税控收款机抵扣
  • php \t
  • 车保险理赔的钱多久到账
  • laravel视频教程
  • 2023前端面试题csdn
  • 毕业设计-基于组态软件的流量比值过程控制系统设计
  • 企业所得税资产总额平均值怎么算
  • 营业外收入账务处理方法
  • 月末制造费用可以有余额吗
  • 未达起征点怎么填申报表
  • java自增自减运算符的规则
  • 织梦网站怎么添加关键词
  • 完美ui
  • MySQL常用命令关键字
  • 应收票据到期后账务处理
  • 盈余公积一定要计提吗
  • 仓库出入库账本怎么做
  • 医院累计折旧会计分录
  • 代购进口货物垫付方案
  • 公司账户钱取出来税务局会查账吗
  • 公司担保无效的后果
  • 其他流动资产待摊费用
  • 财务费用和应付利息都在借方
  • 电汇凭证有效期
  • 公司想自己开发票怎么申请
  • 会计行政法规包括哪些条例?具体说明?
  • 安装win7旗舰版鼠标无法使用
  • win10怎么给Windows Defender添加排除项?
  • windows桌面快捷方式怎么创建
  • win2008r2下载
  • ubuntu安装超详细教程
  • ghost安装器怎么用
  • 回收站清空文件怎么恢复?试试这三个方法找回!
  • linux如何拨号
  • win7系统安装教程不用u盘
  • 微软刷机怎么刷
  • win8使用技巧 图文
  • node操作mongodb数据库
  • JavaScript中的变量名不区分大小写
  • IE、FF、Chrome浏览器中的JS差异介绍
  • android采用什么软件架构?
  • net命令大全
  • linux进程监控方法
  • unity shader可视化编辑
  • vue微信分享功能
  • 安卓竖屏改横屏
  • android环境搭建实验报告
  • 工具类软件有哪些
  • selenium在pycharm
  • spring mvc jsp
  • thinkphp withjoin
  • 未按时缴纳税款是什么行为
  • 小微企业印花税的税率是多少
  • 长沙税务局几点上班下午
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设