安卓使用nvue渲染map地图无法自定义地图聚合簇logo，一直显示深蓝色

示例代码：

<template> <view> <map key='map' :enable-3D="true" ref="map-power" id="map-power" class="map-power" :scale="scale" enable-satellite="enableSatellite" :latitude="latitude" :longitude="longitude" @labeltap="markertap" @markertap="markertap" @regionchange="changeEvent" :style="{height: mH + 'px'}">
</map>
<!-- 顶部搜索框 -->
<view class="top-search">
<uni-search-bar @click.native="goSearch" readonly placeholder="关键词搜索" style="width: 730rpx"></uni-search-bar>
</view>
<view class="side-bar" :style="{top: mH / 2 + 'px'}">
<view class="side-bar-top flex-center">
<view class="bg"></view>
<view class="flex-center side-bar-top-item" v-for="(item, index) in homeBodyFirList" :key="index">
<text class="side-bar-top-item-v">{{ item.value | getDef }}</text>
<text class="side-bar-top-item-l">{{ item.label | getDef}}</text>
</view>
</view>
<view class="side-bar-refresh flex-center" @click.stop="refresh">
<!-- <text class="iconfont icon-shuaxin"></text> -->
<image class="image" :src="${baseUri}/app/file/img/刷新.png"></image>
</view>
<view class="side-bar-show-type flex-center" @click.stop="toggleEnableSatellite">
<!-- <text class="iconfont icon-ditu2" v-if="enableSatellite"></text>
<text class="iconfont icon-weixing" v-else></text> -->
<image class="image" :src="${baseUri}/app/file/img/地图2.png" v-if="enableSatellite"></image>
<image class="image" :src="${baseUri}/app/file/img/卫星.png" v-else></image>
</view>
</view>
<!-- 详情 -->
<uni-popup ref="share" type="share" safeArea backgroundColor="#fff">
<view style="padding: 20rpx; min-height: 340px">
<view class="flex-center" style="margin-bottom: 5px; flex-direction: row; justify-content: space-between;">
<view class="dot-3" style="font-weight: bold; flex: 1;">{{ selectItem.name | getDef }}</view>
<view class="flex-center" style="width: 170rpx; flex-direction: row; flex-shrink: 0; justify-content: flex-end;" @click.stop="detail">
<text style="color: #37c0ff; font-size: 14px;">更多信息</text>
</view>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">电站状态:</text>
<text class="value" style="flex: 1;" style="{color: selectItem.status === 1 ? '#24a21d' : selectItem.status === 2 ? '#f40' : '#ffc123'}">{{ selectItem.status === 1 ? '在线' : selectItem.status === 2 ? '离线' : '报警' }}</text> </view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">电站地址:</text>
<text class="value" style="flex: 1; ">{{ selectItem.address | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">电站阶段:</text>
<text class="value"
style="flex: 1; ">{{ selectItem.stationStage === 1 ? '踏勘评估' : selectItem.stationStage === 2 ? '施工建设' : selectItem.stationStage === 3 ? '运营维护' : '停运' }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">电站类型:</text>
<text class="value" style="flex: 1; ">{{ selectItem.powerType | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">并网类型:</text>
<text class="value" style="flex: 1; ">{{ selectItem.gridConnectionType | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">出资方式:</text>
<text class="value" style="flex: 1; ">{{ selectItem.contributionWay | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">组件排列类型:</text>
<text class="value"
style="flex: 1; ">{{ getComponentArrangementType(selectItem.componentArrangementType) | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">组件总容量:</text>
<text class="value" style="flex: 1; ">{{ selectItem.componentCapacity | getDef }}kWp</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">供方单位:</text>
<text class="value" style="flex: 1; ">{{ selectItem.affiliatedUnit | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
<view class="flex pop-item">
<text class="label" style="flex-shrink: 0;">业主单位:</text>
<text class="value" style="flex: 1; ">{{ selectItem.ownerName | getDef }}</text>
</view>
<divide-hor margin-tb="5"></divide-hor>
</view>
</uni-popup>
</view>
</template>

<script>
import debounce from 'lodash/debounce'
import {
Log,
timestampToDateTime,
recursionFindTree,
showLoading,
getLenPx,
hideLoading
} from '@/utils/commonUtil.js'
import {
baseUri,
context
} from '@/common/env.js'
import router from '@/utils/router.js'
import dict from '@/common/mock-data/dict'
import {
jsonURI
} from '@/utils/jsonURI.js'
import {
getPowerStationList,
homeStatisticsData
} from '@/common/api/powerInfoModule/index.js'
import {
getStore
} from '@/utils/store.js'
import {
getPowerStationType,
getGridConnectionType,
getContributionWay
} from '@/utils/businessUtil.js'
export default {
data() {
return {
mH: uni.getSystemInfoSync().windowHeight,
includePoints: [],
scale: 10.03,
enableSatellite: true,
baseUri,
keyword: '',
longitude: null,
latitude: null,
list: [],
markers: [],
clusters: [], // 聚合集合
mapContext: null,
changeEvent: debounce(this.handleRegionChange, 300),
selectItem: {},
statisticsData: {}
}
},
computed: {
// ...mapGetters(['selectedSearch', 'posInfo', 'ofUnitList']),
getComponentArrangementType() {
return function(typeArr) {
if (typeArr instanceof Array) {
if (typeArr.length === 0) return '--';
const comLayoutTypes = dict.comLayoutTypes;
return comLayoutTypes.filter(item => typeArr.includes(item.value)).map(item => item.text).join(
"、")
} else {
return "--"
}
}
},
homeBodyFirList() {
const _t = this;
return [{
iconfont: '',
icon: '/static/img/tabbar/home/power_count.png',
label: '电站数',
value: _t.statisticsData.powerStationCount || 0,
},
{
icon: '/static/img/tabbar/home/on_line.png',
label: '在线',
value: _t.statisticsData.onlineCount || 0,
stationStatus: 1
},
{
icon: '/static/img/tabbar/home/off_line.png',
label: '离线',
value: _t.statisticsData.offLineCount || 0,
stationStatus: 2
},
{
icon: '/static/img/tabbar/home/alarm.png',
label: '告警',
value: _t.statisticsData.alarmCount || 0,
stationStatus: 3
},
]
}
},
onReady() {
const _t = this;
_t.mapContext = uni.createMapContext("map-power", _t);
_t.mapContext.initMarkerCluster({
enableDefaultStyle: false,
zoomOnClick: true,
gridSize: 100
});
_t.getData();
// 监听聚合事件
_t.mapContext.on('markerClusterCreate', res => {

            _t.clusters = res.clusters.map(cluster => {  

                const markerId = parseInt((new Date().getTime() + index + '').substr(4, 9));  
                const {  
                    center,  
                    clusterId,  
                    markerIds  
                } = cluster  
                return {  
                    ...center,  
                    clusterId: parseInt(clusterId),  
                    width: 50,  
                    height: 50,  
                    joinCluster: true, //核心代码，没有这个自定义样式就不会生效  
                    iconPath: `${baseUri}/app/file/img/map_polymerization.png`,  
                    label: {  
                        content: markerIds.length + '',  
                        fontSize: 16,  
                        color: '#fff',  
                        bgColor: '#168d16',  
                        width: 50,  
                        height: 50,  
                        // textAlign: 'center',  
                        anchorY: -50,  
                        anchorX: -25,  
                    }  
                }  
            })  
            _t.mapContext.addMarkers({  
                markers: _t.clusters,  
                clear: false  
            })  
        })  
    },  
    onLoad() {  
        const _t = this;  
        const params = getStore("params");  
        const posInfo = uni.$store.getters.posInfo;  
        _t.latitude = posInfo.longitude || params.longitude;  
        _t.longitude = posInfo.latitude || params.latitude;  
        _t.homeStatisticsData();  
        // 监听搜索变化  
        uni.$on("NVUE_SET_SELECTED_SEARCH", item => {  

            if (item) {  
                const {  
                    lng,  
                    lat  
                } = item.location  
                _t.$nextTick(() => {  
                    setTimeout(() => {  
                        _t.mapContext.moveToLocation({  
                            longitude: lng,  
                            latitude: lat,  
                            success: () => {  
                                _t.latitude = lat;  
                                _t.longitude = lng;  
                                _t.scale = 10 + (Math.random() * 0.0000001)  
                            }  
                        })  
                    }, 500)  
                })  
            }  
        })  
    },  
    methods: {  
        toggleEnableSatellite() {  
            const _t = this;  
            _t.enableSatellite = !_t.enableSatellite  
        },  
        refresh() {  
            const _t = this;  
            _t.getData(true)  
            _t.homeStatisticsData();  
        },  
        async homeStatisticsData() {  
            const _t = this;  
            const res = await homeStatisticsData()  
            if (res.data.success) {  
                _t.statisticsData = res.data.result  
            }  
        },  
        markertap(e) {  
            const _t = this;  
            _t.selectItem = _t.list.find(item => item.markerId === e.detail.markerId) || {}  
            _t.$refs['share'].open();  
        },  
        detail(e) {  
            const _t = this;  
            router.navigateTo("/pages_thir/powerStationDetail/powerStationDetail", {  
                data: _t.selectItem  
            })  
            _t.$refs['share'].close();  
        },  
        async getData(sl = false) {  
            const _t = this;  
            sl && showLoading()  
            const res = await getPowerStationList();  
            sl && hideLoading()  
            const {  
                success,  
                message,  
                result  
            } = res.data  
            if (success && result) {  
                // 显示电站到地图  
                const markers = [];  
                _t.list = result.map((item, index) => {  
                    const markerId = parseInt((new Date().getTime() + index + '').substr(4, 9));  
                    const ofUnitList = uni.$store.getters.ofUnitList;  
                    const json = {  
                        ...item,  
                        markerId,  
                        name: item.powerStationName,  
                        status: item.stationStatus,  
                        componentArrangementType: (item.componentArrangementType || "")  
                            .split(","),  
                        powerType: getPowerStationType(item  
                            .powerStationType), // 电站类型  
                        powerTypeId: item.powerStationType,  
                        gridConnectionType: getGridConnectionType(item  
                            .gridConnectionType), // 并网类型  
                        gridConnectionTypeId: item.gridConnectionType, // 并网类型  
                        contributionWay: getContributionWay(item.contributionWay),  
                        contributionWayId: item.contributionWay,  
                        powerOnTime: timestampToDateTime(item.powerOnTime), // 上电时间  
                        powerOnTimeOrigin: item.powerOnTime, // 上电时间  
                        firstGenerationTime: timestampToDateTime(item  
                            .firstGenerationTime), // 首次发电时间  
                        firstGenerationTimeOrigin: item.firstGenerationTime, // 首次发电时间  
                        affiliatedUnit: recursionFindTree(ofUnitList, 'value',  
                            item  
                            .supplierDepartId).text || "", // 所属单位  
                        supplierDepartId: item.supplierDepartId, // 所属单位  
                        ownerName: recursionFindTree(ofUnitList, 'value', item  
                                .ownerDepartId)  
                            .text || "", // 业主单位   
                        ownerDepartId: item.ownerDepartId, // 业主单位   
                        stationStage: item.stationStage || 1,  
                        priceScheme: (item.priceInfo || {}).priceScheme || [],  
                    }  
                    markers.push({  
                        id: markerId,  
                        markerId: markerId,  
                        width: 35,  
                        height: 35,  
                        joinCluster: true,  
                        powerStationId: item.id,  
                        latitude: item.latitude,  
                        longitude: item.longitude,  
                        iconPath: json.status === 1 ?  
                            `${baseUri}/app/file/img/ps_online_cache.png` : json  
                            .status === 2 ? `${baseUri}/app/file/img/ps_offline_cache.png` :  
                            `${baseUri}/app/file/img/ps_alarm_cache.png`,  
                        label: {  
                            content: item.powerStationName,  
                            color: '#fff',  
                            textAlign: 'right',  
                            padding: 1.5,  
                            borderRadius: 5,  
                            borderWidth: 1,  
                            fontSize: 9,  
                            anchorX: -(0.5 * getLenPx(item.powerStationName, 9)),  
                            borderColor: json.status === 1 ? '#24a21d' : json  
                                .status === 2 ? '#f40' : '#ffc123',  
                            bgColor: '#000000BF'  
                        }  
                    })  
                    return json;  
                });  
                // 更换markers为最新的  
                _t.markers = markers  
                _t.mapContext.addMarkers({  
                    markers: _t.clusters,  
                    clear: true  
                })  
                // 每次刷新数据更新markers  
                _t.mapContext.addMarkers({  
                    markers,  
                    clear: false  
                })  
                // 全局视野定位  
                if(!sl) {  
                    _t.$nextTick(() => {  
                        setTimeout(() => {  
                            // 查看所有给定坐标返回的视图  
                            const includePoints = []  
                            for (let i = 0, len = markers.length; i < len; i++) {  
                                const {  
                                    latitude,  
                                    longitude  
                                } = markers[i]  
                                if (latitude && longitude) {  
                                    includePoints.push({  
                                        latitude,  
                                        longitude  
                                    })  
                                }  
                            }  
                            console.log("缩放的列表", includePoints);  
                            _t.mapContext.includePoints({  
                                points: includePoints,  
                                padding: [250, 250, 250, 250]  
                            })  
                        }, 500)  
                    })  
                }  
            }  
        },  
        goSearch() {  
            uni.navigateTo({  
                url: `/pages_thir/powerStationMapSearch/powerStationMapSearch?longitude=${this.longitude}&latitude=${this.latitude}`  
            })  
        },  
        handleRegionChange(e) {  

        }  
    }  
}  

</script>

<style lang="scss" scoped>
.map-power {
width: 750rpx;
position: relative;
}

.top-search {  
    position: absolute;  
    width: 750rpx;  
    left: 0;  
    right: 0;  
    z-index: 1000;  
    padding: 10rpx;  
}  

.label {  
    color: #5d5c5c;  
    font-size: 13px;  
    margin-right: 10rpx;  
}  

.value {  
    color: #000;  
    font-size: 13px;  
    text-align: left;  
}  

.side-bar {  
    display: flex;  
    align-items: center;  
    justify-content: center;  
    flex-wrap: wrap;  
    width: 90rpx;  
    position: absolute;  
    right: 5px;  
    transform: translateY(-250rpx);  

    &-top {  
        display: flex;  
        align-items: center;  
        justify-content: center;  
        width: 90rpx;  
        padding: 0 10rpx 10px 10rpx;  
        flex-wrap: wrap;  
        border-radius: 20rpx;  

        .bg{  
            position: absolute;  
            background-color: #ffffff;  
            opacity: .8;  
            left: 0;  
            top: 0;  
            right: 0;  
            bottom: 0;  
            border-radius: 20rpx;  
        }  

        &-item {  
            display: flex;  
            align-items: center;  
            justify-content: center;  
            position: relative;  
            z-index: 10;  
            width: 70rpx;  
            height: 70rpx;  
            border: 1px solid #d8d7d7;  
            flex-direction: column;  
            background-color: #fff;  
            border-radius: 100%;  
            margin-top: 10px;  
            box-shadow: 4px 2px 6px #ccc;  

            &:first-child {  
                margin-top: 0;  
            }  

            &-v {  
                font-size: 20rpx;  
                color: #000;  
            }  

            &-l {  
                color: #4b4b4b;  
                font-size: 16rpx;  
            }  
        }  
    }  

    &-refresh,  
    &-show-type {  
        display: flex;  
        align-items: center;  
        justify-content: center;  
        width: 70rpx;  
        height: 70rpx;  
        border-radius: 100%;  
        background-color: #ffffff;  
        color: #4b4b4b;  
        font-size: 30rpx;  
        margin-top: 10px;  

        .image {  
            width: 35rpx;  
            height: 35rpx  
        }  
    }  
}  

.pop-item{  
    flex-direction: row;  
    justify-content: space-between;  
    width: 730rpx;  
}  

</style>

操作步骤：

渲染时见结果，核心代码在_t.mapContext.on('markerClusterCreate', res => { })监听实现

预期结果：

如图附件中的微信小程序自定义logo

实际结果：

没有变化，显示的是默认的深蓝色