Googlemaps获得抵消 [英] Googlemaps getting offset
本文介绍了Googlemaps获得抵消的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
嗨每个人都曾经在jquery选项卡系统中尝试过类似的事件
，它可以单独运行或者在网站上的任何其他地方运行，但是当它在一个选项卡中时，它会以一种奇怪的方式得到这个偏移量！ b
$ b
如果您尝试过或有解决方案，请将其张贴
<％if（RentalCaseMap.Any（）） {％>
< div id =Kortclass =tab-content>
< div id =rental_map_canvasstyle =width：656px; height：270px>< / div>
< script type =text / javascriptsrc =/ scripts / rentalmap.js>< / script>
< / div>
<％}％>
....
< input type =hiddenid =HiddenGeoLatvalue =<％= CurrentContent.GeoLat％> />
< input type =hiddenid =HiddenGeoLngvalue =<％= CurrentContent.GeoLng％> />
然后脚本文件
$（window）.load（function（）{
initialize（）;
}）;
函数initialize（）{
var jeudanStyles = [{featureType：all，elementType：all，stylers：[{saturation：-99}]}];
var jeudanMapType = new google.maps.StyledMapType（jeudanStyles，
{name：Jeudan}）;
var myOptions = {
zoom：16，
disableDefaultUI：true，
mapTypeId：google.maps.MapTypeId.ROADMAP，
mapTypeControl：false，
mapTypeControlOptions：{
style：google.maps.MapTypeControlStyle.HORIZONTAL_BAR，
position：google.maps.ControlPosition.BOTTOM_CENTER
}，
panControl：true，
panControlOptions：{
position：google.maps.ControlPosition.TOP_RIGHT
}，
zoomControl：true，
zoomControlOptions：{
style：google.maps.ZoomControlStyle .LARGE，
位置：google.maps.ControlPosition.LEFT_CENTER
}，
scaleControl：false，
scaleControlOptions：{
位置：google.maps.ControlPosition.BOTTOM_CENTER
}，
streetViewControl：true，
streetViewControlOptions：{
position：google.maps.ControlPosition.BOTTOM_CENTER
}
};
if（document.getElementById（rental_map_canvas）！= null）{
var map = new google.maps.Map（document.getElementById（rental_map_canvas），myOptions）;
map.mapTypes.set（'jeudan_map'，jeudanMapType）;
map.setMapTypeId（'jeudan_map'）;
var locations = [
{lat：55.680884，lng：12.581577，content：'< div class =jeudanparkering> Addresse：Gammel M& os nt; nt 1 - 3< > Mandag -l& oslash; rdag 06.30-21.00。< br />< a href =../ priser-og-aabningstider />更多信息...< / a><< ; / div>'}
];
var marker，i;
var image = new google.maps.MarkerImage（'/ images / maps-logo-small.png'，新的google.maps.Size（35，40），新的google.maps.Point 0，0），new google.maps.Point（35，40））;
var shadow = new google.maps.MarkerImage（'/ images / maps-logo-shadow-small.png'，新的google.maps.Size（74，37），新的google.maps.Point（0， 0），新的google.maps.Point（34，37））;
var shape = {
coord：[1，1，40，35，40，35，1]，
类型：'poly'
};
var infowindow = new google.maps.InfoWindow（）;
for（i = 0; i< locations.length; i ++）{
marker = new google.maps.Marker（{
position：new google .maps.LatLng（$（＃HiddenGeoLat）。val（），$（＃HiddenGeoLng）。val（）），/ * new google.maps.LatLng（locations [i] .lat，locations [i] .lng），* /
map：地图，
阴影，
图标：图片，
动画：google.maps.Animation.DROP，
形状：形状
}）;
marker.content = locations [i] .content;
google.maps.event.addListener（marker，'click'，function（）{
infowindow.setContent（this.content）;
infowindow.open（map，this ）;
}）;
map.setCenter（marker.position）;
}
};
}
解决方案
<$ c点击（函数（）{
google.maps.event.trigger（map，'resize'）;
map.setCenter（marker.position）;
}）;
Hey everyone anyone ever tried similar incident its inside a jquery tab system and it works alone or any other place at the website but when inside a tab its getting this offset in some weird manner!
if you tried it or have a solution please post it
<% if (RentalCaseMap.Any()) { %>
<div id="Kort" class="tab-content">
<div id="rental_map_canvas" style="width:656px; height:270px"></div>
<script type="text/javascript" src="/scripts/rentalmap.js"></script>
</div>
<% } %>
....
<input type="hidden" id="HiddenGeoLat" value="<%=CurrentContent.GeoLat %>" />
<input type="hidden" id="HiddenGeoLng" value="<%=CurrentContent.GeoLng %>" />
Then script file
$(window).load(function () {
initialize();
});
function initialize() {
var jeudanStyles = [{ featureType: "all", elementType: "all", stylers: [{ saturation: -99}]}];
var jeudanMapType = new google.maps.StyledMapType(jeudanStyles,
{ name: "Jeudan" });
var myOptions = {
zoom: 16,
disableDefaultUI: true,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
position: google.maps.ControlPosition.BOTTOM_CENTER
},
panControl: true,
panControlOptions: {
position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE,
position: google.maps.ControlPosition.LEFT_CENTER
},
scaleControl: false,
scaleControlOptions: {
position: google.maps.ControlPosition.BOTTOM_CENTER
},
streetViewControl: true,
streetViewControlOptions: {
position: google.maps.ControlPosition.BOTTOM_CENTER
}
};
if (document.getElementById("rental_map_canvas") != null) {
var map = new google.maps.Map(document.getElementById("rental_map_canvas"), myOptions);
map.mapTypes.set('jeudan_map', jeudanMapType);
map.setMapTypeId('jeudan_map');
var locations = [
{ lat: 55.680884, lng: 12.581577, content: '<div class="jeudanparkering">Addresse: Gammel Mønt 1 - 3<br />Mandag - lørdag 06.30-21.00.<br /><a href="../priser-og-aabningstider/">Mere info...</a></div>' }
];
var marker, i;
var image = new google.maps.MarkerImage('/images/maps-logo-small.png', new google.maps.Size(35, 40), new google.maps.Point(0, 0), new google.maps.Point(35, 40));
var shadow = new google.maps.MarkerImage('/images/maps-logo-shadow-small.png', new google.maps.Size(74, 37), new google.maps.Point(0, 0), new google.maps.Point(34, 37));
var shape = {
coord: [1, 1, 1, 40, 35, 40, 35, 1],
type: 'poly'
};
var infowindow = new google.maps.InfoWindow();
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng($("#HiddenGeoLat").val(), $("#HiddenGeoLng").val()), /*new google.maps.LatLng(locations[i].lat, locations[i].lng),*/
map: map,
shadow: shadow,
icon: image,
animation: google.maps.Animation.DROP,
shape: shape
});
marker.content = locations[i].content;
google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent(this.content);
infowindow.open(map, this);
});
map.setCenter(marker.position);
}
};
}
解决方案
$("#liKort").click(function () {
google.maps.event.trigger(map, 'resize');
map.setCenter(marker.position);
});
这篇关于Googlemaps获得抵消的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
