博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ueditor富文本编辑器使用百度地图自定义动态地图组件及兼容https及http协议
阅读量:6248 次
发布时间:2019-06-22

本文共 1205 字,大约阅读时间需要 4 分钟。

ueditor富文本编辑器默认支持百度地图组件,但是如果导入动态地图后会加很多默认的地图组件在上面。如果需要自定义动态地图的组件则需要修改ueditor特定的html。

ueditor百度地图组件所在目录

 

show.html文件中定义了地图的控件,有自定义需要的时候可以在这个文件中自己编辑

 

如果自己所在的环境中是https协议的话,那ueditor是不支持的,因为这两个文件中使用的是http协议的接口。所以为了满足http跟https协议的话最好将这两个文件下的map接口给为https下的接口,因为https协议下默认是不能请求http下的资源的。浏览器会自动BLOCK掉。

修改如下:

map.html中

修改前
修改后
修改前
// var zoom = map.zoomLevel;
// var point = marker.getPoint();
// var url = "http://api.map.baidu.com/staticimage?center=" + center.lng + ',' + center.lat + //         "&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat;
修改后
var point = marker.getPosition();
var zoom = map.getZoom();
var url = "https://api.map.baidu.com/staticimage?s=1&center=" + center.lng + ',' + center.lat +         "&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat;

  show.html中

修改前
修改后

  一句话概括就是把引入的http下的百度地图js修改为https下的。由于https下的百度地图组件与http下的使用方法不一样所以对应的使用代码也做相应的修改。至于网上找到有些大神说要在html文件加上来自动讲http的不安全请求升级为https

  个人测试发现可能加上会报如下错误,所以个人使用的时候未加这段代码。可能是因为本人测试的时候没有处于https环境下导致,所以如果为了使百度地图的修改适用于http及https都能使用所以没有加入上面的meta

转载于:https://www.cnblogs.com/walterfong/p/10255862.html

你可能感兴趣的文章
跟我一起学习ASP.NET 4.5 MVC4.0(六)
查看>>
CURL 命令行下载工具
查看>>
PMP 管理学6大定律之四(光环效应)
查看>>
ThinkPHP判断更新是否成功的正确方法
查看>>
Python时间处理
查看>>
【原创】 在django中使用celery 任务队列,redis做后端
查看>>
Python中下划线---完全解读 (转载),我认为是讲的最全面的了
查看>>
android网络编程——使用Android中的网络连接
查看>>
GitHub上拉取代码速度十分之慢
查看>>
PHP:6种GET和POST请求发送方法
查看>>
Smart2.0开发指南——入门
查看>>
java集合整体框架
查看>>
测试elasticsearch-5.1.2 API接口
查看>>
CAP理论
查看>>
程序员最喜欢的10 个HTML和CSS在线代码编辑器
查看>>
java 对象集合转换为树形对象集合
查看>>
handler优化,避免oom
查看>>
表单初试
查看>>
centos7 设置网卡IP 为自动获取
查看>>
CC430F6137 芯片上集成的外设寄存器地址<-->cc430f6137.cmd
查看>>