javascript 谷歌地图v3位于边界/地图的中心
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript 谷歌地图v3位于边界/地图的中心相关的知识,希望对你有一定的参考价值。
var map;
var distanceCircle;
var center;
function initialize() {
<?php
if (isset($item_info) && count($item_info) > 0) {
foreach ($item_info as $key => $result) {
if ($key == 0) {
$geo_lat = $result['latitude'][0];
$geo_lng = $result['longtitude'][0];
?>
center = new google.maps.LatLng(<?php echo $result['latitude'][$key]; ?>,
<?php echo $result['longtitude'][$key]; ?>);
<?php
break;
}
}
}
?>
var mapOptions = {
zoom: 10,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scrollwheel: false
};
map = new google.maps.Map(document.getElementById('search_map_div'),
mapOptions);
var position, marker;
var bounds = new google.maps.LatLngBounds();
<?php
if (isset($item_info) && count($item_info) > 0) {
foreach ($item_info as $key => $result) {
?>
position = new google.maps.LatLng(<?php echo $result['latitude'][$key]; ?>,
<?php echo $result['longtitude'][$key]; ?>);
marker = new MarkerWithLabel({
position: position,
map: map,
icon: normal_icon,
data_id: "search-result-" + "<?php echo $result['item_reference_id'][$key]; ?>",
labelAnchor: new google.maps.Point(2, 28)
});
bounds.extend(position);
places["search-result-" + "<?php echo $result['item_reference_id'][$key]; ?>"] = marker;
google.maps.event.addListener(marker, 'click', function () {
resetIcon();
setIcon(this, selected_icon);
$('.search-result').removeClass("highlight");
scrollToResultsTop(this.data_id);
map.setZoom(11);
});
<?php
}
}
?>
map.fitBounds(bounds);
}
function scrollToResultsTop(searchResultId) {
var searchContainer = $('#' + searchResultId);
searchContainer.addClass('highlight');
var searchContainerTop = searchContainer.offset().top;
var scrollTop = $(window).scrollTop();
$('html, body').animate({
scrollTop: searchContainerTop - 145
}, {
duration: 'slow',
easing: 'swing'
});
}
if (screen.width > 500) {
initialize();
}
$('.search-result').click(function () {
resetIcon();
var dataId = $(this).attr('data_id');
setIcon(places["search-result-" + dataId], selected_icon);
map.setCenter(places["search-result-" + dataId].position);
map.setZoom(12);
$('.search-result').removeClass("highlight");
$('.search-result-' + dataId).addClass("highlight");
});
$('.raty').raty({
score: function () {
return $(this).attr('data-score');
},
starHalf: "{{$iserp_data['webroot_uri']}}/static/icons/star-half.svg",
starOff: "{{$iserp_data['webroot_uri']}}/static/icons/star.svg",
starOn: "{{$iserp_data['webroot_uri']}}/static/icons/star-filled.svg",
readOnly: true,
click: function (score, evt) {
$('#rate').val(score);
}
});
// $('.like_button').click(function(){
// $('#loginModal').modal('show');
// });
//window.history.pushState("petsitters", "Petsitters", "{{$iserp_data['webroot_uri']}}/petsitters/Sydney-NSW-2000-Australia");
load_position_map();
$('.btn-popover').popover({
trigger: "hover focus",
html: true
});
//Window scroll.
$(window).scroll(function () {
load_position_map();
});
load_position_map();
});
function load_position_map() {
if ($('#search-result-container').length > 0) {
var position = $('#search-result-container').position().top;
var maxBottom = 0;
if ($('#pagination-block').offset()) {
maxBottom = $('#pagination-block').offset().top;
};
var scrollTop = $(window).scrollTop();
if (scrollTop > position - 50) {
if ((scrollTop + 500) < maxBottom) {
$('#search_map').removeAttr('style');
$('#search_map').addClass('fixed-position-map');
var position_now = scrollTop - position + 50;
$('#search_map').css('top', position_now + 'px');
} else {
var position_now2 = maxBottom - 450 - position;
$('#search_map').css('top', position_now2 + 'px');
}
} else {
$('#search_map').removeClass('fixed-position-map');
}
}
}
以上是关于javascript 谷歌地图v3位于边界/地图的中心的主要内容,如果未能解决你的问题,请参考以下文章
使用markerclusterer v3获取谷歌地图范围内的标记列表
如何使用 Google Maps JavaScript API v3 在谷歌地图中获取查看区域中心的坐标