Berbagi teknologi

UNIAPP menggunakan peta jalur rute peta Baidu Amap Tencent

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

UNIAPP menggunakan peta jalur rute peta Baidu Amap Tencent

Tautan: plugin.

Lintasan rute pertama-tama perlu menerapkan nilai kunci dari pusat pengembang

Plugin harus diimpor

Salin kode di bawah ini dan ganti nilai KEY

Setelah menerapkan nilai kunci, Anda hanya perlu melewati garis bujur dan lintang awal dan akhir**

<template>
    <view>
        <view class="uni-common-mt">
            <view>
                <map :latitude="latitude" :longitude="longitude" :markers="markers" :polyline="polyline" :scale="scale">

                </map>
            </view>
        </view>
    </view>
</template>

<script>
    import route from '@/js_sdk/heimao-map/heimaodinwei-map/heimao-map.js'
    export default {
        data() {
            return {
                latitude: 30.923396,
                longitude: 121.478823,
                markers: [],
                polyline: [],
                scale: 15
            }
        },
        methods: {
        },
        onLoad() {
            // 这里填自己的高德地图应用中key 没有的话自己注册一个
            route.setKey("高德的key值");
            // 这里填自己的百度地图应用中key 没有的话自己注册一个
            // route.setKey("百度地图的key值");
            const origin ={
                latitude: 30.923396,
                longitude: 121.478823,
                //起点的icon
                iconPath: '../../static/qd.png',
            };
            const destination = {
                latitude: 30.925396,
                longitude: 121.678823,
                //终点的icon
                iconPath: '../../static/zd.png',
            };

            route.drawRoute(this,origin,destination);

        }
    }
</script>
<style>
    map {
        width: 100%;
        height: 100vh;
    }
    .cover{
        display: flex;
        text-align: center;
        background: #999;
    }
</style>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60