0

車両の位置を示すためにアイコンを回転させようとすると、少し奇妙な問題が発生します。私のjsonには車両の方位が含まれており、車両が動いている場合、方位はmovingVehicleオブジェクトに渡され、マーカーの作成時に使用されます。私が抱えている問題は、すべてのマーカーが 200 度になっていることです。コードをステップ実行したところ、正しい方位がアイコン プロパティの一部として渡されていることがわかりましたが、スクリプトが終了してすべてのマーカーが描画されると、それらはすべて 200 度になります。

明らかな何か?

var map;
var markersArray = [];

var mapOptions = {
                    zoom: 8,
                    center: new google.maps.LatLng(52.68, -1.26),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var movingVehicle = {
                    path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
                    fillColor: "green",
                    fillOpacity: 1,
                    scale: 3,
                    strokeColor: "green",
                    strokeWeight: 1,
                    rotation:0
};

var staticVehicle = {
                    path: google.maps.SymbolPath.CIRCLE,
                    fillColor: "red",
                    fillOpacity: 1,
                    scale: 3,
                    strokeColor: "red",
                    strokeWeight: 5
};

function vehicleState(speed,bearing){
    if (speed){
        movingVehicle.rotation = bearing;
        return movingVehicle;
    }
    else
    {
        return staticVehicle;
    }
};

$(function(){
    map = new google.maps.Map(document.getElementById("mapContainer"), mapOptions);

    $.getJSON( PATH_TO_MY_JSON_WOULD_BE_HERE, function(data) { 
        $.each( data.vehicles, function(i, vehicle) {
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(vehicle.lat, vehicle.long),
                title:vehicle.vehicle,
                draggable: false,
                map: map,
                icon: vehicleState(vehicle.speed,vehicle.bearing)
            });
            markersArray.push(marker);
        });
    });

});

サンプル json

{"vehicle":"xxxxLCJ","time":"2013-01-25T18:33:19","lat":53.47766,"long":-2.335671,"speed":24.5562,"bearing":231},
{"vehicle":"xxxxLCN","time":"2013-01-25T15:07:36","lat":52.45257,"long":1.604016,"speed":36.4176,"bearing":138},
{"vehicle":"xxxxLCP","time":"2013-01-25T23:17:12","lat":53.24011,"long":-0.554743,"speed":0,"bearing":0},
4

1 に答える 1

0

これが正しい方法かどうかはわかりませんが、表示するアイコンを決定しながらオブジェクトを複製することで解決しました。

    function Clone(x) {
       for(p in x)
       this[p] = (typeof(x[p]) == 'object')? new Clone(x[p]) : x[p];
    };

    function vehicleState(speed,bearing){
        if (speed){
            var icon = new Clone(movingVehicle);
            icon.rotation = bearing;
            return icon;
        }
        else
        {
            var icon = new Clone(staticVehicle);
            return icon;
        }
    };
于 2013-01-27T12:37:57.240 に答える