Check all checkboxes and show layers

[metaphiz]

We're using a JavaScript with Google Maps to load geographic data files and define parameters in Google's API. I'm not so hot with JavaScript, so any help would be much appreciated! I have a working script that just needs one small change. The checkboxes toggle map layers on and off. We want all layers to be checked (and therefore displayed) on load. Right now, it is check all of the checkboxes but for all but the last box, you have to uncheck and check again for the layer to appear.

Here's the URL:

http://www.equinoxenvironmental.com/kMZ/equinox_effect2.cfm

And here's my script:

Here's some related HTML for display:
<input type="hidden" id="url" value=""/>
<div id="map" style="width: 870px; height: 800px; float:left; border: 1px solid black;"></div>
<div id="sidebar" style="float:left; overflow-vertical:scroll; height: 800px; width:150px; border:1px solid black">
<table id="sidebarTABLE">
<tbody id="sidebarTBODY">

<script type="text/javascript">
var map;
var userAdded = 1;

var layers = {
"Bones":
{"url": "

http://www.equinoxenvironmental.com/GIS4/Stream&WetlandMitigation.kmz",

"name": "Stream & Wetland Mitigation",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"hair":
{"url": "

http://www.equinoxenvironmental.com/GIS4/OpenSpace&Habitat.kmz",

"name": "Open Space & Habitat Management",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Meat":
{"url": "

http://www.equinoxenvironmental.com/GIS4/NaturalResourceInventories.kmz",

"name": "Natural Resource Inventories & Monitoring",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"japanpics":
{"url" : "

http://www.equinoxenvironmental.com/GIS4/StormwaterPlanningandDesign.kmz",

"name": "Stormwater Planning & Design",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Rice":
{"url": "

http://www.equinoxenvironmental.com/GIS4/Greenway&ParkPlanning.kmz",

"name": "Greenway & Park Planning",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"blackbirds":
{"url": "

http://www.equinoxenvironmental.com/GIS4/SustainableLandscapeDesign.kmz",

"name": "Sustainable Landscape Design",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"tourdefrance":
{"url": "

http://www.equinoxenvironmental.com/GIS4/LandPlanning.kmz",

"name": "Land Planning",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"7wonders":
{"url": "

http://www.equinoxenvironmental.com/GIS4/EcologicalRestoration.kmz",

"name": "Ecological Restoration",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Mouth":
{"url": "

http://www.equinoxenvironmental.com/GIS4/WaterResourcePlanning.kmz",

"name": "Water Resource Planning",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Teeth":
{"url": "

http://www.equinoxenvironmental.com/GIS4/Partnership&CapacityBuilding.kmz",

"name": "Partnership & Capacity Building",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Skin":
{"url": "

http://www.equinoxenvironmental.com/GIS4/NEPA&RegulatoryPermitting.kmz",

"name": "NEPA, Regulatory Permitting & Due Diligence",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Knee":
{"url": "

http://www.equinoxenvironmental.com/GIS4/Counties.kmz",

"name": "Counties",
"zoom": 7,
"lat": 35.693,
"lng": -82.493},
"Fingernails":
{"url": "

http://www.equinoxenvironmental.com/GIS4/Watersheds.kmz",

"name": "Watersheds",
"zoom": 7,
"lat": 35.693,
"lng": -82.493}

};

function onLoad() {
map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(35.693, -82.493), 5);
map.addControl(new GLargeMapControl3D());
map.addControl(new GScaleControl());
map.addControl(new GMapTypeControl());
map.addControl(new GOverviewMapControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_PHYSICAL_MAP);

document.getElementById("url").value = "

http://";

for(var layer in layers) {
addTR(layer, layers[layer].name);
}
document.getElementById(layer).checked = true;
toggleGeoXML(layer, true);
mapControl.clearRelationships();

}



function addGeoXML() {
var theUrl = document.getElementById("url").value;
theUrl = theUrl.replace(/^\s+/, "");
theUrl = theUrl.replace(/\s+$/, "");
if (theUrl.indexOf(' ') != -1) {
alert('Error - that address has a space in it');
} else {
var id = "userAdded" + userAdded;
layers[id] = {};
layers[id].url = theUrl;
layers[id].name = "User Layer " + userAdded;

addTR(id);
document.getElementById(id).checked = true;
toggleGeoXML(id, true);
userAdded++;
}
}

function addTR(id) {
var layerTR = document.createElement("tr");

var inputTD = document.createElement("td");
var input = document.createElement("input");
input.type = "checkbox";
input.checked = true;
input.id = id;
input.onclick = function () { toggleGeoXML(this.id, this.checked) };
inputTD.appendChild(input);

var nameTD = document.createElement("td");
var nameA = document.createElement("a");
nameA.href = layers[id].url;
var name = document.createTextNode(layers[id].name);
nameA.appendChild(name);
nameTD.appendChild(nameA);

layerTR.appendChild(inputTD);
layerTR.appendChild(nameTD);
document.getElementById("sidebarTBODY").appendChild(layerTR);
}

function toggleGeoXML(id, checked) {
if (checked) {
var geoXml = new GGeoXml(layers[id].url);
layers[id].geoXml = geoXml;

if (layers[id].zoom) {
map.setZoom(layers[id].zoom);
} else {
map.setZoom(1);
}
if (layers[id].lat && layers[id].lng) {
map.setCenter(new GLatLng(layers[id].lat, layers[id].lng));
} else {
map.setCenter(new GLatLng(35.693,-82.493));
}
map.addOverlay(geoXml);
} else if (layers[id].geoXml) {
map.removeOverlay(layers[id].geoXml);
}
}

</script>

 

[tsuji]

This part of the onLoad() is certainly having problem.
[tt]
for(var layer in layers) {
addTR(layer, layers[layer].name);
[red]//} //wrong position of closing bracket[/red]
document.getElementById(layer).checked = true;
//this function toggleGeoXML() may be insufficiently debugged
//it functions partially but eventually hangs the page
//comment out pending further debugging
[red]//[/red]toggleGeoXML(layer, true);
[red]} //probably have to move here[/red]
//mapControl is again not defined
//have to comment out pending further debugging
[red]//[/red]mapControl.clearRelationships();
[/tt]