单击标记时,infowindow在我的地图上显示不正确.该网站在这里.
您还会注意到地图控件也未正确显示.
var map;
var locations = <?php print json_encode(di_get_locations()); ?>;
var markers = []
jQuery(function($){
var options = {
center: new google.maps.LatLng(51.840639771473, 5.8587418730469),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), options);
for (var i=0; i < locations.length;i++) {
makeMarker(locations[i]);
}
centerMap();
});
function makeMarker(location) {
var markerOptions = {map: map, position: new google.maps.LatLng(location.lat, location.lng)};
var marker = new google.maps.Marker(markerOptions);
markers.push(marker);
var content = '';
var infowindow = new google.maps.InfoWindow(
{ content: "test",
size: new google.maps.Size(50,50),
disableAutoPan : …Run Code Online (Sandbox Code Playgroud) 出于某种原因,InfoWindow正在显示滚动条以及内容,我试图将自定义宽度和高度设置为InfoWindow,但它没有显示出来.我尝试了Google Map Infowindow无法正常显示的解决方案
请参考以下链接 http://server.ashoresystems.com/~contacth/index.php?option=com_business&view=categoryresult&catid=2
谢谢你的帮助.
我需要更改谷歌地图infoWindow的宽度和高度,我看到了这个主题谷歌地图.InfoWindow设置高度和宽度.我发现它的解决方案不起作用.即使是标准infoWindow = new google.maps.InfoWindow({maxWidth: '50px'})也不会起作用.
那么什么是解决方案?如何改变infoWindow的宽度和高度?
我使用谷歌地图javascript V3 API来显示地图.但我对地图气泡有问题.当气泡中的信息超过特定高度时,它会将滚动条插入气泡中.
如何删除这些滚动条并根据其内容为气泡指定动态宽度和高度?
或者我如何设计我自己的自定义气泡,使其根据内容的宽度和高度动态?
提前致谢.
这是JavaScript:
$(document).ready(function(){
//set location of san antonio
var san_antonio = new google.maps.LatLng(29.4, -98.544);
//set infowindow
var infoWindow;
//object literal containing the properties
var options = {
zoom: 9,
center: san_antonio,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
//create the map
var map = new google.maps.Map(document.getElementById('map'), options);
//create marker
var marker = new google.maps.Marker({
position: san_antonio,
map:map,
title: "san antonio"
});
//add 'click' event listener
google.maps.event.addListener(marker, 'click', function(){
//creates infowindow if it already doesn't exist
if (!infoWindow){
infoWindow = new google.maps.InfoWindow();
}
//create content for …Run Code Online (Sandbox Code Playgroud) 我有一个问题,我的InfoWindows显示不正确 - 它显示滚动条虽然它不应该(但只是第一次)!
在我的页面上,我有很多折线路线,我为每条路线添加了一个标记/ InfoWindow.添加了很多标记(在Ajax调用中循环).
这是我对InfoWindow的定义(循环前的单个实例):
// Define an info window
var infowindow = new google.maps.InfoWindow( { content: "" } );
Run Code Online (Sandbox Code Playgroud)
这是在我的循环中我添加标记:
// Set a marker on the last known position
var marker = new google.maps.Marker({
position: lastLatLng,
title: "My text",
map: map,
icon: iconCar
});
// Click on a marker to open an info window
google.maps.event.addListener(marker,"click",function() {
infowindow.open(map,this);
infowindow.setContent(this.title);
});
Run Code Online (Sandbox Code Playgroud)
当我第一次打开地图时(在每个新的浏览器实例中)我注意到InfoWindow的标记/显示有一个滚动条 - 我没有把它放在那里也不应该在那里,因为文本不是那样的长.
错误(使用滚动条):

下次(以及以下所有内容)我单击它,它没有滚动条就能正确显示.
正确(没有滚动条):

我没有为Google Maps条目指定任何CSS,即使这样每次都应该显示错误,而不仅仅是第一次.
我已尝试过这个问题的所有技巧,Google Maps API v3:InfoWindow没有正确调整大小,但似乎没有解决我的问题.
请看这个显示我的问题的小提琴演示.如果我关闭所有(Chrome)浏览器,转到小提琴并单击路线(第一次点击),我每次都可以重现错误.然后它会第一次显示滚动条但只是第一次显示.
css jquery google-maps google-maps-api-3 google-maps-markers
我一直在使用http://gmaps-samples-v3.googlecode.com/svn/trunk/infowindow_custom/infowindow-custom.html中的代码,这是目前google如何在Maps API v3中创建自定义InfoWindow的最佳示例.我一直在努力,到目前为止,我已经接近工作,除了一件事,它的div容器文本内容不会扩展以适应内容,所以它只是下降而不是扩大泡沫.如果我给内容容器一个固定的像素宽度它工作正常,但我无法根据其中的文本数量进行扩展.
我已经坚持了一段时间.任何帮助将不胜感激!
这是HTML页面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Gayborhood Map Test</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { width: 900px;
height: 400px;
margin: 200px auto 0 auto; }
</style>
<link rel="stylesheet" type="text/css" href="map.css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="InfoBox.js"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(39.947137,-75.161824);
var myOptions …Run Code Online (Sandbox Code Playgroud) 我一直在尝试使用Google Maps API,但是我遇到了InfoWindow的问题...它似乎总是太小而无法容纳我放在其中的内容,因此我的内容溢出InfoWindow以外的内容地图:

如果InfoWindow中的内容是动态的或静态的,大或小,内容周围的白框总是有点太小,似乎没有什么区别.
这是我正在测试的代码:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map-canvas { height: 100% }
</style>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDuV-Jyz8N6b1fVUVCa1EnbPzgeCs9J5_o&sensor=true"></script>
<script type="text/javascript">
var districts = [
{
name: 'Test Spot 1',
latitude: 29.680894,
longitude: -82.298584
},
{
name: 'Test Spot 2',
latitude: 28.323725,
longitude: -80.713806
}
],
addDistrictMarker = function(district, map, infoWindow) {
var position = new google.maps.LatLng(district.latitude, district.longitude), …Run Code Online (Sandbox Code Playgroud) 我有一个宽度为225的map_canvas.
我希望我的信息框小于此(例如150 px).
这可能吗?我尝试了maxWidth并添加了样式,但似乎没有任何效果.
屏幕(在imgshack上)可以在下面找到:alt text http://img121.imageshack.us/img121/8317/gmaps.png
另外,我正在使用谷歌地图的v3
使用Javascript:
var results_coods;
var map_2;
var marker_2;
var infowindow_2;
function call_gmap()
{
if($('#map_text').attr('lat')){
var lat = Number($('#map_text').attr('lat').replace(",","."));
var lng = Number($('#map_text').attr('long').replace(",","."));
initialize(lat,lng);
/*
var lat= '51.0153389';
var lng = '2.7253832';
*/
}
}
function initialize(lat,lng) {
var latlng = new google.maps.LatLng(lat,lng);
var myOptions = {
zoom: 13,
center: latlng,
disableDefaultUI: true,
navigationControl: true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
draggable: false,
scaleControl: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var infowindow …Run Code Online (Sandbox Code Playgroud)