DawnGruel
DawnGruel
  • 发布:2020-02-20 19:54
  • 更新:2021-07-01 11:08
  • 阅读:800

map组件在demo中路径轨迹正确,但是自己的项目运行中,路径轨迹功能ios无法显示(安卓正常)

分类:uni-app
<view class="mapView" style="width:750rpx;height: 600rpx;">  
 <map class="map" id="map1" ref="map1" style="width:750rpx;height: 600rpx;" :scale="mapOption.scale" :latitude="latitude" :longitude="longitude" :show-location="true" :markers="markers" :polyline="polyline"></map>  
</view>
let testmarkers = [  
    {  
        id: 0,  
        latitude: 26.463145,  
        longitude: 112.949292,  
        iconPath: '/static/img/virus.png',  
        title: '问题点',  
        zIndex: '1',  
        rotate: 0,  
        width: 20,  
        height: 25,  
        anchor: {  
            x: 0.5,  
            y: 1  
        },  
        callout: {  
            content: '问题点',  
            color: '#00BFFF',  
            fontSize: 10,  
            borderRadius: 4,  
            borderWidth: 1,  
            borderColor: '#333300',  
            bgColor: '#CCFF99',  
            padding: '5',  
            display: 'ALWAYS'  
        }  
    }  
];  
const testPolyline = [  
    {  
        points: [  
            {  
                latitude: 31.23037,  
                longitude: 121.4737  
            },  
            {  
                latitude: 31.23137,  
                longitude: 121.4737  
            },  
            {  
                latitude: 31.23537,  
                longitude: 121.4737  
            },  
            {  
                latitude: 31.24037,  
                longitude: 121.4737  
            }  
        ],  
        fillColor: '#000',  
        strokeWidth: 10,  
        strokeColor: '#CC99CC',  
        zIndex: 11  
    }  
];  
export default {  
    data() {  
        return {  
            mapOption: {  
                scale: 15,  
                enableTraffic: false,  
            },  
            markers: [],  
            address: {  
                street: '',  
                cityCode: '',  
                province: '',  
                district: '',  
                poiName: '',  
                streetNum: '',  
                city: '',  
                country: ''  
            },  
            latitude: '', //纬度  
            longitude: '',  
            info: null,  
            polyline: []  
        };  
    },  
    onReady() {  
        this.map = uni.createMapContext("map1", this);  
    },  
    methods: {  
        timer() {  
            this.getLocation(true);  
            return setInterval(() => {  
                this.getLocation();  
            }, 5000);  
        },  
        addPolyline() {  
            this.polyline = testPolyline;  
        },  
        getLocation(setLocation) {  
            let _this = this;  
            uni.getLocation({  
                geocode: true,  
                type: 'gcj02',  
                success(res) {  
                    if (setLocation) {  
                        // _this.latitude = res.latitude;  
                        _this.latitude = 31.23037  
                        // _this.longitude = res.longitude;  
                        _this.longitude = 121.4737;  
                        testmarkers[0].latitude = res.latitude + 0.0004;  
                        testmarkers[0].longitude = res.longitude + 0.0004;  
                        _this.markers = testmarkers;  
                        // _this.polyline = testPolyline;  
                        _this.address = res.address;  
                        _this.dangerousCalculate();  
                        console.log(res);  
                    }  
                    // console.log('获取成功');  
                    // console.log(res);  
                    _this.locationArr.push(JSON.stringify(res));  
                },  
                fail(res) {  
                    console.log(res);  
                    _this.locationArr.push(JSON.stringify(res));  
                }  
            });  
        }  
    }  
};
2020-02-20 19:54 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com

没有设置width 好久才发现这个坑

该问题目前已经被锁定, 无法添加新回复