做招聘网站还有法盈利吗,爱奇艺的网站是用什么做的,嘉兴seo报价,外链官网uni.createMapContext(mapId,this)
创建并返回 map 上下文 mapContext 对象。在自定义组件下#xff0c;第二个参数传入组件实例this#xff0c;以操作组件内 map 组件。
注意#xff1a;uni.createMapContext(mapId, this)
app-nvue 平台 2.2.5 支持 uni.create…uni.createMapContext(mapId,this)
创建并返回 map 上下文 mapContext 对象。在自定义组件下第二个参数传入组件实例this以操作组件内 map 组件。
注意uni.createMapContext(mapId, this)
app-nvue 平台 2.2.5 支持 uni.createMapContext(mapId, this)app-nvue 平台 2.2.5- 需要同时设置组件属性id和ref map idmap1 refmap1/map或者直接使用 ref例如 this.$refs.map1
平台差异说明
AppH5微信小程序支付宝小程序百度小程序抖音小程序、飞书小程序QQ小程序快手小程序京东小程序√√√√√√1.9.0√√
#mapContext
mapContext 通过 mapId 跟一个 map 组件绑定通过它可以操作对应的 map 组件。
mapContext 对象的方法列表
方法参数说明平台差异说明getCenterLocationOBJECT获取当前地图中心的经纬度返回的是 gcj02 坐标系可以用于 uni.openLocationmoveToLocationOBJECT将地图中心移动到当前定位点需要配合map组件的show-location使用translateMarkerOBJECT平移marker带动画app-nvue 2.1.5、微信小程序带动画、抖音、支付宝、京东、百度、QQ小程序includePointsOBJECT缩放视野展示所有经纬度app-nvue 2.1.5、微信、抖音、支付宝、京东、百度、快手、QQ小程序getRegionOBJECT获取当前地图的视野范围getRotateOBJECT获取当前地图的旋转角微信、抖音、支付宝、京东、QQ小程序getScaleOBJECT获取当前地图的缩放级别getSkewOBJECT获取当前地图的倾斜角微信、抖音、支付宝、京东、QQ小程序addCustomLayerOBJECT添加个性化图层微信小程序addGroundOverlayOBJECT创建自定义图片图层图片会随着地图缩放而缩放App-nvue 3.1.0微信、抖音小程序addMarkersOBJECT添加 markerApp-nvue 3.1.0微信小程序fromScreenLocationOBJECT获取屏幕上的点对应的经纬度坐标原点为地图左上角微信小程序initMarkerClusterOBJECT初始化点聚合的配置未调用时采用默认配置App-nvue 3.1.0微信小程序moveAlongOBJECT沿指定路径移动 marker用于轨迹回放等场景。动画完成时触发回调事件若动画进行中对同一 marker 再次调用 moveAlong 方法前一次的动画将被打断。支持 android不支持 autoRotate 属性设置默认为 tureApp-nvue 3.1.0微信、抖音小程序openMapAppOBJECT拉起地图APP选择导航。App-nvue 3.1.0微信、抖音、快手小程序removeCustomLayerOBJECT移除个性化图层微信小程序removeGroundOverlayOBJECT移除自定义图片图层App-nvue 3.1.0微信小程序removeMarkersOBJECT移除 marker。App-nvue 3.1.0微信小程序setCenterOffsetOBJECT设置地图中心点偏移向后向下为增长屏幕比例范围(0.25~0.75)默认偏移为[0.5, 0.5]微信、抖音小程序toScreenLocationOBJECT获取经纬度对应的屏幕坐标坐标原点为地图左上角。微信小程序updateGroundOverlayOBJECT更新自定义图片图层。App-nvue 3.1.0微信、抖音小程序onMethod监听地图事件。App-nvue 3.1.0微信小程序$getAppMap获取原生地图对象 plus.maps.MapApp-nvue 1.9.3
$getAppMap() 注意事项
在页面中必须在 onReady 中调用。在组件中必须在 mounted 中调用。nvue没有$getAppMap()请使用createMapContextuni-app中使用原生地图无需提供占位div得到$getAppMap()后直接js使用即可。openMapApp iOS 暂不支持后续补充
getCenterLocation 的 OBJECT 参数列表
参数类型必填说明successFunction否接口调用成功的回调函数 res { longitude: 经度, latitude: 纬度}failFunction否接口调用失败的回调函数completeFunction否接口调用结束的回调函数调用成功、失败都会执行
moveToLocation 的 OBJECT 参数列表
参数类型必填说明longitudeNumber否经度 App 2.6.8、H5、京东小程序、仅微信小程序 2.8.0 支持latitudeNumber否纬度 App 2.6.8、H5、京东小程序、仅微信小程序 2.8.0 支持successFunction否接口调用成功的回调函数 res { longitude: 经度, latitude: 纬度}failFunction否接口调用失败的回调函数completeFunction否接口调用结束的回调函数调用成功、失败都会执行
translateMarker 的 OBJECT 参数列表
参数类型必填说明markerIdNumber是指定 markerdestinationObject是指定 marker 移动到的目标点autoRotateBoolean是移动过程中是否自动旋转 markerrotateNumber是marker 的旋转角度moveWithRotateBoolean否平移和旋转同时进行默认值false仅微信小程序2.13.0支持durationNumber否动画持续时长默认值1000ms平移与旋转分别计算animationEndFunction否动画结束回调函数successFunction否接口调用成功的回调函数failFunction否接口调用失败的回调函数completeFunction否接口调用结束的回调函数调用成功、失败都会执行
includePoints 的 OBJECT 参数列表
参数类型必填说明pointsArray是要显示在可视区域内的坐标点列表[{latitude, longitude}]paddingArray否坐标点形成的矩形边缘到地图边缘的距离单位像素。格式为[上右下左]安卓上只能识别数组第一项上下左右的padding一致。开发者工具暂不支持padding参数。successFunction否接口调用成功的回调函数支付宝小程序不支持failFunction否接口调用失败的回调函数支付宝小程序不支持completeFunction否接口调用结束的回调函数调用成功、失败都会执行支付宝小程序不支持
getRegion 的 OBJECT 参数列表
参数类型必填说明successFunction否接口调用成功的回调函数res {southwest, northeast}西南角与东北角的经纬度failFunction否接口调用失败的回调函数支付宝小程序不支持completeFunction否接口调用结束的回调函数调用成功、失败都会执行支付宝小程序不支持
getRotate 的 OBJECT 参数列表
参数类型必填说明successFunction否接口调用成功的回调函数res {rotate}旋转角failFunction否接口调用失败的回调函数支付宝小程序不支持completeFunction否接口调用结束的回调函数调用成功、失败都会执行支付宝小程序不支持
getScale 的 OBJECT 参数列表
参数类型必填说明successFunction否接口调用成功的回调函数res {scale}缩放值failFunction否接口调用失败的回调函数支付宝小程序不支持completeFunction否接口调用结束的回调函数调用成功、失败都会执行支付宝小程序不支持
getSkew 的 OBJECT 参数列表
参数类型必填说明successFunction否接口调用成功的回调函数res {skew}倾斜角failFunction否接口调用失败的回调函数支付宝小程序不支持completeFunction否接口调用结束的回调函数调用成功、失败都会执行支付宝小程序不支持
addCustomLayer 的 OBJECT 参数列表
属性类型默认值必填说明layerIdstring是个性化图层idsuccessfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
addGroundOverlay 的 OBJECT 参数列表
属性类型默认值必填说明idString是图片图层 idsrcString是图片路径支持网络图片、临时路径、代码包路径boundsObject是图片覆盖的经纬度范围visibleBooleantrue否是否可见zIndexNumber1否图层绘制顺序opacityNumber1否图层透明度successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
object.bounds 的结构
属性类型默认值必填说明southwestObject是西南角经纬度northeastObject是东北角经纬度
southwest 的结构
属性类型默认值必填说明longitudenumber是经度latitudenumber是纬度
northeast 的结构
属性类型默认值必填说明longitudenumber是经度latitudenumber是纬度
addMarkers 的 OBJECT 参数列表
属性类型默认值必填说明markersArray是同传入 map 组件的 marker 属性clearbooleanfalse否是否先清空地图上所有 markersuccessfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
removeMarkers 的 OBJECT 参数列表
属性类型默认值必填说明markerIdsArray是要被删除的marker的id属性组成的数组successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
moveAlong 的 OBJECT 参数列表
属性类型默认值必填说明markerIdNumber是指定 markerpathArray是移动路径的坐标串坐标点格式 {longitude, latitude}autoRotatebooleantrue否根据路径方向自动改变 marker 的旋转角度durationnumber是平滑移动的时间successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
openMapApp 的 OBJECT 参数列表
属性类型默认值必填说明longitudeNumber是目的地经度latitudeNumber是目的地纬度destinationString是目的地名称successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
setLocMarkerIcon 的 OBJECT 参数列表setLocMarkerIcon
属性类型默认值必填说明iconPathstring否图标路径支持网络路径、本地路径、代码包路径successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
App nvue 3.6.9 支持
mapContext App平台地图服务商差异
属性说明高德是否支持google地图是否支持setLocMarkerIcon设置定位点图标支持网络路径、本地路径、代码包路径已支持不支持moveAlong沿指定路径移动 marker用于轨迹回放等场景已支持(不支持autoRotate属性)已支持addCustomLayer添加个性化图层不支持不支持removeVisualLayer移除可视化图层不支持不支持fromScreenLocation获取屏幕上的点对应的经纬度坐标原点为地图左上角不支持不支持removeCustomLayer移除个性化图层不支持不支持setCenterOffset设置地图中心点偏移向后向下为增长屏幕比例范围(0.25~0.75)不支持不支持toScreenLocation获取经纬度对应的屏幕坐标坐标原点为地图左上角。不支持不支持
MapContext.on() (app-nvue、微信小程序支持)
markerClusterCreate 缩放或拖动导致新的聚合簇产生时触发仅返回新创建的聚合簇信息。
返回参数
参数类型说明clustersArraylt;ClusterInfogt;聚合簇数据
markerClusterClick 聚合簇的点击事件。
返回参数
参数类型说明clusterClusterInfo聚合簇
ClusterInfo 结构
参数类型说明clusterIdNumber聚合簇的 idcenterLatLng聚合簇的坐标markerIdsArraylt;Numbergt;该聚合簇内的点标记数据数组
initMarkerCluster(OBJECT) 结构
属性类型默认值必填说明enableDefaultStylebooleantrue否启用默认的聚合样式zoomOnClickbooleantrue否点击已经聚合的标记点时是否实现聚合分离gridSizeboolean60否聚合算法的可聚合距离即距离小于该值的点会聚合至一起以像素为单位successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数调用成功、失败都会执行
示例代码 MapContext.on(markerClusterCreate, (res) {})MapContext.on(markerClusterClick, (res) {})复制代码
地图聚合 API 示例(nvue)
缩小地图可看到多个 marker 合并为 1 个并显示聚合数量放大地图后恢复
templateview classcontentmap idmap classmap :show-locationtrue :latitudelatitude :longitudelongitude/map/view
/templatescriptconst img /static/logo.png;export default {data() {return {latitude: 23.099994,longitude: 113.324520,}},onReady() {this._mapContext uni.createMapContext(map, this);// 仅调用初始化才会触发 on.(markerClusterCreate, (e) {})this._mapContext.initMarkerCluster({enableDefaultStyle: false,zoomOnClick: true,gridSize: 60,complete(res) {console.log(initMarkerCluster, res)}});this._mapContext.on(markerClusterCreate, (e) {console.log(markerClusterCreate, e);});this.addMarkers();},methods: {addMarkers() {const positions [{latitude: 23.099994,longitude: 113.324520,}, {latitude: 23.099994,longitude: 113.322520,}, {latitude: 23.099994,longitude: 113.326520,}, {latitude: 23.096994,longitude: 113.329520,}]const markers []positions.forEach((p, i) {console.log(i)markers.push(Object.assign({},{id: i 1,iconPath: img,width: 50,height: 50,joinCluster: true, // 指定了该参数才会参与聚合label: {width: 50,height: 30,borderWidth: 1,borderRadius: 10,bgColor: #ffffff,content: label ${i 1}}},p))})this._mapContext.addMarkers({markers,clear: false,complete(res) {console.log(addMarkers, res)}})}}}
/scriptstyle.content {flex: 1;}.map {flex: 1;}
/style复制代码
#mapSearch 模块(仅app-nvue支持Google地图不支持)
#reverseGeocode(Object,callback); 反向地理编码 #Object
属性类型默认值必填说明pointObject是{latitude: 纬度, longitude: 经度}
#callback 返回 Object 参数说明
属性类型说明typeStringsuccess 表示成功 fail 表示失败codeNumber成功返回 0,失败返回相应 code 码messageString失败描述addressString查询后地址 成功时返回
#poiSearchNearByObject,callback); 周边检索 #Object
属性类型默认值必填说明pointObject是检索的中心点坐标 {latitude: 纬度, longitude: 经度}keyString是搜索关键字radiusNumber3000否检索的半径单位为米indexNumber1否要获取检索结果的页号索引offsetNumber10否设置每页条目数默认每页10条数据。HBuilder 3.2.13
#callback 返回 Object 参数说明
属性类型说明typeStringsuccess 表示成功 fail 表示失败codeNumber成功返回 0,失败返回相应 code 码messageString失败描述totalNumberNumber返回的POI数目currentNumberNumber当前页POI数目pageNumberNumber页数pageIndexNumber当前页号索引poiListArray.poiObjectPOI信息数组
#poiObject
属性类型说明locationObject{latitude: 纬度, longitude: 经度}nameString名称typeString类型distanceNumber距离单位米addressString地址
#poiKeywordsSearchObject,callback); 关键字检索 #Object
属性类型默认值必填说明keyString是搜索关键字indexNumber1否要获取检索结果的页号索引每页10条数据cityString否查询城市可选值cityname中文或中文全拼、citycode、adcode.code 参考表typesString否类型多个类型用“|”分割 可选值:文本分类、分类代码 code 参考表pointObject否设置后则返回结果会按照距离此点的距离来排序 {latitude: 纬度, longitude: 经度}sortruleNumber0否排序规则, 0-距离排序1-综合排序, 默认0offsetNumber10否设置每页条目数默认每页10条数据。HBuilder 3.2.13cityLimitBooleanfalse否强制城市限制功能 默认 false例如在上海搜索天安门如果citylimit为true将不返回北京的天安门相关的POI。HBuilder 3.2.13
#callback 返回 Object 参数说明
属性类型说明typeStringsuccess 表示成功 fail 表示失败codeNumber成功返回 0,失败返回相应 code 码messageString失败描述totalNumberNumber返回的POI数目currentNumberNumber当前页POI数目pageNumberNumber页数pageIndexNumber当前页号索引poiListArray.poiObjectPOI信息数组
Tips
App端使用mapnvue比vue更强大且没有层级问题。App端vue页面默认为高德地图也可以选择百度地图。但app-nvue只有高德地图没有百度地图。以及地图选择apimapSearch只支持高德地图。H5 端获取定位信息需要部署在 https 服务上本地预览localhost仍然可以使用 http 协议。无 GPS 模块的 PC 设备使用 Chrome 浏览器的时候位置信息是连接谷歌服务器获取的国内用户可能获取位置信息失败。App 端使用地图组件需要向高德或百度等三方服务商申请SDK资质获取AppKey打包时需要在manifest的SDK配置中填写Appkey。在manifest可视化界面有详细申请指南详见地图插件配置 - DCloud问答H5 端使用地图和定位相关需要在 manifest.json 内配置腾讯或谷歌等三方地图服务商申请的秘钥key。map 组件默认为国测局坐标调用 uni.getLocation 返回结果传递给 map 组件时需指定 type 为 gcj02。
#三方定位和地图服务收费说明
使用三方定位或者地图服务需向服务提供商如高德地图、百度地图、腾讯地图、谷歌地图申请商业授权和缴纳费用5万/年。
DCloud为开发者争取了福利可优惠获取高德、腾讯的商业授权。如有需求请发邮件到bddcloud.io注明你的公司名称、应用介绍、HBuilder账户你也可以直接通过uni-im发起在线咨询在线咨询地址DCloud地图服务专员。
详见Geolocation定位 | uni-app官网
