更新记录

0.04（2023-01-09）

界面版本号显示没有更新

0.03（2023-01-04）

增加h5支持

0.02（2023-01-03）

添加 腾讯申请开发者密钥 获取页面

平台兼容性

使用场景

用于选择划定范围内的小区门市等，用于范围内小区配送，维修服务器等......

使用说明

插件基于qqmap-wx-jssdk.min.js，（https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview）；

manifest.json的mp-weixin节点下的requiredPrivateInfos节点应包含"onLocationChange", "chooseAddress", "getLocation","choosePoi", "chooseLocation", "startLocationUpdate", "startLocationUpdateBackground"

如下

    "mp-weixin" : {
        "appid" : "",
        "setting" : {
        },
        "permission" : {
            "scope.userLocation" : {
                "desc" : "你的位置信息将用于小程序定位"
            }
        },
        "requiredPrivateInfos" : [
            "onLocationChange",
            "chooseAddress",
            "getLocation",
            "choosePoi",
            "chooseLocation",
            "startLocationUpdate",
            "startLocationUpdateBackground"
        ],
        "plugins" : {
        },
        "optimization" : {
        }
    },

需要在小程序后台 开发管理 -> 接口设置 申请 wx.getLocation接口权限。

<template>
    <view style="height: 80vh;">
        <mapLocationPickerPolygons @selected="selected" :base_url="base_url" :sig='sig' :qqmapsdkKey="qqmapsdkKey" :polygons="polygons"></mapLocationPickerPolygons>
    </view>
</template>

<script>
    import mapLocationPickerPolygons from '@/components/liupishui-pickerpolygons/liupishui-pickerpolygons.vue';

    export default {
        components: {
            mapLocationPickerPolygons
        },
        data() {
            return {
                polygons:[
                    {
                        points:[
                            {
                                latitude:'36.850142',
                                longitude:'117.982894',
                            },
                            {
                                latitude:'36.844984',
                                longitude:'118.0732',
                            },
                            {
                                latitude:'36.840355',
                                longitude:'118.099896'
                            },
                            {
                                latitude:'36.797837',
                                longitude:'118.058995'
                            },
                            {
                                latitude:'36.786369',
                                longitude:'117.990083',
                            },
                        ],
                        strokeWidth:1,
                        strokeColor:'#ff000066',
                        fillColor:'#ff000016'
                    }
                ],
                qqmapsdkKey:'*****-*****-*****-*****-*****-*****' ,//必须，申请地址：https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview，小程序还需要在控制台（https://lbs.qq.com/dev/console/application/mine）添加小程序的appid
                base_url:'https://******.com/ws/',//小程序不需要配置此项;H5配置此项是为了跨域，地址为自己配置的代理服务器地址加路径'/ws/'(实际请求可能会出现双斜杠，如果报错，记得删除一个);
                sig:'************'//小程序不需要配置此项,H5调用webservice使用（域名白名单或者授权ip的情况可以不填此项），文档说明详见https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/methodSearch
            }
        },
        methods: {
            selected:(data)=>{
                console.log(data);
            }
        }
    }
</script>

<style>

</style>