Source of maps

/* appjet:version 0.1 */page.setTitle("Cloudnode: Maps");page.setFavicon("http://static.jgate.de/img/favicon.ico");page.head.write('<link rel="stylesheet" href="/leaflet/leaflet.css" />');page.head.write('<script type="text/javascript" src="/leaflet/leaflet.js"></script>');function get_main() {    var query = request.params.q    if (query != undefined) {        var coords = query.split(",");        var lat = coords.length == 2 ? coords[0] : undefined;        var lon = coords.length == 2 ? coords[1] : undefined;        if (lat)            print(INPUT({type: "hidden", id: "lat", value: lat}));        if (lat)            print(INPUT({type: "hidden", id: "lon", value: lon}));    }    print(DIV({id: "map", style: "height: 800px;"}));}function get_about() {    print(DIV({style: "margin: 20px;"}, H3("About our Map Server"), """This presentation has been optimized for the fast display of maps on the Web. It is build usingOpen Source tools. The imagery is a custom rendering by us from the latest OpenStreetMap datamade available under the CC-BY-SA 2.0 license.The map server can be run on our platform as a cloud-based service or on own servers or even as an offline solution.The brand-new Leaflet library we used, is a fantastic BSD-licensed creation provided by Cloudmade. It runsperfectly on iOS and Android devices and supports the touch interface and hardware acceleration.See the attribution link for further details.""",H4("Embeddable Maps"), "Maps can be easily embedded into HTML pages",DIV({id: "map", style: "height: 300px;"}), """This presentation serves 1/4th of NRW in Germany for demonstration purposes.""",H4("Select by Geo Coordinates"), "URLs can point to specific ", link("http://maps.cloudno.de/?q=51.832,8.140""locations"),""" like (51.832, 8.140). Additional layers can display markers, popups, polylines, polygons, circles and images.Please """, link("http://cloudno.de/contact", "contact us"), """, if you are interested in a full cloud-based solution, ora turn-key solution which you can host on your own servers or devices."""));}dispatch();/* appjet:css */#appjetfooter { display: none; }/* appjet:client */window.onload = function() {    var map = new L.Map('map');    var cloudmadeUrl = 'http://static.jgate.de/tiles/FB41C16A1A2F2D7A/{z}/{x}/{y}.png',            cloudmadeAttrib = 'Map data © 2011 OpenStreetMap contributors, Imagery © 2011 <a href="/about">Cloudnode</a>',            cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 16, attribution: cloudmadeAttrib});    var home = new L.LatLng(51.7, 8.7);    var zoom = 13;    var lat, lon;    if (document.getElementById('lat') != null && document.getElementById('lon') != null) {        lat = document.getElementById('lat').value * 1.0;        lon = document.getElementById('lon').value * 1.0;        home = new L.LatLng(lat, lon);        zoom = 16;    }    map.setView(home, zoom).addLayer(cloudmade);        // create a marker in the given location and add it to the map    if (lat != undefined && !isNaN(lat) && lon != undefined && !isNaN(lon)) {        var marker = new L.Marker(new L.LatLng(lat, lon));        map.addLayer(marker);        // attach a given HTML content to the marker and immediately open it        marker.bindPopup("Latitude: " + lat + "<br />" + "Longitude: " + lon).openPopup();    }    map.on('click', onMapClick);    var popup = new L.Popup();    if (window.location.pathname == "/") {        resize();        window.onresize = resize;    }    function onMapClick(e) {        var latlngStr = '(' + e.latlng.lat.toFixed(3) + ', ' + e.latlng.lng.toFixed(3) + ')';        popup.setLatLng(e.latlng);        popup.setContent("You clicked the map at " + latlngStr);        map.openPopup(popup);    }}function resize() {    var height = (window.innerHeight) ? window.innerHeight: document.documentElement.clientHeight;    document.getElementById('map').style.height =(height-20)+'px';}

Go Back to this app | Get plain source

Powered by AppJet on JGate
source
rendered in 0.413s