Google Maps API

Status
Not open for further replies.

Eric S

Demoted Webmaster
Jul 12, 2005
2,944
2,096
113
Tustin
www.everydayflowers.net
State / Prov
CA
Okay I know I am going to get laught at on this one.

How do i make my text blod in the info window using google maps api?

Here is the part of HTML Code

map.openInfoWindow(map.getCenter(),
document.createTextNode("Everyday Flowers"));

I have tried this

map.openInfoWindow(map.getCenter(),
document.createTextNode(<b>"Everyday Flowers"</b>));

But I can't get it to go bold.

Here is the web page
 
Actually, don't you need to use:

map.addOverlay(marker);
//marker.openInfoWindowTabsHtml(infoTabs);
marker.openInfoWindowHtml("<strong>Everyday Flowers</strong><br>15021 Red Hill, Suite F<br>Tustin CA<br>714-258-7293");
//map.openInfoWindow(map.getCenter(), document.createTextNode("Everyday Flowers, 15021 Red Hill, Suite F, Tustin CA"));


I'm not a programer Eric, but I think you need the word <strong> instead of bold or <b>

I also decorated your marker some...
Mary Lou

.
 
It still dosen't like me.

I have tried adding the code that you both provided. I also tried to add <strong> to the beginning and (/strong) to the end inside and outside the () and Inbetween " ". Also <b> and at the end </b) I just don't get it.

The (br) is suppose to start a new line and all it does is add it to the title.

Any other suggestions?

(<b>"Everyday Flowrs"</b>)
("<b>Everyday Flowers</b>")
<b>("Everyday Flowers")</b>

Tried The word strong as well...
 
Eric I checked the source of your page and your "everyday flowers" code in the javascript section is not showing the <b> tags...are you sure you are updating the right code on your server??

For SURE "<b>Everyday Flowers</b>" should work! If nothing else you would see the tags in the page code...that makes me think that you are not coding the correct file...do a test and add some text to the "everyday flowers" area and make sure that it shows the extra text...
 
I re did it. I removed the code so no one would see the errors.

This is what it should be and I did try it with stong as well. It seems that its not obeying any codes at all.

Here is the code right now

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAToa8ekoQsdWNj-OGCcgZvhRKd4rS3K5Uz9VxTy4iejjoPEWp1xQzzdrn7E-6qnI1hscHeidjHhOVmg"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl())
map.setCenter(new GLatLng(33.720746,-117.827556), 13);
map.openInfoWindowHtml(map.getCenter(),
document.createTextNode("<b>Everyday Flowers</b><br>15012 Red Hill Ave Suite F<br>Tustin, CA 92780"));
}
}
//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 550px; height: 350px"></div>
</body>
</html>
 
I re did it. I removed the code so no one would see the errors.

This is what it should be and I did try it with stong as well. It seems that its not obeying any codes at all.

Here is the code right now

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAToa8ekoQsdWNj-OGCcgZvhRKd4rS3K5Uz9VxTy4iejjoPEWp1xQzzdrn7E-6qnI1hscHeidjHhOVmg"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl())
map.setCenter(new GLatLng(33.720746,-117.827556), 13);
map.openInfoWindowHtml(map.getCenter(),
document.createTextNode("<b>Everyday Flowers</b><br>15012 Red Hill Ave Suite F<br>Tustin, CA 92780"));

}
}
//]]>
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 550px; height: 350px"></div>
</body>
</html>

needs to read...(replace blue with red)



//marker.openInfoWindowTabsHtml(infoTabs);
marker.openInfoWindowHtml("<strong>Everyday Flowers</strong><br>15012 Red Hill Ave Suite F<br>Tustin CA<br>714-258-7293");

//map.openInfoWindow(map.getCenter(), document.createTextNode("Everyday Flowers,15012 Red Hill Ave Suite F,Tustin CA 92780"));


 
I am really at a lost. It should work and it just isn't behaving the way it should. Everything else works perfect expcept when I try to altar the contents of the info window. There is a reference on the Google Api Documentation page with an example of creating the contents in bold.

GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml("Marker #<b>" + number + "</b>");


Perhaps this only works with the marker.openInfoWindow and not with the map.openInfoWindow

I will try a new one tonight and see if I can figure out the problem.

I have also had to create a link for problems viewing the maps with a different domain.
The maps will not work if you are looking at www.everydayflowers.com if your api key is regerested for everydayflowers.net. And of course they issue different keys for each domain.
 
Ok, we're bound to be able to figure this out...

Look at this example...I think he did what you are trying to do...

http://www.wildsalmoncenter.org/about/directions.php

Here is his coding...
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAw7q0NJy4wEu_PKsFS9CLrRSbg8WiBs6NjTch06ykVNw9vNBnvhSGF_Tn2MCmMKQctAFcjn0vGrVRoQ" type="text/javascript"></script>

<script type="text/javascript">

//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("directionsToWSC"));
map.addControl(new GSmallMapControl());
map.setCenter(new GLatLng(45.528187,-122.680291), 15);
// Our info window content
// Place a marker in the center of the map and open the info window
// automatically
var marker = new GMarker(map.getCenter());
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowTabsHtml(infoTabs);
});
map.addOverlay(marker);
//marker.openInfoWindowTabsHtml(infoTabs);
marker.openInfoWindowHtml("<strong>Wild Salmon Center</strong><br>721 NW 9th Ave, Suite 300<br>Portland OR<br>503-222-1804");
//map.openInfoWindow(map.getCenter(), document.createTextNode("Wild Salmon Center,721 NW 9th Ave, Portland OR"));

}
}

//]]>
</script>




Look what his guy did with his...He added a .jpg file for his logo

http://www.blogas.lt/polyetilen/

Here is his coding...
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAwLBma8rU1z-VFJpkr8ZTfBQMcnbMocCfpba5exyAYCA49-QZUxTBwXl63ANDava6-M2feBaUwS8_Yg"
type="text/javascript"></script>

<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GOverviewMapControl());

map.setCenter(new GLatLng(54.71794444, 25.2480638888),17, G_SATELLITE_MAP);

map.openInfoWindowHtml (map.getCenter(), '<div style="text-align: center;"><img src="http://www.blogas.lt/uploads/polyetilen_polyetilen_logo.jpg" border="1"><br><span style="font-size: 11px;font-family: Georgia;">Lietuva, Vilnius, �e�kin�</span></div>');

GEvent.addListener(map, "moveend", function() {
var center = map.getCenter();
document.getElementById("message").innerHTML = 'Koordinat�s: ' + center.toString();
});

}
}
//]]>
</script>

.
 
Status
Not open for further replies.