云开发地图标记导航云开发一次性取所有数据

地图取 elx 表格的经纬度数据，存到云开发数据库里面，然后标记在地图上，点击地图的标记可以实现路线规划，导航，拨打电话。

elx数据格式如下：

云开发的数据库不能直接导入elx，所以需要转换为csv文件，转换地址

看图：

代码：

// map.js
var markers = []; //地图标记点
var callout = []; //地图标记点的气泡
var app = getApp()
Page({data: {marker_latitude: '',marker_longitude: '',},see(latitude,longitude,name,address) {console.log(latitude,longitude)latitude = Number(latitude)longitude = Number(longitude)wx.openLocation({latitude,longitude,name,address,scale: 14})},regionchange(e) {console.log('11111', e.type)},controltap(e) {console.log('3333', e.detail.controlId)},//选择位置chooseLocation: function (e) {console.log(e)var that = thiswx.chooseLocation({success: function (res) {console.log('reee',res)// successconsole.log(that.data.longitude, that.data.latitude, res.longitude, res.latitude)wx.openLocation({latitude:res.latitude,longitude:res.longitude,name:res.name,address:res.address,scale: 14})that.setData({// polyline: [{//   points: [{//     longitude: that.data.longitude,//     latitude: that.data.latitude//   }, {//     longitude: res.longitude,//     latitude: res.latitude//   }],//   color: "#FF0000DD",//   width: 2,//   dottedLine: true// }],})},fail: function () {// fail},complete: function () {// complete}})},markertap(e) {console.log('markertap', e.markerId)var that =thiswx.showActionSheet({itemList: ['路线规划导航', '拨打电话'],success(res) {console.log(res.tapIndex)if(res.tapIndex==0){that.see(that.data.markers[e.markerId].latitude,that.data.markers[e.markerId].longitude,that.data.listData[e.markerId].name,that.data.listData[e.markerId].locName)}else{var phoneNumber =String(that.data.listData[e.markerId].phone)console.log('that.data.listData[e.markerId].phone',phoneNumber)wx.makePhoneCall({phoneNumber: phoneNumber})}},fail(res) {console.log(res.errMsg)}})},onLoad() {var that = this;const DB = wx.cloud.database()wx.getLocation({type: 'wgs84',success: function (res) {var latitude = res.latitudevar longitude = res.longitudethat.setData({latitude: latitude,longitude: longitude})}})wx.cloud.callFunction({name: 'test', // 对应云函数名data: {},success: res => {console.log('----', res.result.data)var listData = res.result.data;that.setData({listData,// latitude: listData[0].locNum.split(',')[0],// longitude: listData[0].locNum.split(',')[1]})for (var i = 0; i < listData.length; i++) {markers = markers.concat({iconPath: "../../images/loc.png",id: i,// callout: {//   content: listData[i].name,//   fontSize: '12',//   padding: true,//   color: '#444',//   display: 'ALWAYS',//   textAlign: 'center',//   borderRadius: 5// },latitude: listData[i].locNum.split(',')[0],longitude: listData[i].locNum.split(',')[1],width: 18,height: 20});}console.log(markers)that.setData({markers: markers})},fail: res => {console.log('----2', res)}})},onShow() {},
})

<!--pages/map/map.wxml--><!-- 103.995255,30.588652 -->
<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="14" show-location controls="{{controls}}" markers="{{markers}}" polyline="{{polyline}}" bindmarkertap="markertap" style="width: 100%; height: 100%;"></map>
<!-- <button class="btn1" catchtap="chooseLocation">查找位置</button> -->
<!-- <button class="btn2" catchtap="see">路线规划导航</button> -->

/* pages/map/map.wxss */
page{height: 100%;width: 100%;
}
button{position: absolute;bottom: 0;left: 0;right: 0;width: 100%;z-index: 999;text-align: center;background-color: aliceblue;
}

云函数实现代码：

