Question

function fetchHistory() {
page++;
var url = '/tracking/records/fetch'
    + '?from_hr=' + from_hr
    + '&to_hr=' + to_hr
    + '&from_mn=' + from_mn
    + '&from_am=' + from_am
    + '&to_am=' + to_am
    + '&to_mn=' + to_mn
    + '&date=' + date
   + '&page=' + page
    + '&id=' + user_id
    + '&type='+type;



$.get(url, function(response) {

    var repeat = false;
    if (response.status == 1) {
    places = [];

    for (var k in response.data) {
      if (response.data[k].length > 0) {
        for (var i in response.data[k]) {
          //console.log(response.data[k][i]);
          places.push({lat:response.data[k][i].lat,lng:response.data[k][i].lng,when:response.data[k][i].when});
        }

             }
         }

    }

    checkForFirst();//using initial location for once only
    if(!marker)
    {
    marker = new google.maps.Marker({
        position: {lat:Number(places[0].lat),lng:Number(places[0].lng)},
        title: 'Hyper Systems Ltd.',
        map: map,
        icon: icon,
        duration: 1000,
    });
  }

    var way = [];
    for (var i = 1; i < places.length - 1; i++) {
       way.push({
           location: new google.maps.LatLng(places[i].lat, places[i].lng),
           stopover: false,
       });
   }

   var st = new google.maps.LatLng(places[0].lat, places[0].lng);
   //console.log(st);
   var en = new google.maps.LatLng(places[places.length - 1].lat, places[places.length - 1].lng);
   dirService.route({
       origin: st,
       destination: en ,
       travelMode: google.maps.DirectionsTravelMode.DRIVING,
       waypoints: way

   }, function(response, status) {
       if (status == google.maps.DirectionsStatus.OK) {
          renderer.setDirections(response);
           var bound = new google.maps.LatLngBounds();
           console.log(bound);
           var route = response.routes[0];
           var legs = route.legs;
           for (var i = 0; i < legs.length; i++) {
               var steps = legs[i].steps;

               for (var j = 0; j < steps.length; j++) {
                   var path = steps[j].path;

                   for (var k = 0; k < path.length; k++) {
                       polyline.getPath().push(path[k]);
                       bound.extend(path[k]);

                   }
               }
           }
           bound.extend(st);
           bound.extend(en);
           distance = polyline.Distance();
           animate(1);
                    }
   });
});

}

以下是为标记设置动画的方法

function animate(d) {
     if(distance<=20)
    {
      console.log(distance+'m--Less than 20m distance.car was not moved');
      return
    }
    if (d > distance) {
        var end = getEndLocation();
        console.log("end: ", distance);
        map.panTo(end);
        marker.setPosition(end);
        return;
    }
    var p = polyline.GetPointAtDistance(d);
    var lastPosn = marker.getPosition();
    marker.setPosition(p);
    var heading=google.maps.geometry.spherical.computeHeading(lastPosn, p);
    var icon = marker.getIcon();
    icon.rotation = heading;
    marker.setIcon(icon);
    timerHandle = setTimeout("animate(" + (d+2.7)+ ")", 10);
}

问题是，在标记/车辆动画期间，如果我放大太多，那么我再也看不到标记了。我需要将地图平移为超过当前缩放级别。

我见过

bound.extend（start_lat_lng）; bound.extend（end_lat_lng）;
map.fitBounds（结合）;

这种方式人们解决了这个问题，但是如何在我当前的代码中实现呢？

平移谷歌地图作为标记动态移动

0 个答案: