开发者

google maps formatting text of a marker tooltip on multiple lines

开发者 https://www.devze.com 2023-03-23 13:16 出处:网络
How do I insert a newline into text of a marker tooltip. I am using \\n which doesn\'t seem to be working.

How do I insert a newline into text of a marker tooltip. I am using \n which doesn't seem to be working.

See code below:

mark = new google.maps.Marker({          
        map: map,             
        position: center,
        title:inspStates[i].name+ "\n"+"total: "+inspStates[i].totalIns开发者_StackOverflow社区p+ "\n"+ info,
        zIndex:3
});


Use single quotes (' ') instead of double quotes (" ")it will work, like this code.

mark = new google.maps.Marker({          
            map: map,             
            position: center,
            title:inspStates[i].name+ '\n total: '+inspStates[i].totalInsp+ '\n'+ info,
            zIndex:3
    });


When using a Marker, multiline text should be in the content not title. Also instead of \n you must use html's <br/>


I use \\n and this seems to work.


I used a customized google infoBox in place of the tooltip and it formatted properly see here: http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/examples.html


If you're using FireFox, I don't think there is an easy way. The problem is explained with brilliant simplicity here by one Blake Stephens:

To quote:

The title that's automatically generated from hovering over a marker is actually the standard HTML title attribute, which works the same way as the alt tag attribute on an image. It's not exactly easy to get multiple lines on one, since browsers decide for themselves when to get the line to wrap (so really long alt texts and titles can be readable, they wrap). I don't believe it's possible to forcibly insert a line break.

However, this does not stop you from circumventing the generic title text altogether and creating your own that's completely stylable. You can attach an even to the marker for the 'mouseover' event and generate a div tag filled with your content that follows the mouse around; removing/destroying/hiding itself when the 'mouseout' event fires. That seems like the most reliable way to me.

0

精彩评论

暂无评论...
验证码 换一张
取 消