const cloud = require('wx-server-sdk')
cloud.init({env: cloud.DYNAMIC_CURRENT_ENV
})
const db = cloud.database()
const MAX_LIMIT = 100
exports.main = async (event, context) => {// 先取出集合记录总数const countResult = await db.collection('map').count()const total = countResult.total// 计算需分几次取const batchTimes = Math.ceil(total / 100)// 承载所有读操作的 promise 的数组const tasks = []for (let i = 0; i < batchTimes; i++) {const promise = db.collection('map').skip(i * MAX_LIMIT).limit(MAX_LIMIT).get()tasks.push(promise)}// 等待所有return (await Promise.all(tasks)).reduce((acc, cur) => {return {data: acc.data.concat(cur.data),errMsg: acc.errMsg,}})
}

云开发地图标记导航云开发一次性取所有数据相关推荐

【小程序源码】uni-app云开发的网盘助手抓取网盘资源
这是一款uni-app开发的一款网盘小助手小程序源码安装教程: 我们首先使用HBuilderx导入您的源码,然后点击manifest.json基础配置然后重新获取一下uni-app应用标识然后我们 ...
手把手带你开发一款云开发版点餐小程序，微信扫码点餐，店铺地图导航，外卖小程序，用户端和后厨端都有
从今天开始带领大家实现一款云开发版的点餐小程序视频讲解:<云开发后台+微信扫码点餐小程序+cms网页管理后台> 技术选型 1,前端微信小程序原生框架 css JavaScript 2, ...
腾讯发布 Tencent SCF Toolkit VS Code 插件，轻松开发无服务器云函数
在之前的文章中,我们提到了亚马逊.谷歌.IBM 等大厂都上了 Visual Studio Code 的船.阿里巴巴也在近日发布了 Aliyun Serverless VS Code 插件. 近期,腾讯 ...
自动驾驶轻松开发？华为云ModelArts赋能智慧出行
作为战略新兴产业,人工智能已经开始广泛应用于多个领域.近几年,科技公司.互联网公司等各领域的企业纷纷布局自动驾驶.那么,自动驾驶技术究竟发展得如何了?日前,华为云携手上海交通大学创新中心举办的华为云人 ...
本科阶段就挑战自动驾驶开发？华为云ModelArts帮你轻松实现！
欢迎添加华为云小助手微信(微信号:HWCloud002 或 HWCloud003),输入关键字"加群",加入华为云线上技术讨论群:输入关键字"最新活动",获取华 ...
lisp 线性标注自动避让_本科阶段就挑战自动驾驶开发？华为云ModelArts说Yes！
作为战略新兴产业,人工智能已经开始广泛应用于多个领域.近几年,科技公司.互联网公司等各领域的企业纷纷布局自动驾驶.那么,自动驾驶技术究竟发展得如何了?日前,华为云携手上海交通大学创新中心举办的华为云人 ...
【云原生】AI云开发平台——AI Model Foundry介绍(开发者可免费体验AI训练模型)
"本文主要介绍了华为云原生开发GDE AI 下的AI Model Foundry模块, 华为云为开发者提供了丰富的云原生免费体验平台,并发布了众多云原生开发教程,有助于云原生开发者深入学习云 ...
聊聊如何在华为云IoT平台进行产品开发
本文分享自华为云社区<如何基于华为云IoT物联网平台进行产品开发>,作者: Super.雯 . 华为云物联网平台承载着南北向数据互通的功能职责.在华为云物联网平台基础上实现端到端物联网业务 ...
【每日新闻】企业微信与微信消息互通正式开放内测 | IBM宣布针对云原生应用推出Microclimate开发平台
每一个企业级的人都置顶了中国软件网中国软件网为你带来最新鲜的行业干货小编点评我们希望邀请更多的生态伙伴共同探讨共同行动 2018年4与人25日北京站,不见不散! 趋势洞察生态视 ...

云开发地图标记导航云开发一次性取所有数据

云开发地图标记导航云开发一次性取所有数据相关推荐

最新文章

热门文章

云开发地图标记导航 云开发一次性取所有数据

云开发地图标记导航 云开发一次性取所有数据相关推荐

最新文章

热门文章

云开发地图标记导航云开发一次性取所有数据

云开发地图标记导航云开发一次性取所有数据相关推荐