How to display custom icon in Maps V3 using KML KMZ

[Cidney]

Hi, Please help.

I have four KML files. And I am using them in Maps API V3 (see code
below). Everything worked fine, but I am not able to display each KML
files with a custom icon. For example, KML file 1 should use a green
icon, KML file 2 should use a blue icon, KML file 3 should use a
purple icon, and KML file 4 should use a red icon. I also try using
KMZ with icons zip up inside, changes the src code to those custom
icons. but still don't work in Maps V3. Strangely, all these files are
able to display custom icons in Google Earth, just not Maps V3.

Here are my codes.

<script type="text/javascript">

var map;
var toggleState =new Array();
toggleState[0]=0;
toggleState[1]=1;
toggleState[2]=1;
toggleState[3]=1;

// Not using the next two lines below for now.
var image = new Array();
image[0]="http://labs.google.com/ridefinder/images/mm_20_green.png";

var stipEnv = new google.maps.KmlLayer("https://sites.google.com/site/
ctd4gis/Home/files/stip_env_pts.kml");
var stipDesign = new google.maps.KmlLayer("https://sites.google.com/
site/ctd4gis/Home/files/stip_design_pts.kml");
var stipRtl = new google.maps.KmlLayer("https://sites.google.com/site/
ctd4gis/Home/files/stip_rtl_pts.kml");
var stipConst = new google.maps.KmlLayer("https://sites.google.com/
site/ctd4gis/Home/files/stip_const_pts.kml");

function initialize() {
var latlng = new google.maps.LatLng(37.789879, -122.390442);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP

};
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
stipEnv.setMap(map);

}

function loadStip(num,stipPhase) {
if (toggleState[num] == 1) {
stipPhase.setMap(map);
toggleState[num] =0;
} else {
stipPhase.setMap();
toggleState[num] =1;
}
}

</script>

[Grok Lobster]

Check the Style settings of the kml files. It is likely that they are
pointing at local files (C:/blah/blah/blah...)

[Cidney]

Thanks for your reply Grok.
I checked, but the kML files looks alright to me. They are not ref to
my C drive or anything.
feel free to download any one of the KMLs to check.

Here are the codes from the first KML files.
Again, the custom icon works in Google Earth, just not in Maps V3 (at
least my V3 codes).

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document>
<Style id="greenStyle">
<IconStyle>
<Icon><href>http://google-maps-icons.googlecode.com/files/
animals.png</href></Icon>
<scale>1.000000</scale>
</IconStyle>
</Style>

<Placemark>
<name>my icon placemark</name>
<styleUrl>#greenStyle</styleUrl>

<description>This is the desp, testing icon for V3.</description>
<Point>
<coordinates>-122.0822035425683,37.42228990140251,0</
coordinates>
</Point>
</Placemark>

</Document>
</kml>

[Grok Lobster]

When I try to load http://google-maps-icons.googlecode.com/files/
animals.png directly in my browser, it doesn't load in the browser - I
can download it though.
As opposed to http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png

Not sure why, but that is likely your problem. Your best bet is to
host the icons locally.

> > > </script>- Hide quoted text -
>
> - Show quoted text -

[JeffJensen]

I'm having the same problem.

1) I can successfully open this kmz file in Google Earth Pro and it
shows the correct placemark icon (point symbol)
http://www.bountifulbaskets.us/kml/BountifulBasketsPickupLocationsNV.kmz

2) But when I add the kmz to the Google Maps V3 API, the custom icons
are missing, see
http://www.bountifulbaskets.us/index.html I get the default blue
paddle icons.

3) I'm getting the same problem with Google MyMaps. I get the wrong
icon, then when I edit the icons to use the custom icon (http://
www.bountifulbaskets.us/websites/bountifulbaskets.us/img/basketorange.png)
MyMaps will display it, but I don't know how to export the KML/KMZ
file.

Any ideas or suggestions?

Thanks,

Jeff Jensen

On Aug 12, 11:25 am, Grok Lobster wrote:
> When I try to loadhttp://google-maps-icons.googlecode.com/files/

> animals.png directly in my browser, it doesn't load in the browser - I
> can download it though.

> As opposed tohttp://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png

> > - Show quoted text -- Hide quoted text -

[Rossko]

> 1) I can successfully open this kmz file in Google Earth Pro and it
> shows the correct placemark icon (point symbol)http://www.bountifulbaskets.us/kml/BountifulBasketsPickupLocationsNV.kmz

I think your KML is a bit bent, example
<styleUrl>#default+icon=http://maps.google.com/mapfiles/kml/pal4/
icon49.png</styleUrl>
or
<StyleMap id="default+nicon=http://maps.google.com/mapfiles/kml/pal4/
icon57.png+hicon=http://maps.google.com/mapfiles/kml/pal4/icon49.png">
don't really look valid.

[JeffJensen]

Hello Rossko,

I agree, this KML was created from Google Earth Pro via the export. It
appears there a two distinct KML versions, one KML which works in
Google Earth and a second subset/limited KML which works in Google
Map. My problem is I don't know a software package/application which
creates the subset Google Map KML.

Thanks,

Jeff Jensen

[Grok Lobster]

I am seeing a basket icon at http://www.bountifulbaskets.us/index.html

Perhaps it was a caching issue.