【问题标题】:Adding image to google maps marker for this code将此代码的图像添加到谷歌地图标记
【发布时间】:2014-02-01 01:08:52
【问题描述】:

我正在尝试将自定义图像添加到此代码上的标记,但我不知道如何。我尝试添加新的 var z 并放入图像中,但它不起作用。我发现了越来越多类似的代码,但这看起来很简单,而且我在这个领域很新,我想从不那么复杂的东西开始。

我在这里找到了这段代码:http://stiern.com/tutorials/adding-custom-google-maps-to-your-website/

function initialize() {
        var map_options = {
            center: new google.maps.LatLng(45.813029,15.977895),  <!-- centar mape -->
            zoom: 14,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

    var google_map = new google.maps.Map(document.getElementById("map_canvas"), map_options);

    var info_window = new google.maps.InfoWindow({
        content: 'loading'
    });

    var t = [];
    var x = [];
    var y = [];
    var h = [];

    t.push('Klinček');
    x.push(45.812619);
    y.push(16.007195);
    h.push('<p><strong>Caffe bar Klinček</strong><br/>Cijena: 15kn (Ožujsko točeno)<br/> Adresa: Kušlanova 52</p>');


    var i = 0;
    for ( item in t ) {
        var m = new google.maps.Marker({
            map:       google_map,
            animation: google.maps.Animation.DROP,
            title:     t[i],
            position:  new google.maps.LatLng(x[i],y[i]),
            html:      h[i]

        });

        google.maps.event.addListener(m, 'click', function() {
            info_window.setContent(this.html);
            info_window.open(google_map, this);
        });
        i++;
    }
}

初始化();

【问题讨论】:

    标签: image google-maps google-maps-markers


    【解决方案1】:

    我从您上面发布的代码中修改了一段代码。

    var i = 0;
    var image1 = 'beachflag.png';
    var image2 = 'roadflag.png';
    var image3 = 'railflag.png';
    var image;
    for ( item in t ) {
    
         if(condition1){
          image = image1;
         }
         if(condition2){
          image = image2;
         }
         if(condition3){
          image = image3;
         }
         var m = new google.maps.Marker({
            map:       google_map,
            animation: google.maps.Animation.DROP,
            title:     t[i],
            position:  new google.maps.LatLng(x[i],y[i]),
            html:      h[i],
            icon: image
    
        });
        .........
    }//for loop ends
    

    欲了解更多信息https://developers.google.com/maps/documentation/javascript/overlays#Icons

    【讨论】:

    • 你很伤心我添加了这个var image = 'marker.png'; var image2 = 'marker2.png'; 现在我想让每个标记都有不同的图标,但我不知道怎么做。
    • 更具体地说,我想在地图上放置 3 个不同的图标。那么如何复制这个脚本(只是一部分)来制作 3 组标记,所以每组都有不同的标记。希望你明白...
    • 你是认真的 Hudo_zg 吗?你是说你不会写 if 语句?
    • 如果您不知道如何编写 if 语句,请查看上面的修改代码。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-10-11
    • 1970-01-01
    • 1970-01-01
    • 2014-12-08
    • 2015-09-12
    • 2011-04-03
    相关资源
    最近更新 更多