地图农场地块显示种养品种图片

xiebin

2022-08-25 3295832c31a1e26ba3b34e439b2caafbff66bd69

地图农场地块显示种养品种图片

 src/components/map/index.vue

@@ -302,22 +302,24 @@

            const center = this.getCenter(positions)

            // const divIcon = new global.DC.DivIcon(
            //     new global.DC.Position(center[0], center[1], 0),
            //     `
            //             <div class="farm-map-icon">
            //                 <img src="/img/icon/3858.png" alt="">
            //                 // <div>${item.farmName}</div>
            //             </div>
            //             `
            // )
            // divIcon.attrParams = item
            // farmLogoLayer.addOverlay(divIcon)
            if (item.strainUrl != '') {
                const urls = item.strainUrl.split(',')
                let imageStr = '<div class="land-map-icon">'
                urls.forEach(url => {
                    imageStr += `<img src="${url}" alt=""width="100px" height="100px" text-align="center" class="strainImg">`
                })
                imageStr += '</div>'
                const divIcon = new global.DC.DivIcon(
                    new global.DC.Position(center[0], center[1], 0), imageStr
                )

            // divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
            //     that.$parent.showDetailPopup(e.overlay.attrParams)
            // })
                divIcon.attrParams = item
                farmLogoLayer.addOverlay(divIcon)

                divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    that.$parent.plotDetailsPopupShow(e.overlay.attrParams)
                })
            }
            const polygon = new global.DC.Polygon(positions)
            polygon.attrParams = item
            polygon.setStyle({
@@ -485,7 +487,13 @@
         */

        setPlotCenter (landObj) {
            console.log(landObj,11111111)
            if (!landObj.landRange) {
                this.$message({
                    message: '当前地块暂未绘制',
                    type: 'warning'
                })
                return
            }
            let center
            addPlotLayers.forEach(item => {
                if (landObj.landName == item.name) {

 src/styles/index.scss

@@ -81,4 +81,16 @@
    img {
        width: 24px;
    }
}
}

.land-map-icon {
    font-weight: bold;
    color: rgb(252, 166, 7);
    text-align: center;

    img {
        width: 48px;
        height: 48px;
        border-radius: 50%;
    }
}