Я получил ответ на свой вопрос, как получить полилинию в центре, но вот проблема. Когда я хочу увидеть карту. Карта инициализируется только в верхнем левом углу моего div. И когда я вызываю эту функцию:
setTimeout(function() {
google.maps.event.trigger(map,'resize');
}, 200);
Я вижу карту во всем div, но полилиния не увеличена и находится в верхнем левом углу.
что я должен делать?
Мой код:
Глобальное определение:
var flightPlanCoordinates=[];
var flightPath;
var map;
var myLatLng = new google.maps.LatLng(0, 0);
var mapOptions = {
zoom: 5,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
Позже использовался код...
$.ajax({
type: 'POST',
url: 'history.php',
data: {
'd_year1':$('#select-choice-year1').val(),
'd_month1': $('#select-choice-month1').val(),
'd_day1':$('#select-choice-day1').val(),
'd_year2':$('#select-choice-year2').val(),
'd_month2': $('#select-choice-month2').val(),
'd_day2':$('#select-choice-day2').val()
},
success: function(data)//callback to be executed when the response has been received
{
if(data=="[]")
{
alert("None");
}else
{
data = JSON.parse(data);
for (var i=0;i<data.length;i++)
{
flightPlanCoordinates[i] = new google.maps.LatLng(data[i].x,data[i].y);
}
map = new google.maps.Map(document.getElementById("map_find"),
mapOptions);
flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
strokeColor: "#8a2be2",
strokeOpacity: 1.0,
strokeWeight: 3
});
flightPath.setMap(map);
zoomToObject(flightPath);
}
}
});
И функция масштабирования и центрирования полилинии:
function zoomToObject(obj){
var bounds = new google.maps.LatLngBounds();
var points = obj.getPath().getArray();
for (var n = 0; n < points.length ; n++){
bounds.extend(points[n]);
}
map.fitBounds(bounds);
setTimeout(function() {
google.maps.event.trigger(map,'resize');
}, 200);
}
Итак, как действительно инициализировать карту, чтобы она соответствовала всему div, и как масштабировать и центрировать полилинии, чтобы они соответствовали карте?