Webix 谷歌地图在弹出窗口中

Question

我正在尝试获取一个带有 Webix 弹出窗口中标记的 Google 地图实例，但我收到initMap is not a function错误。有一种直接的方法可以在Webix中初始化谷歌地图，但无法识别此时间标记对象。这是我的代码：

$$("showMapButton").attachEvent("onItemClick", function (id, e) {
if (!$$("mapwin"))
webix.ui({ 
view: "window",
adjust: true,
id: "mapwin",
position: "center",
move: true,
width: 600,
height: 600,
//top: 100, left: 50,
position: "center",
head: {
view: "toolbar",
elements: [
{ view: "label", label: "OpenStreet Map", align: 'left' },
{
view: 'button', label: 'Close', width: 70, click: function () {
$$("mapwin").hide();
}
}
]
},
body: {
width: 300,
height: 300,
template: "<div id='mapBody'> </div>"
},
});

// google.maps.event.addDomListener(window, "load", initMap);

function initMap() {
var uluru = { lat: 32, lng: 32 };
var map = new google.maps.Map(document.getElementById('mapBody'), {
zoom: 4,
center: uluru
});
var marker = new google.maps.Marker({
position: uluru,
map: map
});
}

$$("mapwin").show();
});

我肯定可以使用一些帮助...提前感谢！

Answer 1

$$("showMapButton"(.attachEvent("onItemClick"， function (id， e( {

//create a window if it is does not exist
if (!$$("mapwin"))
webix.ui({
view: "window",
id: "mapwin",
position: "center",
move: true,
width: 600,
height: 600,
head: {
view: "toolbar",
elements: [
{
id:"mapClose", view: 'button', label: 'Close', width: 120, click: function () {
//hide windows (.close() will destroy)
$$("map").getMap(true).then(function (map) {
marker.setMap(null);
map.setOptions({ styles: [] });
});
$$("mapwin").hide();
}
},
{
align:"right", id:"setStyleButton", view: 'button', label: 'Koyu Tema', width: 120, click: function () {
$$("map").getMap(true).then(function (map) {

});
}
}
]
},
body: {
view: "google-map",
id: "map",
key: "AIzaSyBzviXHLV5cRdCOatv5oBatf5EGJ019npQ",
zoom: 9
},
});
$$("map").getMap(true).then(function (map) {
var myLatlng = new google.maps.LatLng(latitude, longtitude);
map.setCenter(myLatlng);

marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Hello World!',
//icon: 'https://maps.google.com/mapfiles/kml/shapes/parking_lot_maps.png'
});
var infowindow = new google.maps.InfoWindow({
content: 'Latitude: ' + myLatlng.lat() +
'<br>Longitude: ' + myLatlng.lng()
});
var str = 'Araç: ' + myLatlng.lat() + '<br>Enlem: ' + myLatlng.lat() + '<br>Boylam: ' + myLatlng.lng() + '<br>Konum: ' + location;

infowindow.setContent(str);
marker.addListener('click', function () {
infowindow.open(map, marker);
});
// infowindow.open(map, marker);
});
$$("mapwin").show();

}); 

好吧，这只是一个承诺功能的问题。首先，您应该获取地图对象，然后使用"then"功能，您可以使用它。如果有人需要谷歌地图与webix，我在这里写代码。