Fullscreen
Loading...
 
[Show/Hide Right Column]

Maps have been supported in Tiki since 2003 (which is why some call it a GeoCMS). There is geo-related info in various places (users, trackers, image galleries, articles, blog posts, etc.). This was originally done using MapServer, an active and powerful FLOSS mapping solution. However, it requires a dedicated server and more importantly, access to map data (which is not easy).

Later on, Google Maps arrived, providing an easy to use map integration to regular web sites, even without having to manage mapping data. Thus, Google Maps specific code was added to Tiki, which was convenient for a lot of people.

Then, after a community discussion, starting in Tiki7, OpenLayers (another option was Mapstraction) was added as a native way to handle maps, which permits to use tiles from Google Maps, Bing Maps, OpenStreetMap (which is like Wikipedia but for maps), MapQuest (which serves OpenStreetMap maps), etc.

The Cartograf project further improved maps in Tiki8, Tiki9, Tiki10 and Tiki11. Many features were added, including Street View support.

In Tiki12, all Google Maps specific code was removed in favor of using OpenLayers, so Google Maps is accessible via the OpenLayers Google Layer

Next step for Tiki13 is to remove MapServer-specific code and move to the OpenLayers MapServer Layer

Map-related documentation is currently (as of January 2013) a mix of these 3 approaches and needs a serious clean-up. Volunteers: please contact marclaporte at tiki dot org



OpenLayers

Native support for OpenLayers (which is related to OpenStreetMap) is new to Tiki7. Below are instructions about OpenLayers with previous versions.


Embedding OpenLayers in a Wiki Page

By using the HTML and Javascript plugins OpenLayers can be used with Tiki. Although it is not yet integrated into the system as Google Maps is, markers on an OpenLayers map can be linked to tracker items and wiki pages.

OpenLayers style sheets are included with a import statement. This works on Firefox and IE. The OpenLayers Javascript API is bought in via js file import by the JS plugin, as is the actual Javascript that defines the map.

Wiki Markup

Wiki markup to embed the OpenLayers Map
{HTML()}
<STYLE TYPE="text/css">
<!--
@import url(map/style/map_style.css);
-->
<!--
@import url(map/page_style.css);
-->
</STYLE>
{HTML}
{HTML()}<div id="map" class="smallmap"></div>{HTML}{JS(file="map/OpenLayers.js")}{JS}{JS(file="map/mfiglobal.js")}{JS}


Javascript

Javascript to load OpenLayers Map
/* Open Layers Map http://openlayers.org for MindFreedom Lancaster */
/*                                                                 */
/* DJ Barney, June 2009 - thanks to crschmidt for slapping me with */
/* a large trout.                                                  */
/*                                                                 */
/* Important. Tiki page *must* reference external Javascript   */
/* file. PluginJS will *not* run multiple Javascript statements    */
/* edited into the wiki markup.                                    */
/*                                                                 */
/* addLoadEvent function is *required* to allow onload event after */
/* the Tiki onload event otherwise the Javascript will never   */
/* run.                                                            */
/*
/* Page editing: PluginJS *cannot* be previewed. Page *must* be    */
/* saved to be able to validate the code (usually an admin task).  */

        var map, layer;
        function olinit(){
            map = new OpenLayers.Map('map');
            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
                "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
            map.addLayer(layer);
            var newl = new OpenLayers.Layer.Text( "text", {location: "map/mfi-locations.txt"} );
            map.addLayer(newl);
            map.addControl(new OpenLayers.Control.LayerSwitcher());
            map.zoomToMaxExtent();
        }
 	function addLoadEvent(func) { 
	  var oldonload = window.onload;
	  if (typeof window.onload != 'function') { 
	    window.onload = func; 
	  } else { 
	    window.onload = function() { 
	      if (oldonload) { 
	        oldonload(); 
	      } 
	      func(); 
	    } 
	  } 
	} 
	addLoadEvent(olinit);


See this page for an example of an embedded OpenLayers map.



alias

doc.tiki.org
[toggle]





Site Language

Keywords

These keywords serve as "hubs" for navigation within the Tiki documentation. They correspond to development keywords (bug reports and feature requests):



Tiki Newsletter

Delivered fresh to your email inbox!
Newsletter subscribe icon
Don't miss major announcements and other news!
Contribute to Tiki