地图来源 百度地图开放平台 API文档
※ 代码中使用的百度开放平台的 ak 来自百度MapV的demo
想要了解和下载更多关于 标准地图 的内容,欢迎访问中国地图出版集团官网和中国地图出版集团官方微博

文章目录

  • 效果展示
  • 代码分释
  • 全部代码

效果展示


代码分释

整体思路
利用百度地图的JavaScript API GL,设置底层地图层。封装Text.js,直接在地图层之上生成新的canvas,并使用createjs对其进行绘制和控制。

0 百度地图api层

let map = new BMapGL.Map('map_container', {restrictCenter: false,style: { styleJson: purpleStyle }})
let point = new BMapGL.Point(100.59465018721109, 32.45322588943924)map.centerAndZoom(point, 6)
map.setTilt(45)
map.setHeading(-15)

设置了地图中心经纬度、地图比例、视角和样式等数据

1 构建 createjscanvas

// Text.js
(function () {let text, stage, anglelet canvas = document.createElement('canvas')canvas.id = 'examCanvas'canvas.style.position = 'absolute'canvas.style.zIndex = 10canvas.style.pointerEvents = 'none'function init() {angle = 0canvas.width = window.innerWidthcanvas.height = window.innerHeightwindow.onresize = function () {canvas.width = window.innerWidthcanvas.height = window.innerHeighttext.set({ x: canvas.width / 2, y: canvas.height / 2 - text.getMeasuredLineHeight() })stage.update()}document.querySelector('#map_container').insertBefore(canvas, document.querySelector('canvas'))stage = new createjs.Stage(canvas);text = new createjs.Text('新春快乐,												

新春快乐,牛年大吉!相关推荐

  1. FPGA工程师版 | 新春快乐,牛年大吉!

    祝大家新春快乐,牛年大吉!

  2. @所有粉丝,祝大家新春快乐!

    祝大家新春快乐!

  3. 第四范式恭祝大家新春快乐!

    智焕新机 如虎添翼 龙腾虎跃 式在必行 第四范式恭祝大家虎年 虎虎生风 心想式成 祝大家新春快乐!

  4. OpenKG 祝大家新春快乐

    OpenKG 祝各位读者 新春快乐,虎虎生威! OpenKG OpenKG(中文开放知识图谱)旨在推动以中文为核心的知识图谱数据的开放.互联及众包,并促进知识图谱算法.工具及平台的开源开放. 点击阅读 ...

  5. 比尔·盖茨录视频祝大家“新春快乐

    1月24日消息,盖茨基金会的官微发布视频,视频中比尔·盖茨祝福所有中国人"新春快乐".可以看到,视频背景中有两只可爱的红色布老虎,非常喜庆. 比尔·盖茨表示:"尽管过去一 ...

  6. 早安!新春快乐!兔年大吉!

    正月初一,在这个阖家团圆的日子里,小爱祝大家兔年吉祥,新春快乐! 新的一年里事业大展宏图,事业有成,事事顺心.

  7. 祝大家新春快乐,阖家安康

    年少时,我们期待远方,迫不及待一步一步离开家. 可看过千万风景才懂得,世界最美的风景,都不及回家的路. 因为,路的那头,是我们的亲人,还有我们渴望的爱和温暖. 风尘仆仆,终有归途. 祝大家新春快乐,阖 ...

  8. AI红包皮速领,人类现金速抽|祝大家新春快乐

    「越往后读,越有惊喜」 △ 图片由百度一格AI生成 兔年新春来临,祝福声声送到. 这个特殊的时刻,我们不仅要祝福自己和家人幸福健康,更要祝福我们的读者们,愿你们在新的一年里,事事顺心,鸿运当头,财源广 ...

  9. 集牛气 展虎威 | 指令集祝您新春快乐,虎年大吉!

    2021即将过去,这个牛年,我们在物联网的"麦田里"辛勤耕作,集聚牛气: 2022即将到来,这个虎年,我们必将大展虎威,向着构建一个"一HU百应"的物联网生态的 ...

最新文章

  1. c语言函数参数类型检查,内联函数在编译时是否做参数类型检查?
  2. 多重背包单调队列优化思路_多重背包之单调队列优化理论性总结
  3. 实时计算pv/uv Demo演示
  4. 乐高计算机发展史教程,【乐高产品发展史特别篇】乐高恐龙发展史
  5. 计算机类产品评价技术指标体系研究之图形(像)篇
  6. 550什么意思_研报翻译官第二期:带你了解什么是CPI
  7. 我的 11 年编程生涯
  8. 13 大论坛同开播!数百专家带你从机器学习技术与工程实践,聊到开源生态 | AI ProCon 2020...
  9. OneNote for win10 出现0xE000078B错误
  10. Vim编辑器基本操作
  11. 邮箱发信量到达上限,发不出邮件,你知道该怎么办吗?
  12. 2021-09-02
  13. 惠州市城市职业学院计算机考点,2020广东乡镇惠州考区笔试考点地理位置及考场安排表...
  14. 软件规模估算常用的5种方法及实用工具。
  15. excel离散度图表怎么算_excel离散数据表格-Excel 离散程度分析图表如何做
  16. maxcompute-入门-环境安装
  17. 九宫格解锁Android代码
  18. STM32CUBEIDE使用盗版jlink仿真器
  19. 2022年全球与中国微型光谱仪市场现状及未来发展趋势
  20. 中国人民大学与加拿大女王大学金融硕士——在职读研该如何平衡学习与工作呢

热门文章

  1. unicode码转换成中文
  2. 胡图图想学c语言5之考点
  3. adapter 获取每个posion位置推荐,记录RecycleView
  4. php 文件防盗链代码,php防盗链几种代码_PHP教程
  5. 常见非Unicode编码
  6. openwrt 版本编译
  7. 贝叶斯公式的对数似然函数_最大似然估计和贝叶斯估计学习体会
  8. MySql之length函数
  9. 发布离线地图的多个方法
  10. 计算机毕业设计ssm哈尔滨市合欢婚庆公司管理588fz系统+程序+源码+lw+远程部署