信息窗口中的文本显示不一致

Question

我有一个 google 地图，带有标记和很少创建的信息窗口。信息窗口的文本来自 XML 文档。显示地图时，一些信息窗口会显示所有文本，而另一些则不会。例如，一些较长的文本显示 XML 中所写的内容，而一些较短的文本字符串不显示最后四个字符。所有的信息窗口都应该以 Trocken Bach 结尾。下面是一个示例（注意：我还不能包含图片。您可以在以下位置查看：http://tbk-dk.com/dogMapMarkers/markers.html）：

显示不完整：Cira vom Trocken 但 XML 文档包含的文本 Cira vom Trocken Bach 比下一个示例短。

完整显示：Franci vom Trocken Bach 显示在 XML 文档中找到的全文，但此文本比上一个文本长。

下面是我开发的代码：

$(document).ready(function() {
  $("#map").css({
        height: 700,
        width: 800
});
var myLatLng = new google.maps.LatLng(xxxx, xxxx);
  MYMAP.init('#map', myLatLng, 11);

  $("#showmarkers").ready(function(e){
        MYMAP.placeMarkers('dog-markers.xml');
  });
});

var MYMAP = {
  map: null,
    bounds: null
}

MYMAP.init = function(selector, latLng, zoom) {
  var myOptions = {
    zoom:zoom,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  this.map = new google.maps.Map($(selector)[0], myOptions);
    this.bounds = new google.maps.LatLngBounds();
}

MYMAP.placeMarkers = function(filename) {
    $.get(filename, function(xml){
        $(xml).find("marker").each(function(){
            var name = $(this).find('name').text();
            var address = $(this).find('address').text();

        // create a new LatLng point for the marker
        var lat = $(this).find('lat').text();
        var lng = $(this).find('lng').text();
        var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));

        // extend the bounds to include the new point
        MYMAP.bounds.extend(point);

        var marker = new google.maps.Marker({
            position: point,
            map: MYMAP.map
        });

        var infoWindow = new google.maps.InfoWindow();
        var html='<strong>'+name+'</strong.><br />'+address;
        google.maps.event.addListener(marker, 'mouseover', function() {
            infoWindow.setContent(html);
            infoWindow.open(MYMAP.map, marker);

        });
        google.maps.event.addListener(marker,'mouseout', function() {
    infoWindow.close();
});


        MYMAP.map.fitBounds(MYMAP.bounds);
    });
});
}

感谢大家帮助解决这个问题。

jsfiddle

Answer 1

尝试将属性 white-space:nowrap 添加到强标签中

信息窗口中的文本显示不一致

Text display in infowindow inconsistant

google-maps

google-maps-api-3

markers