关于移动端使用百度app小弹窗 方法

loadMap() {

            const doc = this.$refs.mapFrame.contentWindow.document;

            const script = doc.createElement("script");

        

            script.onload = () => {

                this.initMap();

            };

            doc.body.appendChild(script);

        },

        initMap() {

            console.log(this.$refs.mapFrame.contentWindow.document.getElementById);

           

            const map =  new qq.maps.Map(this.$refs.mapFrame.contentWindow.document.body, {

                // 进行地图初始化配置

                center: center,

                zoom: 12,

                draggable: true,

                scrollwheel: true,

                markers: data,

            });

            let self = this

           

            var data = self.listValue.map( item =>{

                if (item.zb) {

                    return item.zb.split(',').map(coord => parseFloat(coord));

                }

            })

            var latlngs = self.listValue.map(item => {

                let [lat, lng] = item.zb.split(',').map(coord => parseFloat(coord))

                return { lat, lng }

            });

           

            function createCluster() {

                var markers = [];

                    for (var i = 0; i < data.length; i++) {

                        var latLng = new qq.maps.LatLng(data[i][0], data[i][1]);

                        var marker = new qq.maps.Marker({

                            position: latLng,

                            map: map

                        });

                        markers.push(marker);

                    }

                    var markerClusterer = new qq.maps.MarkerCluster({

                        map: map,

                        minimumClusterSize: 999, //默认2

                        markers: markers,

                        zoomOnClick: true, //默认为true

                        gridSize: 30, //默认60

                        averageCenter: true, //默认false

                        maxZoom: 18 //默认18

                    });

                    var infoWin = new qq.maps.InfoWindow({ map: map});

                    for(var i = 0;i < latlngs.length; i++) {

                        (function(n){

                            let titleValue = self.listValue[n].bt

                            let locationValue =self.listValue[n].ddm

                            let marker = new qq.maps.Marker({

                                position: new qq.maps.LatLng(latlngs[n].lat, latlngs[n].lng),

                                map: map

                            });

                            qq.maps.event.addListener(marker, 'click', function() {

                                let contentHtml  =  '<div onClick="window.parent.zoomOnClick111('+n+')"  id="btn' + n + '"   style="text-align:center;white-space:nowrap;margin:10px;">'+ titleValue + '</div>' +

        '<div onClick="window.parent.zoomOnClick111('+n+')" style="text-align:center;margin:10px;width:200px">位置:' + locationValue + '</div>'

                                infoWin.open();

                                infoWin.setContent(contentHtml)

                                infoWin.setPosition(new qq.maps.LatLng(latlngs[n].lat, latlngs[n].lng));

                              });

                            })(i);

                    }

            };

        

        }