起点到终点?web地图?我来告诉你!

小伙伴们,做外卖项目的小伙伴,有没有遇到过,web端显示配送路线的小问题呢?今天思梦PHP就给大家带来高德地图,从添加起点到录入终点,做了一个指示路线的小功能!

首先第一步你要去高德或者百度的地图的官网去申请开发者账号,然后创建一个key,当然这里小伙伴要注意的是,高德和百度的经纬度的加密方式不同的,你在程序里面要使用相同的地图开发平台,当然你也可以去转换他们之间的误差,这里就不详细解释了!

第二步就是开始去整合了!代码呈上:

这些js引入代码小伙伴们一定不要忘记~

以上就是怎么获取经纬度的问题,下面就开始告诉大家怎么显示在web上出现下面的效果

首先呢我们通过一个url去获取经纬度

获取经纬度然后传给前台以供前台调用展示:

同样也要引入高德的一些必备的样式和js

然后呢通过js获取之后赋值给高德的js

这样就结束了,路线规划也就显示了!

效果呢是这样的:

原文发布于微信公众号 - 思梦PHP(sm_php)

原文发表时间:2016-12-24

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏互联网开发者交流社区

SEO-发信息注意的问题

1123
来自专栏Crossin的编程教室

3分钟破译朋友圈测试小游戏

最近,朋友圈时不时会流行起某个测试类小游戏,比如你的性格图谱啦,你是三体中的哪个角色啦,你有什么超能力啦……昨天晚上在某个群里,又被一个测测你是什么书的小游戏刷...

3847
来自专栏微信小程序开发

小程序技术杂谈 手写签名DEMO

好久没写文章,小程序群内已经有群友反馈给我,希望我坚持写公众号文章。感谢这位群友 & 粉丝的支持!连胜老师最近确实变懒了,今天来说说群友们进期在群内讨论的几个问...

822
来自专栏程序员互动联盟

编程高手为啥都喜欢耍脚本?

脚本编程几乎在每一个平台上都存在,这是因为利用脚本常常会简化、加快很多批量处理的工作,它能实现很多传统编程语言的功能,但是对编写者却不需要关心什么编译器、解释器...

3145
来自专栏腾讯IVWEB团队的专栏

ESLint 可共享配置发布,团队自定义 ESLint 规则新鲜出炉

为了更好的统一团队的 JS 编程风格和代码质量。feflow 官方经过调研和探索,终于迎来了ESLint 的解决方案,最核心的理念是:基于 eslint:rec...

2560
来自专栏徐国立的专栏

初探 Google App Indexing

App Indexing 可帮助您的应用用户在其设备上查找公开和个人内容,甚至提供查询自动填充功能以帮助他们更快速地找到所需的内容,从而重新吸引这些用户的关注。

4830
来自专栏FreeBuf

当“宿主”披上QQ盗号的外衣

导读:生物学上病毒侵入的细胞就叫宿主细胞,而病毒则借助宿主的蛋白质和其他物质制造自己的身体,由于控制细胞增殖的结构基因发生突变,调节系统对它失去控制,结果就会造...

800
来自专栏张戈的专栏

利用artDialog给网站添加一个能显示搜索来路和关键词的欢迎框

最新消息:目前该功能已推出 WordPress 版和 ZBlog(PHP)版插件!详细介绍=> 导读 我们都知道,跳出率的高低和网站的粘性有着必然的关系,而对于...

3414
来自专栏北京马哥教育

保护你的Linux系统的九个老生常谈

在现在这个世道中,保障基于Linux的系统的安全是十分重要的。但是,你得知道怎么干。一个简单反恶意程序软件是远远不够的,你需要采取其它措施来协同工作。那么试试...

2616
来自专栏角落的白板报

【52ABP实战教程】0.2-- VSTS(Visual Studio Team Services)账户迁移到东亚(香港节点)

需求从哪里来! VSTS的全称是Visual Studio Team Services。 在上一篇的文章中已经给大家说了VSTS之前是没有香港节点。大家的访问...

2744

扫描关注云+社区