Google Maps API: перемещать центр карты в позицию на моей странице? ⇐ Html

[Anonymous]

Может быть, есть решение для этого: < /p>
Я использую API GMAP, чтобы внедрить карту, лежащую в основе наложения, которое у меня есть в верхней части моей карты. В наложении есть небольшая стрелка с правой стороны, и я хочу, чтобы мой маркер карты был расположен на этом этапе (или несколько пикселей рядом с ней)
Я знаю, что можно использовать Infowindow Gmaps, но у меня есть это так. На странице, но я не знаю, как перемещать или pan Центр карт в это пиксельное назначение.
window.onload = function() {
var myOptions = {
center: new google.maps.LatLng(47.259998, 11.398032),
zoom: 17,
mapTypeId: google.maps.MapTypeId.ROADMAP,
disableDefaultUI: true
};

var map = new google.maps.Map(document.getElementById("map"), myOptions);

var marker = new google.maps.Marker({
position: new google.maps.LatLng(47.260071, 11.404705),
map: map,
});

console.log( $("#arrow").offset().top );
}
< /code>
< /p>

Обновление: < /p>
Это код, который у меня есть в моей странице-template. У меня есть последняя проблема, хотя. Если на моей странице ширина, скажем, 1440px, позиция маркера относительно моей маленькой стрелки работает просто хорошо:

, как скоро я сзади, на странице, и в ближайшее время, и нагрузка на страницу. За наложением и не расположено относительно маленькой стрелки.

google.maps.event.addDomListener(window, 'load', initMap);

window.onresize = function() {
positionMap();
}

function initMap() {
var myOptions = {
center: new google.maps.LatLng(47.260071, 11.404705),
zoom: 17,
mapTypeId: google.maps.MapTypeId.ROADMAP,
disableDefaultUI: true,
draggable: false,
mapTypeControl: false,
zoomControl: false,
scaleControl: false,
scrollwheel: false
};

var map = new google.maps.Map(document.getElementById("map"), myOptions);

var marker = new google.maps.Marker({
position: new google.maps.LatLng(47.260071, 11.404705),
map: map,
title: 'Österreichisches Rotes Kreuz Innsbruck'
});
}

function positionMap() {
var arrowPos = $("#map-center").position();
console.log(arrowPos);

var getPixelOffset = function(map, marker) {
// Calculate marker position in pixels form upper left corner
var scale = Math.pow(2, map.getZoom());
var nw = new google.maps.LatLng(
map.getBounds().getNorthEast().lat(),
map.getBounds().getSouthWest().lng()
);
var worldCoordinateNW = map.getProjection().fromLatLngToPoint(nw);
var worldCoordinate = map.getProjection().fromLatLngToPoint(marker.getPosition());
var pixelOffset = new google.maps.Point(
Math.floor((worldCoordinate.x - worldCoordinateNW.x) * scale),
Math.floor((worldCoordinate.y - worldCoordinateNW.y) * scale)
);
return pixelOffset;
};

// Wait until the map is initialized
var listener = google.maps.event.addListener(map, "idle", function() {
var pixelOffset = getPixelOffset(map, marker);

// Do the pan
map.panBy( Math.abs( pixelOffset.x - ( arrowPos.left ) - 150 ),
Math.abs( pixelOffset.y - ( arrowPos.top ) ) - 50 );

google.maps.event.removeListener(listener);
});
}


Подробнее здесь: https://stackoverflow.com/questions/298 ... on-my-page