| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081 |
- <template>
- <view>
- <cu-custom :bgColor="NavBarColor" :isBack="true">
- <block slot="backText">返回</block>
- <block slot="content">定位</block>
- </cu-custom>
- <map style="width: 100%; height:500px;" :latitude="latitude" :longitude="longitude" :markers="marker"
- :scale="scale">
- </map>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- NavBarColor: this.NavBarColor,
- id: 0, // 使用 marker点击事件 需要填写id
- title: 'map',
- latitude: 40.009704, //纬度
- longitude: 116.374999, //经度
- marker: [{
- id: 0,
- latitude: 40.009704, //纬度
- longitude: 116.374999, //经度
- iconPath: '/static/location.png', //显示的图标
- rotate: 0, // 旋转度数
- width: 20, //宽
- height: 20, //高
- title: '你在哪了', //标注点名
- alpha: 0.5, //透明度
- callout: { //自定义标记点上方的气泡窗口 点击有效
- content: '北京国炬公司', //文本
- color: '#ffffff', //文字颜色
- fontSize: 14, //文本大小
- bordius: 2, //边框圆角
- bgColor: '#00c16f', //背景颜色
- display: 'ALWAYS' //常显
- }
- }],
- scale: 16, //地图缩放程度
- controls: [{ //在地图上显示控件,控件不随着地图移动
- id: 1, //控件id
- iconPath: '/static/login3.png', //显示的图标
- clickable: true,
- position: { //控件在地图的位置
- left: 15,
- top: 15,
- width: 50,
- height: 50
- },
- }],
- circles: [{ //在地图上显示圆
- latitude: 40.009704,
- longitude: 116.374999,
- radius: 50, //半径
- fillColor: "#ffffffAA", //填充颜色
- color: "#55aaffAA", //描边的颜色
- strokeWidth: 1 //描边的宽度
- }],
- }
- },
- onLoad() {
- this.getLocation()
- },
- methods: {
- getLocation() {
- uni.getLocation({
- type: 'gcj02',
- success: function(res) {},
- fail: function(res) {
- }
- });
- }
- }
- }
- </script>
- <style>
- </style>
|