Question

我正在使用谷歌地图javascript API v3在我的Ionic 1应用程序中实现带有一些标记的地图。我想为这些标记使用自定义图像。当我在我的电脑上尝试使用chrome上的应用程序时，标记显示没有问题，但是当我在iOS或Android设备上尝试时，标记不会出现。

这是我的功能：

function setUserMarkers(locations) {

        var image = {
          url: '/images/user_pin.png',
          // This marker is 30 pixels wide by 50 pixels high.
          scaledSize: new google.maps.Size(30, 50),
          // The origin for this image is (0, 0).
          origin: new google.maps.Point(0, 0),
          // The anchor for this image is the base of the flagpole at (15, 30).
          anchor: new google.maps.Point(15, 50)
        };

        var bounds = new google.maps.LatLngBounds();  

        for (var i = 0; i < locations.length; i++) {
            var site = locations[i];
            var myLatLng = new google.maps.LatLng(site.address_latitude, site.address_longitude);

            var contentString = '<p>' + site.account_site_type_description +'</p>';
            var infowindow = new google.maps.InfoWindow({
                content: contentString
            });
            var marker = new google.maps.Marker({
                position: myLatLng,
                map: map,
                icon: image,
                title: site.account_site_type_description,
                zIndex: site.id
            });

            marker.addListener('click', function() {
                infowindow.open(map, marker);
            });
            marker.addListener('dblclick', function() {
                navigateToMap(site.address_latitude, site.address_longitude);
            });

            if (locations.length === 1) {
                map.setCenter(marker.getPosition());
            } else {
                bounds.extend(myLatLng);
                map.fitBounds(bounds);
            }
        }
    }

有人可以帮助我吗？

Answer 1

您指的是从/开始的根目录中的标记网址，这对于Cordova不起作用。你应该为你的图像使用一些相对路径，比如 url: 'images/user_pin.png'

Answer 2

您的文件路径引用自动相对于“www”文件夹。

因此，如果您依靠自定义图标代替常规气球标记，请在“www”文件夹中创建“assets”文件夹，并以这种方式引用这些图标：

var image ='assets / darkgreen_Marker.png';

Google会映射离子应用中未显示的Javascript API v3自定义标记

2 个答案: