功能需求
博主做得是一个校园项目的校车管理模块，主要功能是uinapp地图上显示校车站点，运行轨迹的一些功能，大概的一些截图放在下面
遇到的问题及具体实现方法
1.首先就是uniapp怎么引入gis的地图了（最重要因为不同的地图拉取的gps数据会导致一些点位会偏差）
解决方法：由于我们gis在开发pc端的时候是用html引入的第三方地图的js,uniapp使用的map限定了高德百度，坐标系不一致而且不好二次开发不做考虑。接下来就是怎么通过uniapp引入第三方js。
先说一下自己踩到的坑，在uniapp文档框架-->配置-->h5下面有一个使用自定义模板的方法
官方描述是这样的：使用自定义模板时，1. 工程根目录下新建一个html文件；2. 复制下面的基本模板内容，到这个html文件，在此基础上修改meta和引入js；3. 在 manifest.json->h5->template
按照流程运行到chrom果然地图完美出现，但是运行到手机一片空白，原因就是浏览器的内核和手机不一样，手机上并不会走这个html文件
最后实现方法
通过uniapp的web-view组件实现
<web-view :webview-styles="webviewStyles" src="/hybrid/html/map.html"></web-view>
需要注意的是html文件只能在hybrid或者static文件目录下面
2.关于web-view组件层级的问题。
在运行到手机web-view会默认最高层级，官方文档也有4种解决方法，自己也尝试了subNVue的方法，效果不是十分好，而且由于地图上弹窗功能不少交互也比较多，也没再尝试其他方法，直接在html文件里进行页面弹窗交互逻辑开发。
3.关于html里面页面自适应的问题
由于uniapp使用的是rpx进行自适应的，在html文件里不再生效。就想着使用自定义变量的方试计算实现自定义document.documentElement.style.setProperty(--val, 750 / document.body.clientWidth);然后style标签里的样式都是以calc计算的方式来写
4.关于在html里面使用vue。
由于纯html很久没有写过了，项目要得比较急，就在html里面使用vue写的。主要方法是引入vue.js
<script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script>
在script标签
`
new Vue({
el: "#map",
data: {
},
methods: {}
})
`
map是最外层div的id,data也不需要return
5.移动端获取本地缓存
在html大多数uniapp的api也不能进行使用，但是使用web-view是可以使用h5+的api,调用接口使用的token需要从本地缓存拿取
let _this = this; document.addEventListener('plusready', () => { _this.userToken = plus.storage.getItem('token'); _this.baseUrl = plus.storage.getItem('baseUrl'); })