百度地圖API 自定義標注圖標

通過Icon類可實現自定義標注的圖標，下面示例通過參數MarkerOptions的icon屬性進行設置， 
也可以使用marker.setIcon()方法。

<script type="text/javascript">
    // 百度地圖API功能
    var map = new BMap.Map("allmap");    // 創建Map實例
    map.centerAndZoom(new BMap.Point(116.323066,39.989956), 16);  // 初始化地圖,設置中心點坐標和地圖級別
    map.addControl(new BMap.MapTypeControl());   //添加地圖類型控件
    map.setCurrentCity("北京");          // 設置地圖顯示的城市 此項是必須設置的
    map.enableScrollWheelZoom(true);     //開啟鼠標滾輪縮放

    var points = [
        [116.316967,39.990748],
        [116.323938,39.989919],
        [116.328896,39.988039],
        [116.321135,39.987072],
        [116.332453,39.989007],
        [116.324045,39.987984],
        [116.322285,39.988316],
        [116.322608,39.986381]
    ];
    // 向地圖添加標注
    for( var i = 0;i < points.length; i++){
        var myIcon = new BMap.Icon("http://7xic1p.com1.z0.glb.clouddn.com/markers.png", new BMap.Size(23, 25), {
            // 指定定位位置
            offset: new BMap.Size(10, 25),
            // 當需要從一幅較大的圖片中截取某部分作為標注圖標時，需要指定大圖的偏移位置   
            imageOffset: new BMap.Size(0, 0 - i * 25) // 設置圖片偏移  
        });
        var point = new BMap.Point(points[i][0],points[i][1]);
        // 創建標注對象並添加到地圖 
        var marker = new BMap.Marker(point,{icon: myIcon});
        map.addOverlay(marker);
    };

</script>

所使用圖片：

演示地址：點擊