Go to admin page for J!TrackGallery. Add your maps and test.
If map is no longer displayed, you have probably entered erroneous code leading to a javascript error. Remove the erroneous map to recover normal behaviour.

Adding a new map may be tricky. We recommand to first test your map in this simple way:

• Browse any track
• In your browser, save the webpage to some test_map.html, inside the joomla root folder
• Browse the created test_map.html you just created.
• modify the test_map.html code (add script, add openlayer map declaration, add additional code when needed
• When working, use these settings tto create the new map in J!TrackGellary back-end

Each map (layer) is described by parameter defined in the backend:

• Name : a name for this lmayer that can be a language key.
• OL parameter : a portion of the line of code needed for Openlayers javascript code map declaration (not the full line of code)
• script : an optional URL used to load required external script
• code : additionnal optionnal javascript local code (typically an API key for example

Example of map parameters and corresponding code rendering is given below.

A list of maps and corresponding parameters are given in the following pages:

• World maps
• World overlays
• Country maps (sorted by country)
• Country overlays (sorted by country)

This example is for Hike and Bike Hillshade overlay.

OpenLayers.Layer.XYZ("{name}", "http://a.tiles.wmflabs.org/hillshading/${z}/${x}/${y}.png",{displayOutsideMaxExtent: true, isBaseLayer: false, visibility: false, attribution: "Hillshading: SRTM3 v2 (<a href=http://www2.jpl.nasa.gov/srtm/>NASA</a>)" , transitionEffect: "resize" })

Here are some explanation for proper configuration of layers.

OpenLayers.Layer.Google("{name}", {type: google.maps.MapTypeId.TERRAIN} )

http://maps.google.com/maps/api/js?v=3&sensor=false

OpenLayers.Layer.Google("{name}", {type: google.maps.MapTypeId.TERRAIN} )

var BingApiKey =  "AqTGBsziZHIJYYxgivLBf0hVdrAk9mWO5cQcb8Yux8sW5M8c8opEC2lZqKR1ZZXf"; 

(*) Bing API key is no longer required but optionnal

<script src="http://maps.google.com/maps/api/js?v=3&sensor=false" type="text/javascript"></script>|

// <!-- parseOLLayer BEGIN -->
layercomjtgmapmapnik = new OpenLayers.Layer.OSM.Mapnik("OSM Mapnik");
olmap.addLayer(layercomjtgmapmapnik);
layercomjtgmaposmhikeandbike = new OpenLayers.Layer.TMS("OSM Hike and Bike", "http://toolserver.org/tiles/hikebike/", { type: "png", getURL: osm_getTileURL, displayOutsideMaxExtent: true, isBaseLayer: true, attribution: "Map Data © OpenStreetMap contributors", transitionEffect: "resize" });
olmap.addLayer(layercomjtgmaposmhikeandbike);
layercomjtgmapcyclemap = new OpenLayers.Layer.OSM.CycleMap("OSM CycleMap");
olmap.addLayer(layercomjtgmapcyclemap);
layercomjtgmapgooglesat = new OpenLayers.Layer.Google( "Google Satellite", {type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22});
olmap.addLayer(layercomjtgmapgooglesat);
layercomjtgmapgooglestreet = new OpenLayers.Layer.Google( "Google Street",  {numZoomLevels: 20});
olmap.addLayer(layercomjtgmapgooglestreet);
layercomjtgmapgooglehybrid = new OpenLayers.Layer.Google( "Google Hybride",  {type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20});
olmap.addLayer(layercomjtgmapgooglehybrid);
layercomjtgmapgooglephysical = new OpenLayers.Layer.Google("Google Physical", {type: google.maps.MapTypeId.TERRAIN} );
olmap.addLayer(layercomjtgmapgooglephysical);
var BingApiKey =  "AqTGBsziZHIJYYxgivLBf0hVdrAk9mWO5cQcb8Yux8sW5M8c8opEC2lZqKR1ZZXf";
layercomjtgmapbingaerial = new OpenLayers.Layer.Bing({ name: "Bing Aerial", key: BingApiKey, type: "Aerial", wrapDateLine: true });
olmap.addLayer(layercomjtgmapbingaerial);