uniapp map上markers图标的大小设置

最新推荐文章于 2024-05-14 17:22:25 发布
最新推荐文章于 2024-05-14 17:22:25 发布
阅读量1.2k 收藏 1
点赞数 1
文章标签： uni-app
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/DDZYW/article/details/134519006
版权

在小程序上，markers可以通过markers里的width和height（字符串、数字类型都可）设置图标大小。如：图片设置的是30

但是在app上，这两个设置了是不起效果的，只能去调整图片的大小，起初我的图片原本大小是40，但是在app上实在太小了，就把图片尺寸设置成了80，大小才差不多合适。如：

自己做个记录，免得以后会忘！！！！！

顺便结尾，我有个问题想向大家请教，就是现在uniapp 小程序如果要用高德的地图作为展示，要怎么做？虽然说api都是用的高德的，不会有地图不一样导致的经纬度差异，但是还是想问一下，怎样才能在小程序上也用高德地图作为展示呢？如果有哪位做过请留言一下，感谢！！！

咸鱼还是虾
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uni-app 地图组件的使用
pure_one的博客
09-04 2170
首先说一说map地图组件的一些属性 longitude：经度 latitude：纬度 scale：缩放级别，也就是说放大缩下的程度，取值范围是5-18，默认的是16 ，他就是呢值数越大，放大程度越大，看的越细，看村庄的那种 markers：标记点 就是说你在地图上标记出来的东西 polyline：路线 可以写两个标记点 然后用路线将他们连接起来 circle：圆 就是说在地图上画个圈？ control...
react使用高德地图react-amap：Markers、Circle、ContextMenu、自定义ContextMenu
09-29
在`react-amap`中，我们可以创建一个Marker组件，通过`position`属性指定标记点的经纬度坐标，`icon`属性可以设置标记点的图标，同时还可以添加点击事件监听器以实现交互功能。 4. **Circle**: Circle组件用于在...
uniapp小程序地图设置中心点位置向上偏移
farmerXU的博客
11-21 1996
uniapp地图位置偏移
uniapp点击地图标记点,设置点击点为中心显示位置并放大层级
abs_botton的博客
08-11 3655
uniapp点击地图标记点,设置点击点为中心显示位置并放大层级
解决uni-app map地图显示图标markers问题（初学记录）
最新发布
m0_74265954的博客
05-14 1112
在uni-app中引入地图需要提前在腾讯地图或者高德地图申请API，网上有很多教程官网给出的效果：然而我按照官网的步骤写了之后只有地图没有图标没改之前的代码：（我这里的经纬度是从云端传过来的）
uniapp 小程序 地图中心点设置标注点(图片)
树上骑个猴的博客
11-19 3388
<map id="myMap" class="myMap" scale="{{scale}}" min-scale="8" longitude="{{longitude}}" latitude="{{latitude}}" show-location="true" bindregionchange="regionDidChange"> <!-- map content --> <cover-image class="manpCenter" src="/im.
uniapp中设置地图组件的自适应高度
qq_43551769的博客
08-03 4533
1、背景 在做app的项目中，有时候需要对不同手机设置相应的自适应高度，虽然对于宽度有‘rpx’的解决方案，但是高度却需要我们自己进行配置。 2、实例 js部分： data() { return { nowMapIndex:true, phoneHeight:'',//屏幕高 phoneWidth:'',//屏幕宽 } }, onReady(){ // 计算屏幕高度 ，宽度 let _this = this; uni.getSystemIn
uniapp map组件的markers，polyline使用及问题
weixin_55532289的博客
11-24 4316
最近在做巡检任务功能，需要在安卓端记录当前巡检轨迹，以及原本的路线显示，由于是使用uniapp框架开发的，所以这里我使用的是uniapp里的map组件。 参考官方文档：https://uniapp.dcloud.io/component/map?id=map 注意：地图组件用于展示地图，而定位API只是获取坐标，请勿混淆两者。 一、获取当前位置: type:默认为 wgs84 返回 gps 坐标，gcj02 返回国测局坐标，可用于 uni.openLocation 的坐标，app平台高德SDK仅支持返回gc
uniapp苹果端map缩放时markers不会自适应
qq_48555398的博客
10-21 583
我们在uniapp中使用map组件时，markers在ios端缩小很大比例时会发现没有自适应，比如我们定位到北京，缩小很大比例后可能markers都到北冰洋了。 解决:我们只需在marker对象中加上以下代码方可解决。 anchor: { x: 0.5, y: 0.5 }
uniapp地图手动控制地图scale
why404
11-16 1043
uniapp地图手动控制地图scale
uniapp地图基本使用及解决添加markers不生效问题？
Smile_ping的博客
11-28 1989
uniapp地图基于 nvue 实现添加 markers、气泡、查看地理位置、定位到当前位置的基本使用。
微信小程序map组件动态markers
03-29
使用wepy框架，请求回来的数据设置给data里面初始化的markers，使用wx：if在拿到数据后渲染map组件，模拟器上没问题，真机上map组件渲染不出来   本主题由 Rolan 于 2018-10-12 14:17 审核通过       (此图片...
Map Track Markers VFX v2.13.unitypackage
08-26
URP(LWRP)和HDRP支持PC/控制台/手机/WebGL/VR支持。 您可以使用标准大小值轻松地调整效果的大小。效果是非常简单的使用，只需采取和下降预制到您的游戏!
Map Track Markers VFX v2.11
09-17
1. 粒子特效：Map Track Markers VFX v2.11内置了丰富的粒子特效库，包括火花、烟雾、光晕等，可以轻松地添加到指向标或地图上的其他元素，为场景增添视觉冲击力。 2. 效果组合：开发者可以自由组合不同的粒子特效，...
react-map-markers:在地图上显示对象| React JS
05-27
查看项目的演示版本该项目的演示版本可从以下链接获得： 任务实现一个应用程序，该应用程序显示带有映射的对象标记的地图，该标记来自提供的映射到它的链接。 需要检索和显示对象。 通过单击列表中的对象，该对象将...
uni-app设置地图显示
weixin_59527403的博客
01-01 1041
uni-app设置地图显示
uniapp nvue map组件
拥抱城市的你
01-16 3046
Map组件功能使用uni.getLocation新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 uni.getLocation uni.getLocation开启实时定位功能 配合 markers 显示控件 （当前位置和
微信小程序-如何根据缩放屏幕大小自适应icon图标更改marker
Bartender_VA11的博客
11-26 2379
微信小程序如何根据用户的缩放屏幕来改变marker图标icon的大小，实现icon自适应屏幕缩放的效果
uniapp map markers标记点
08-31
在uniapp中使用map组件进行标记点的操作，需要进行以下几个步骤： 1. 首先，在map标签中绑定要标记的点，可以通过在data里定义一个markers数组，并将要标记的点以对象的形式添加到该数组中。 2. 在map组件中设置markers属性为markers数组，以将数组中的点显示在地图上。 以下是一个示例代码片段，展示了如何在uniapp中使用map组件进行标记点： ``` <template> <view> <map style="width:750rpx; height:100vh;" scale="17" show-location="true" :latitude="latitude" :longitude="longitude" :markers="markers"></map> </view> </template> <script> export default { data() { return { title: 'map', longitude: '122.106863', latitude: '30.016028', markers: [ { id: 1, latitude: 30.016028, longitude: 122.106863, title: '标记点1' }, { id: 2, latitude: 30.015, longitude: 122.106, title: '标记点2' }, // 可以添加更多的标记点 ] } } } </script> ``` 在上面的示例中，markers数组中包含了两个标记点，每个标记点都有一个唯一的id、经纬度和标题。这样，在地图上就会显示这些标记点的位置。 注意：以上示例仅为演示代码，实际使用时需要根据具体需求进行调整。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [【记录4】uniapp Map地图组件 动态渲染markers](https://blog.csdn.net/weixin_44390036/article/details/124861312)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* *3* [uniapp map地图显示图标markers问题，自定义图标不显示](https://blog.csdn.net/web13985085406/article/details/123431764)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值