check-in bower_components

This commit is contained in:
Norbert Renner 2014-01-27 18:46:51 +01:00
parent 4cc16bccd0
commit 9e08e74132
101 changed files with 90960 additions and 0 deletions

View file

@ -0,0 +1,14 @@
{
"name": "shramov-plugins-permalink",
"homepage": "https://github.com/shramov/leaflet-plugins",
"version": "1.0.1",
"_release": "1.0.1",
"_resolution": {
"type": "version",
"tag": "v1.0.1",
"commit": "a03de1df77d53c58dd7194bf7e1ddbc100231ac2"
},
"_source": "git://github.com/shramov/leaflet-plugins.git",
"_target": "*",
"_originalSource": "leaflet-plugins"
}

View file

@ -0,0 +1,22 @@
Copyright (c) 2011-2012, Pavel Shramov
All rights reserved.
Redistribution and use in source and binary forms, with or without modification, are
permitted provided that the following conditions are met:
1. Redistributions of source code must retain the above copyright notice, this list of
conditions and the following disclaimer.
2. Redistributions in binary form must reproduce the above copyright notice, this list
of conditions and the following disclaimer in the documentation and/or other materials
provided with the distribution.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR
TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

View file

@ -0,0 +1,41 @@
Leaflet plugins
===============
== What's it?
Miscellaneous plugins for Leaflet library for services that need to display
route information and need satellite imagery from different providers.
Currently it consists of:
- Vector layers (`layer/vector/`):
* GPX
* KML
- Providers (`layer/tile`):
* Google - using Google Maps API v3;
* Yandex - using Yandex Maps API v2;
* Bing - with proper attribution.
All these providers are implemented with respect to terms of use.
Also there are some useful control plugins (`control/`):
* Permalink - OpenLayers compatible permanent link with support for storing
location data in hash part (#lat=...);
* Scale - scale ruler which looks like one on paper maps.
== How to get?
http://psha.org.ru/cgit/psha/leaflet-plugins.git
or
http://github.com/shramov/leaflet-plugins.git
== Russian docs
See link:http://psha.org.ru/b/leaflet-plugins.ru.html[russian documentation] for more info.
////////////////////////////////////
vim: sts=4 sw=4 et tw=80 ft=asciidoc
////////////////////////////////////

View file

@ -0,0 +1,28 @@
JS := $(wildcard ../layer/*/*.js ../layer/*.js ../control/*js)
#JS += control/Scale.js control/Distance.js
#JS += control/Permalink.js $(wildcard control/Permalink.*.js)
JS := $(shell python ./deps.py $(JS))
#JS_EXTRA := $(JS) $(wildcard layer/*.js)
all: compiled.yui.js compiled.closure.js
compile: $(patsubst %,compiled/%,$(JS))
closure/%: ../%
mkdir -p $(dir $@)
java -jar /tmp/closure.jar --compilation_level ADVANCED_OPTIMIZATIONS --charset UTF-8 --js $< --js_output_file $@.tmp
mv $@.tmp $@
yui/%: ../%
mkdir -p $(dir $@)
yui-compressor --charset UTF-8 -o $@.tmp $<
mv $@.tmp $@
compiled.yui.js: $(patsubst ../%,yui/%,$(JS))
compiled.closure.js: $(patsubst ../%,closure/%,$(JS))
compiled.%.js:
for f in $^; do cat $$f >> $@.tmp; echo >> $@.tmp; done
mv $@.tmp $@
.PHONY: all compile

View file

@ -0,0 +1,26 @@
#!/usr/bin/env python
# vim: sts=4 sw=4 et
import os, sys
printed = set()
def includes(f):
d = os.path.dirname(f)
for l in open(f):
if l.startswith('//#include'):
yield os.path.join(d, l.strip().split(None, 1)[1].strip(""""'"""))
work = list(sys.argv[1:])
while work:
f = work.pop(0)
if f in printed:
continue
i = list(filter(lambda x: x not in printed, includes(f)))
if i:
work = i + [f] + work
continue
printed.add(f)
print f

View file

@ -0,0 +1,127 @@
L.Control.Distance = L.Control.extend({
options: {
position: 'topleft',
popups: true
},
initialize: function (options) {
L.Util.setOptions(this, options);
this._line = new L.Polyline([], {editable: true});
this._line.on('edit', this._update, this);
this._line.on('click', function(e) {});
this._active = false;
},
getLine: function() { return this._line; },
onAdd: function(map) {
var className = 'leaflet-control-distance',
container = this._container = L.DomUtil.create('div', className);
function cb() {
if (this._active)
this._calc_disable();
else
this._calc_enable();
}
var link = this._link = this._createButton('Edit', 'leaflet-control-distance leaflet-control-distance-edit', container, cb, this);
var del = this._link_delete = this._createButton('Delete', 'leaflet-control-distance leaflet-control-distance-delete', container, this._reset, this);
var text = this._text = L.DomUtil.create('div', 'leaflet-control-distance-text', container);
//text.style.display = 'inline';
//text.style.float = 'right';
this._map.addLayer(this._line);
this._calc_disable();
return container;
},
_createButton: function (title, className, container, fn, context) {
var link = L.DomUtil.create('a', className, container);
link.href = '#';
link.title = title;
L.DomEvent
.addListener(link, 'click', L.DomEvent.stopPropagation)
.addListener(link, 'click', L.DomEvent.preventDefault)
.addListener(link, 'click', fn, context);
return link;
},
onRemove: function(map) {
this._calc_disable();
},
_calc_enable: function() {
this._map.on('click', this._add_point, this);
this._map.getContainer().style.cursor = 'crosshair';
//this._map.addLayer(this._line);
L.DomUtil.addClass(this._link, 'leaflet-control-distance-active');
this._container.appendChild(this._link_delete);
this._container.appendChild(this._text);
this._active = true;
this._line.editing.enable();
if (!this._map.hasLayer(this._line))
this._map.addLayer(this._line);
this._update();
},
_calc_disable: function() {
this._map.off('click', this._add_point, this);
//this._map.removeLayer(this._line);
this._map.getContainer().style.cursor = 'default';
this._container.removeChild(this._link_delete);
this._container.removeChild(this._text);
L.DomUtil.removeClass(this._link, 'leaflet-control-distance-active');
this._active = false;
this._line.editing.disable();
},
_add_point: function (e) {
var len = this._line.getLatLngs().length;
this._line.addLatLng(e.latlng);
this._line.editing.updateMarkers();
this._line.fire('edit', {});
},
_reset: function(e) {
this._line.setLatLngs([]);
this._line.fire('edit', {});
this._line.redraw();
this._line.editing.updateMarkers();
},
_update: function(e) {
console.info("Update");
this._text.textContent = this._d2txt(this._distance_calc());
},
_d2txt: function(d) {
if (d < 2000)
return d.toFixed(0) + " m";
else
return (d/1000).toFixed(1) + " km";
},
_distance_calc: function(e) {
var ll = this._line.getLatLngs();
var d = 0, p = null;
for (var i = 0; i < ll.length; i++) {
if (i)
d += p.distanceTo(ll[i]);
if (this.options.popups) {
var m = this._line.editing._markers[i];
if (m) {
m.bindPopup(this._d2txt(d));
m.on('mouseover', m.openPopup, m);
m.on('mouseout', m.closePopup, m);
}
}
p = ll[i];
}
return d;
}
});

View file

@ -0,0 +1,60 @@
/*
* Add async initialization of layers to L.Control.Layers
*/
L.Control.Layers.include({
_loadScripts: function(scripts, cb, args) {
if (!scripts || scripts.length == 0)
return cb(args);
var _this = this, s = scripts.pop(), c;
c = L.Control.Layers._script_cache[s];
if (c === undefined) {
c = {url: s, wait: []};
//console.info("Load " + s);
var script = document.createElement('script');
script.src = s;
script.type = 'text/javascript';
script.onload = function () {
var i = 0;
for (i = 0; i < c.wait.length; i++)
c.wait[i]();
}
c.e = script;
document.getElementsByTagName('head')[0].appendChild(script);
}
function _cb() { _this._loadScripts(scripts, cb, args); }
c.wait.push(_cb);
if (c.e.readyState == "completed")
_cb();
L.Control.Layers._script_cache[s] = c;
},
addLayerDef: function(name, def) {
if (this._layer_defs === undefined)
this._layer_defs = {};
this._layer_defs[name] = def;
},
addLayerDefs: function(defs) {
if (this._layer_defs === undefined)
this._layer_defs = {};
L.Util.extend(this._layer_defs, defs);
},
loadLayer: function(name, deflt) {
var _this = this, l = this._layer_defs[name];
l['default'] = deflt;
this._loadScripts(l.js.reverse(), function(l) {_this._loadLayer(l)}, l);
},
_loadLayer: function(l) {
var x = l.init();
if (l['default'] && this._map)
this._map.addLayer(x);
if (!l.overlay)
this.addBaseLayer(x, l.name);
else
this.addOverlay(x, l.name);
}
});
L.Control.Layers._script_cache = {};

View file

@ -0,0 +1,76 @@
//#include "Permalink.js
L.Control.Permalink.include({
/*
options: {
useMarker: true,
markerOptions: {}
},
*/
initialize_layer: function() {
//console.info("Initialize layer");
this.on('update', this._set_layer, this);
this.on('add', this._onadd_layer, this);
},
_onadd_layer: function(e) {
//console.info("onAdd::layer", e);
this._map.on('layeradd', this._update_layer, this);
this._map.on('layerremove', this._update_layer, this);
this._update_layer();
},
_update_layer: function() {
if (!this.options.layers) return;
//console.info(this.options.layers);
var layer = this.options.layers.currentBaseLayer();
if (layer)
this._update({layer: layer.name});
},
_set_layer: function(e) {
//console.info("Set layer", e);
var p = e.params;
if (!this.options.layers || !p.layer) return;
this.options.layers.chooseBaseLayer(p.layer);
}
});
L.Control.Layers.include({
chooseBaseLayer: function(name) {
var layer, obj;
for (var i in this._layers) {
if (!this._layers.hasOwnProperty(i))
continue;
obj = this._layers[i];
if (!obj.overlay && obj.name == name)
layer = obj.layer;
}
if (!layer || this._map.hasLayer(layer))
return;
for (var i in this._layers) {
if (!this._layers.hasOwnProperty(i))
continue;
obj = this._layers[i];
if (!obj.overlay && this._map.hasLayer(obj.layer))
this._map.removeLayer(obj.layer)
}
this._map.addLayer(layer)
this._update();
},
currentBaseLayer: function() {
for (var i in this._layers) {
if (!this._layers.hasOwnProperty(i))
continue;
var obj = this._layers[i];
//console.info("Layer: ", obj.name, obj);
if (obj.overlay) continue;
if (!obj.overlay && this._map.hasLayer(obj.layer))
return obj;
}
}
});

View file

@ -0,0 +1,49 @@
//#include "Permalink.js
L.Control.Permalink.include({
/*
options: {
line: null
},
*/
initialize_line: function() {
this.on('update', this._set_line, this);
this.on('add', this._onadd_line, this);
},
_onadd_line: function(e) {
//console.info("onAdd::line", e);
if (!this.options.line) return;
this.options.line.on('edit', this._update_line, this);
this._update_line()
},
_update_line: function() {
if (!this.options.line) return;
var line = this.options.line;
if (!line) return;
var text = [], coords = line.getLatLngs();
if (!coords.length)
return this._update({line: null});
for (var i in coords)
text.push(coords[i].lat.toFixed(4) + "," + coords[i].lng.toFixed(4))
this._update({line: text.join(';')});
},
_set_line: function(e) {
//console.info("Set line", e.params.line);
var p = e.params, l = this.options.line;
if (!l || !p.line) return;
var coords = [], text = p.line.split(';');
for (var i in text) {
var ll = text[i].split(',');
if (ll.length != 2) continue;
coords.push(new L.LatLng(ll[0], ll[1]));
}
if (!coords.length) return;
l.setLatLngs(coords);
if (!this._map.hasLayer(l))
this._map.addLayer(l);
}
});

View file

@ -0,0 +1,31 @@
//#include "Permalink.js
L.Control.Permalink.include({
/*
options: {
useMarker: true,
markerOptions: {}
},
*/
initialize_marker: function() {
//console.info("Initialize marker");
this.on('update', this._set_marker, this);
},
_set_marker: function(e) {
//console.info("Set marker", e);
var p = e.params;
//if (!this.options.useMarker) return;
if (this._marker) return;
if (p.marker != 1) return;
if (p.mlat !== undefined && p.mlon !== undefined)
return this._update({mlat: null, mlon: null,
lat: p.mlat, lon: p.mlon, marker: 1});
this._marker = new L.Marker(new L.LatLng(p.lat, p.lon),
this.options.markerOptions);
this._marker.bindPopup("<a href='" + this._update_href() + "'>" + this.options.text + "</a>");
this._map.addLayer(this._marker);
this._update({marker: null});
}
});

View file

@ -0,0 +1,163 @@
L.Control.Permalink = L.Control.extend({
includes: L.Mixin.Events,
options: {
position: "bottomleft",
useAnchor: true,
useLocation: false,
text: "Permalink"
},
initialize: function(options) {
L.Util.setOptions(this, options);
this._params = {};
this._set_urlvars();
this.on("update", this._set_center, this);
for (var i in this) {
if (typeof(i) === "string" && i.indexOf('initialize_') == 0)
this[i]();
}
},
onAdd: function(map) {
this._container = L.DomUtil.create('div', 'leaflet-control-attribution leaflet-control-permalink');
L.DomEvent.disableClickPropagation(this._container);
this._map = map;
this._href = L.DomUtil.create('a', null, this._container);
this._href.innerHTML = this.options.text
map.on('moveend', this._update_center, this);
this.fire("update", {params: this._params})
this._update_center();
if (this.options.useAnchor && 'onhashchange' in window) {
var _this = this, fn = window.onhashchange;
window.onhashchange = function() {
_this._set_urlvars();
if (fn) return fn();
}
}
this.fire('add', {map: map});
return this._container;
},
_update_center: function() {
if (!this._map) return;
var center = this._round_point(this._map.getCenter());
this._update({zoom: this._map.getZoom(), lat: center.lat, lon: center.lng});
},
_update_href: function() {
var params = L.Util.getParamString(this._params);
var sep = '?';
if (this.options.useAnchor) sep = '#';
var url = this._url_base + sep + params.slice(1);
if (this._href) this._href.setAttribute('href', url);
if (this.options.useLocation)
location.replace('#' + params.slice(1));
return url;
},
_round_point : function(point) {
var bounds = this._map.getBounds(), size = this._map.getSize();
var ne = bounds.getNorthEast(), sw = bounds.getSouthWest();
var round = function (x, p) {
if (p == 0) return x;
shift = 1;
while (p < 1 && p > -1) {
x *= 10;
p *= 10;
shift *= 10;
}
return Math.floor(x)/shift;
}
point.lat = round(point.lat, (ne.lat - sw.lat) / size.y);
point.lng = round(point.lng, (ne.lng - sw.lng) / size.x);
return point;
},
_update: function(obj, source) {
//console.info("Update", obj, this._params);
for(var i in obj) {
if (!obj.hasOwnProperty(i)) continue;
if (obj[i] != null && obj[i] != undefined)
this._params[i] = obj[i]
else
delete this._params[i];
}
this._update_href();
},
_set_urlvars: function()
{
this._url_base = window.location.href.split('#')[0].split('?')[0];
var p;
if (this.options.useAnchor)
p = L.UrlUtil.queryParse(L.UrlUtil.hash());
else
p = L.UrlUtil.queryParse(L.UrlUtil.query());
function eq(x, y) {
for(var i in x)
if (x.hasOwnProperty(i) && x[i] != y[i])
return false;
return true;
}
if (eq(p, this._params) && eq(this._params, p))
return;
this._params = p;
this._update_href();
this.fire("update", {params: this._params})
},
_set_center: function(e)
{
//console.info("Update center", e);
var params = e.params;
if (params.zoom == undefined ||
params.lat == undefined ||
params.lon == undefined) return;
this._map.setView(new L.LatLng(params.lat, params.lon), params.zoom);
}
});
L.UrlUtil = {
queryParse: function(s) {
var p = {};
var sep = "&";
if (s.search("&amp;") != -1)
sep = "&amp;";
var params = s.split(sep);
for(var i = 0; i < params.length; i++) {
var tmp = params[i].split('=');
if (tmp.length != 2) continue;
p[tmp[0]] = decodeURI(tmp[1]);
}
return p;
},
query: function() {
var href = window.location.href.split('#')[0], idx = href.indexOf('?');
if (idx < 0)
return '';
return href.slice(idx+1);
},
hash: function() { return window.location.hash.slice(1) },
updateParamString: function (q, obj) {
var p = L.UrlUtil.queryParse(q);
for (var i in obj) {
if (obj.hasOwnProperty(i))
p[i] = obj[i];
}
return L.Util.getParamString(p).slice(1);
}
};

View file

@ -0,0 +1,118 @@
L.Control.Scale = L.Control.extend({
options: {
position: "bottomleft",
useCanvas: null,
width: 100
},
initialize: function(options) {
L.Util.setOptions(this, options);
},
onAdd: function(map) {
this._map = map;
this._container = L.DomUtil.create('div', 'leaflet-control-attribution leaflet-control-scale');
this._label = L.DomUtil.create('div', null, this._container);
this._label.style.textAlign = 'right';
if (!this.options.useCanvas && this.options.useCanvas != false)
this.options.useCanvas = "HTMLCanvasElement" in window;
if (this.options.useCanvas) {
this._canvas = L.DomUtil.create('canvas', 'leaflet-canvas-marker', this._container);
} else {
this._canvas = L.DomUtil.create('div', null, this._container);
this._canvas.style.border = "1px solid black";
this._canvas.innerHTML = "&nbsp;";
//this._canvas.style.padding = "none";
//this._canvas.style.margin = "none";
//this._canvas.style.width = 100;
//this._canvas.style.height = 5;
}
map.on('zoomend', this._update, this);
this._update();
return this._container;
},
onRemove: function(map) {
map._container.removeChild(this._label);
map._container.removeChild(this._canvas);
map.off('zoomend', this._reset);
},
getPosition: function() {
return this.options.position;
},
getContainer: function() {
return this._container;
},
_update: function() {
if (!this._map) return;
var size = this.options.width;
var b = this._map.getBounds(), pb = this._map.getPixelBounds();
var width = this._deg_length(b.getNorthEast(), b.getNorthWest());
width = size * width / (pb.max.x - pb.min.x);
var iw = this._round(width);
if (iw >= 1)
this._label.innerHTML = iw + " km";
else
this._label.innerHTML = Math.round(1000 * iw) + " m";
size = size * iw / width;
if (this.options.useCanvas) {
this._canvas.width = size+1;
this._canvas.height = 10+1;
var ctx = this._canvas.getContext("2d");
this._draw(ctx, size, 5);
} else {
this._canvas.style.width = size;
this._canvas.style.height = 5;
}
},
_draw: function(ctx, width, height) {
ctx.beginPath();
ctx.fillStyle = ctx.strokeStyle = '#000';
ctx.lineWidth = 0.5;
ctx.strokeRect(0, height, width/2, height);
ctx.fillRect(0, height, width/2, height);
ctx.strokeRect(width/2, height, width/2, height);
ctx.moveTo(0, 0);
ctx.lineTo(0, height);
ctx.moveTo(width/2, 0);
ctx.lineTo(width/2, height);
ctx.moveTo(width, 0);
ctx.lineTo(width, height);
ctx.stroke();
},
_deg_length : function(p1, p2) {
var deglen = 111.12 * L.LatLng.RAD_TO_DEG;
var p1lat = p1.lat * L.LatLng.DEG_TO_RAD,
p1lng = p1.lng * L.LatLng.DEG_TO_RAD,
p2lat = p2.lat * L.LatLng.DEG_TO_RAD,
p2lng = p2.lng * L.LatLng.DEG_TO_RAD;
return deglen * Math.acos(Math.sin(p1lat) * Math.sin(p2lat) +
Math.cos(p1lat) * Math.cos(p2lat) * Math.cos(p2lng - p1lng));
},
_round : function (x) {
var div = 1;
while (div < x) div *= 10;
while (div > x) div /= 10;
var s = div;
while (s < x) s += div;
if (s > 5 * div) s = 10 * div;
return s;
}
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View file

@ -0,0 +1,48 @@
.leaflet-control-distance {
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
padding: 5px;
background-color: rgba(0, 0, 0, 0.25);
}
.leaflet-control-distance a, .leaflet-control-distance div {
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
padding: 2px;
background-position: 50% 50%;
background-repeat: no-repeat;
background-color: rgba(255, 255, 255, 0.75);
}
.leaflet-control-distance a {
width: 16px;
height: 16px;
display: inline-block;
}
.leaflet-control-distance div {
font: 11px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
color: #333;
height: 16px;
margin-top: 5px;
white-space: nowrap;
}
.leaflet-control-distance-edit {
/* http://openclipart.org/detail/114727/ftview-ruler-by-anonymous */
background-image: url('measure.png');
}
.leaflet-control-distance-delete {
margin-left: 5px;
/* Based on http://openclipart.org/detail/34729/architetto----tasto-8-by-anonymous */
background-image: url('cross.png');
}
a.leaflet-control-distance-active {
background-color: yellow;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 470 B

View file

@ -0,0 +1,97 @@
.osb-popup {
font-family: sans-serif;
font-size: small;
max-width: 380px;
overflow: auto;
}
.osb-popup a:link, .osb-popup a:visited {
border-bottom: 1px dotted #C0C0C0;
text-decoration: none;
}
.osb-popup a:link {
color: #990000;
}
.osb-popup a:visited {
color: #500000;
}
.osb-popup a:link:hover, .osb-popup a:visited:hover {
border-bottom: 1px solid #C0C0C0;
color: red;
}
.osb-popup a:link:focus .osb-popup a:visited:focus {
outline: 1px dotted #C0C0C0;
}
.osb-popup a:link:active, .osb-popup a:visited:active {
border-bottom: 1px solid #F0F0F0;
color: red;
outline: 1px solid #C0C0C0;
}
.osb-popup h1 {
color: #176BC1;
font-size: medium;
margin-bottom: 7px;
margin-top: 0;
}
.osb-popup p {
margin-bottom: 0;
margin-top: 5px;
}
.osb-popup p.Comment {
margin-left: 15px;
margin-top: 5px;
}
.osb-popup p.Note {
border-top: 1px solid gray;
font-size: x-small;
margin-top: 7px;
padding-top: 3px;
}
.osb-popup form + p {
border-top: 1px solid gray;
margin-top: 15px;
padding-top: 10px;
}
.osb-popup ul {
border-top: 1px solid gray;
margin: 10px 0 0;
padding: 5px 0 0;
text-align: center;
}
.osb-popup ul li {
display: inline;
margin-left: 12px;
margin-right: 12px;
padding: 0;
}
.osb-popup form {
margin-bottom: 0;
margin-top: 10px;
}
.osb-popup form.osb-comment {
border-top: 1px solid gray;
padding-top: 5px;
}
.osb-popup form div {
margin-left: 15px;
margin-right: 15px;
margin-top: 5px;
}
.osb-popup form div.osb-footer {
margin-bottom: 0;
margin-top: 15px;
text-align: center;
}
.osb-popup span.osb-inputlabel {
display: inline-block;
margin-right: 10px;
min-width: 110px;
}
.osb-popup input[type="text"] {
min-width: 190px;
}
.osb-popup input[type="button"] {
margin-left: 3px;
margin-right: 3px;
min-width: 75px;
}

View file

@ -0,0 +1,915 @@
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document>
<name>KML Samples</name>
<open>1</open>
<description>Unleash your creativity with the help of these examples!</description>
<Style id="downArrowIcon">
<IconStyle>
<Icon>
<href>http://maps.google.com/mapfiles/kml/pal4/icon28.png</href>
</Icon>
</IconStyle>
</Style>
<Style id="globeIcon">
<IconStyle>
<Icon>
<href>http://maps.google.com/mapfiles/kml/pal3/icon19.png</href>
</Icon>
</IconStyle>
<LineStyle>
<width>2</width>
</LineStyle>
</Style>
<Style id="transPurpleLineGreenPoly">
<LineStyle>
<color>7fff00ff</color>
<width>4</width>
</LineStyle>
<PolyStyle>
<color>7f00ff00</color>
</PolyStyle>
</Style>
<Style id="yellowLineGreenPoly">
<LineStyle>
<color>7f00ffff</color>
<width>4</width>
</LineStyle>
<PolyStyle>
<color>7f00ff00</color>
</PolyStyle>
</Style>
<Style id="thickBlackLine">
<LineStyle>
<color>87000000</color>
<width>10</width>
</LineStyle>
</Style>
<Style id="redLineBluePoly">
<LineStyle>
<color>ff0000ff</color>
</LineStyle>
<PolyStyle>
<color>ffff0000</color>
</PolyStyle>
</Style>
<Style id="blueLineRedPoly">
<LineStyle>
<color>ffff0000</color>
</LineStyle>
<PolyStyle>
<color>ff0000ff</color>
</PolyStyle>
</Style>
<Style id="transRedPoly">
<LineStyle>
<width>1.5</width>
</LineStyle>
<PolyStyle>
<color>7d0000ff</color>
</PolyStyle>
</Style>
<Style id="transBluePoly">
<LineStyle>
<width>1.5</width>
</LineStyle>
<PolyStyle>
<color>7dff0000</color>
</PolyStyle>
</Style>
<Style id="transGreenPoly">
<LineStyle>
<width>1.5</width>
</LineStyle>
<PolyStyle>
<color>7d00ff00</color>
</PolyStyle>
</Style>
<Style id="transYellowPoly">
<LineStyle>
<width>1.5</width>
</LineStyle>
<PolyStyle>
<color>7d00ffff</color>
</PolyStyle>
</Style>
<Style id="noDrivingDirections">
<BalloonStyle>
<text><![CDATA[
<b>$[name]</b>
<br /><br />
$[description]
]]></text>
</BalloonStyle>
</Style>
<Folder>
<name>Placemarks</name>
<description>These are just some of the different kinds of placemarks with
which you can mark your favorite places</description>
<LookAt>
<longitude>-122.0839597145766</longitude>
<latitude>37.42222904525232</latitude>
<altitude>0</altitude>
<heading>-148.4122922628044</heading>
<tilt>40.5575073395506</tilt>
<range>500.6566641072245</range>
</LookAt>
<Placemark>
<name>Simple placemark</name>
<description>Attached to the ground. Intelligently places itself at the
height of the underlying terrain.</description>
<Point>
<coordinates>-122.0822035425683,37.42228990140251,0</coordinates>
</Point>
</Placemark>
<Placemark>
<name>Floating placemark</name>
<visibility>0</visibility>
<description>Floats a defined distance above the ground.</description>
<LookAt>
<longitude>-122.0839597145766</longitude>
<latitude>37.42222904525232</latitude>
<altitude>0</altitude>
<heading>-148.4122922628044</heading>
<tilt>40.5575073395506</tilt>
<range>500.6566641072245</range>
</LookAt>
<styleUrl>#downArrowIcon</styleUrl>
<Point>
<altitudeMode>relativeToGround</altitudeMode>
<coordinates>-122.084075,37.4220033612141,50</coordinates>
</Point>
</Placemark>
<Placemark>
<name>Extruded placemark</name>
<visibility>0</visibility>
<description>Tethered to the ground by a customizable
&quot;tail&quot;</description>
<LookAt>
<longitude>-122.0845787421525</longitude>
<latitude>37.42215078737763</latitude>
<altitude>0</altitude>
<heading>-148.4126684946234</heading>
<tilt>40.55750733918048</tilt>
<range>365.2646606980322</range>
</LookAt>
<styleUrl>#globeIcon</styleUrl>
<Point>
<extrude>1</extrude>
<altitudeMode>relativeToGround</altitudeMode>
<coordinates>-122.0857667006183,37.42156927867553,50</coordinates>
</Point>
</Placemark>
</Folder>
<Folder>
<name>Styles and Markup</name>
<visibility>0</visibility>
<description>With KML it is easy to create rich, descriptive markup to
annotate and enrich your placemarks</description>
<LookAt>
<longitude>-122.0845787422371</longitude>
<latitude>37.42215078726837</latitude>
<altitude>0</altitude>
<heading>-148.4126777488172</heading>
<tilt>40.55750733930874</tilt>
<range>365.2646826292919</range>
</LookAt>
<styleUrl>#noDrivingDirections</styleUrl>
<Document>
<name>Highlighted Icon</name>
<visibility>0</visibility>
<description>Place your mouse over the icon to see it display the new
icon</description>
<LookAt>
<longitude>-122.0856552124024</longitude>
<latitude>37.4224281311035</latitude>
<altitude>0</altitude>
<heading>0</heading>
<tilt>0</tilt>
<range>265.8520424250024</range>
</LookAt>
<Style id="highlightPlacemark">
<IconStyle>
<Icon>
<href>http://maps.google.com/mapfiles/kml/paddle/red-stars.png</href>
</Icon>
</IconStyle>
</Style>
<Style id="normalPlacemark">
<IconStyle>
<Icon>
<href>http://maps.google.com/mapfiles/kml/paddle/wht-blank.png</href>
</Icon>
</IconStyle>
</Style>
<StyleMap id="exampleStyleMap">
<Pair>
<key>normal</key>
<styleUrl>#normalPlacemark</styleUrl>
</Pair>
<Pair>
<key>highlight</key>
<styleUrl>#highlightPlacemark</styleUrl>
</Pair>
</StyleMap>
<Placemark>
<name>Roll over this icon</name>
<visibility>0</visibility>
<styleUrl>#exampleStyleMap</styleUrl>
<Point>
<coordinates>-122.0856545755255,37.42243077405461,0</coordinates>
</Point>
</Placemark>
</Document>
<Placemark>
<name>Descriptive HTML</name>
<visibility>0</visibility>
<description><![CDATA[Click on the blue link!<br><br>
Placemark descriptions can be enriched by using many standard HTML tags.<br>
For example:
<hr>
Styles:<br>
<i>Italics</i>,
<b>Bold</b>,
<u>Underlined</u>,
<s>Strike Out</s>,
subscript<sub>subscript</sub>,
superscript<sup>superscript</sup>,
<big>Big</big>,
<small>Small</small>,
<tt>Typewriter</tt>,
<em>Emphasized</em>,
<strong>Strong</strong>,
<code>Code</code>
<hr>
Fonts:<br>
<font color="red">red by name</font>,
<font color="#408010">leaf green by hexadecimal RGB</font>
<br>
<font size=1>size 1</font>,
<font size=2>size 2</font>,
<font size=3>size 3</font>,
<font size=4>size 4</font>,
<font size=5>size 5</font>,
<font size=6>size 6</font>,
<font size=7>size 7</font>
<br>
<font face=times>Times</font>,
<font face=verdana>Verdana</font>,
<font face=arial>Arial</font><br>
<hr>
Links:
<br>
<a href="http://earth.google.com/">Google Earth!</a>
<br>
or: Check out our website at www.google.com
<hr>
Alignment:<br>
<p align=left>left</p>
<p align=center>center</p>
<p align=right>right</p>
<hr>
Ordered Lists:<br>
<ol><li>First</li><li>Second</li><li>Third</li></ol>
<ol type="a"><li>First</li><li>Second</li><li>Third</li></ol>
<ol type="A"><li>First</li><li>Second</li><li>Third</li></ol>
<hr>
Unordered Lists:<br>
<ul><li>A</li><li>B</li><li>C</li></ul>
<ul type="circle"><li>A</li><li>B</li><li>C</li></ul>
<ul type="square"><li>A</li><li>B</li><li>C</li></ul>
<hr>
Definitions:<br>
<dl>
<dt>Google:</dt><dd>The best thing since sliced bread</dd>
</dl>
<hr>
Centered:<br><center>
Time present and time past<br>
Are both perhaps present in time future,<br>
And time future contained in time past.<br>
If all time is eternally present<br>
All time is unredeemable.<br>
</center>
<hr>
Block Quote:
<br>
<blockquote>
We shall not cease from exploration<br>
And the end of all our exploring<br>
Will be to arrive where we started<br>
And know the place for the first time.<br>
<i>-- T.S. Eliot</i>
</blockquote>
<br>
<hr>
Headings:<br>
<h1>Header 1</h1>
<h2>Header 2</h2>
<h3>Header 3</h3>
<h3>Header 4</h4>
<h3>Header 5</h5>
<hr>
Images:<br>
<i>Remote image</i><br>
<img src="//developers.google.com/kml/documentation/images/googleSample.png"><br>
<i>Scaled image</i><br>
<img src="//developers.google.com/kml/documentation/images/googleSample.png" width=100><br>
<hr>
Simple Tables:<br>
<table border="1" padding="1">
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
<tr><td>a</td><td>b</td><td>c</td><td>d</td><td>e</td></tr>
</table>
<br>
[Did you notice that double-clicking on the placemark doesn't cause the viewer to take you anywhere? This is because it is possible to directly author a "placeless placemark". If you look at the code for this example, you will see that it has neither a point coordinate nor a LookAt element.]]]></description>
</Placemark>
</Folder>
<Folder>
<name>Ground Overlays</name>
<visibility>0</visibility>
<description>Examples of ground overlays</description>
<GroundOverlay>
<name>Large-scale overlay on terrain</name>
<visibility>0</visibility>
<description>Overlay shows Mount Etna erupting on July 13th, 2001.</description>
<LookAt>
<longitude>15.02468937557116</longitude>
<latitude>37.67395167941667</latitude>
<altitude>0</altitude>
<heading>-16.5581842842829</heading>
<tilt>58.31228652890705</tilt>
<range>30350.36838438907</range>
</LookAt>
<Icon>
<href>http://developers.google.com/kml/documentation/images/etna.jpg</href>
</Icon>
<LatLonBox>
<north>37.91904192681665</north>
<south>37.46543388598137</south>
<east>15.35832653742206</east>
<west>14.60128369746704</west>
<rotation>-0.1556640799496235</rotation>
</LatLonBox>
</GroundOverlay>
</Folder>
<Folder>
<name>Screen Overlays</name>
<visibility>0</visibility>
<description>Screen overlays have to be authored directly in KML. These
examples illustrate absolute and dynamic positioning in screen space.</description>
<ScreenOverlay>
<name>Simple crosshairs</name>
<visibility>0</visibility>
<description>This screen overlay uses fractional positioning to put the
image in the exact center of the screen</description>
<Icon>
<href>http://developers.google.com/kml/documentation/images/crosshairs.png</href>
</Icon>
<overlayXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
<screenXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
<rotationXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/>
<size x="0" y="0" xunits="pixels" yunits="pixels"/>
</ScreenOverlay>
<ScreenOverlay>
<name>Absolute Positioning: Top left</name>
<visibility>0</visibility>
<Icon>
<href>http://developers.google.com/kml/documentation/images/top_left.jpg</href>
</Icon>
<overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/>
<screenXY x="0" y="1" xunits="fraction" yunits="fraction"/>
<rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<size x="0" y="0" xunits="fraction" yunits="fraction"/>
</ScreenOverlay>
<ScreenOverlay>
<name>Absolute Positioning: Top right</name>
<visibility>0</visibility>
<Icon>
<href>http://developers.google.com/kml/documentation/images/top_right.jpg</href>
</Icon>
<overlayXY x="1" y="1" xunits="fraction" yunits="fraction"/>
<screenXY x="1" y="1" xunits="fraction" yunits="fraction"/>
<rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<size x="0" y="0" xunits="fraction" yunits="fraction"/>
</ScreenOverlay>
<ScreenOverlay>
<name>Absolute Positioning: Bottom left</name>
<visibility>0</visibility>
<Icon>
<href>http://developers.google.com/kml/documentation/images/bottom_left.jpg</href>
</Icon>
<overlayXY x="0" y="-1" xunits="fraction" yunits="fraction"/>
<screenXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<size x="0" y="0" xunits="fraction" yunits="fraction"/>
</ScreenOverlay>
<ScreenOverlay>
<name>Absolute Positioning: Bottom right</name>
<visibility>0</visibility>
<Icon>
<href>http://developers.google.com/kml/documentation/images/bottom_right.jpg</href>
</Icon>
<overlayXY x="1" y="-1" xunits="fraction" yunits="fraction"/>
<screenXY x="1" y="0" xunits="fraction" yunits="fraction"/>
<rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<size x="0" y="0" xunits="fraction" yunits="fraction"/>
</ScreenOverlay>
<ScreenOverlay>
<name>Dynamic Positioning: Top of screen</name>
<visibility>0</visibility>
<Icon>
<href>http://developers.google.com/kml/documentation/images/dynamic_screenoverlay.jpg</href>
</Icon>
<overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/>
<screenXY x="0" y="1" xunits="fraction" yunits="fraction"/>
<rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<size x="1" y="0.2" xunits="fraction" yunits="fraction"/>
</ScreenOverlay>
<ScreenOverlay>
<name>Dynamic Positioning: Right of screen</name>
<visibility>0</visibility>
<Icon>
<href>http://developers.google.com/kml/documentation/images/dynamic_right.jpg</href>
</Icon>
<overlayXY x="1" y="1" xunits="fraction" yunits="fraction"/>
<screenXY x="1" y="1" xunits="fraction" yunits="fraction"/>
<rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/>
<size x="0" y="1" xunits="fraction" yunits="fraction"/>
</ScreenOverlay>
</Folder>
<Folder>
<name>Paths</name>
<visibility>0</visibility>
<description>Examples of paths. Note that the tessellate tag is by default
set to 0. If you want to create tessellated lines, they must be authored
(or edited) directly in KML.</description>
<Placemark>
<name>Tessellated</name>
<visibility>0</visibility>
<description><![CDATA[If the <tessellate> tag has a value of 1, the line will contour to the underlying terrain]]></description>
<LookAt>
<longitude>-112.0822680013139</longitude>
<latitude>36.09825589333556</latitude>
<altitude>0</altitude>
<heading>103.8120432044965</heading>
<tilt>62.04855796276328</tilt>
<range>2889.145007690472</range>
</LookAt>
<LineString>
<tessellate>1</tessellate>
<coordinates> -112.0814237830345,36.10677870477137,0
-112.0870267752693,36.0905099328766,0 </coordinates>
</LineString>
</Placemark>
<Placemark>
<name>Untessellated</name>
<visibility>0</visibility>
<description><![CDATA[If the <tessellate> tag has a value of 0, the line follow a simple straight-line path from point to point]]></description>
<LookAt>
<longitude>-112.0822680013139</longitude>
<latitude>36.09825589333556</latitude>
<altitude>0</altitude>
<heading>103.8120432044965</heading>
<tilt>62.04855796276328</tilt>
<range>2889.145007690472</range>
</LookAt>
<LineString>
<tessellate>0</tessellate>
<coordinates> -112.080622229595,36.10673460007995,0
-112.085242575315,36.09049598612422,0 </coordinates>
</LineString>
</Placemark>
<Placemark>
<name>Absolute</name>
<visibility>0</visibility>
<description>Transparent purple line</description>
<LookAt>
<longitude>-112.2719329043177</longitude>
<latitude>36.08890633450894</latitude>
<altitude>0</altitude>
<heading>-106.8161545998597</heading>
<tilt>44.60763714063257</tilt>
<range>2569.386744398339</range>
</LookAt>
<styleUrl>#transPurpleLineGreenPoly</styleUrl>
<LineString>
<tessellate>1</tessellate>
<altitudeMode>absolute</altitudeMode>
<coordinates> -112.265654928602,36.09447672602546,2357
-112.2660384528238,36.09342608838671,2357
-112.2668139013453,36.09251058776881,2357
-112.2677826834445,36.09189827357996,2357
-112.2688557510952,36.0913137941187,2357
-112.2694810717219,36.0903677207521,2357
-112.2695268555611,36.08932171487285,2357
-112.2690144567276,36.08850916060472,2357
-112.2681528815339,36.08753813597956,2357
-112.2670588176031,36.08682685262568,2357
-112.2657374587321,36.08646312301303,2357 </coordinates>
</LineString>
</Placemark>
<Placemark>
<name>Absolute Extruded</name>
<visibility>0</visibility>
<description>Transparent green wall with yellow outlines</description>
<LookAt>
<longitude>-112.2643334742529</longitude>
<latitude>36.08563154742419</latitude>
<altitude>0</altitude>
<heading>-125.7518698668815</heading>
<tilt>44.61038665812578</tilt>
<range>4451.842204068102</range>
</LookAt>
<styleUrl>#yellowLineGreenPoly</styleUrl>
<LineString>
<extrude>1</extrude>
<tessellate>1</tessellate>
<altitudeMode>absolute</altitudeMode>
<coordinates> -112.2550785337791,36.07954952145647,2357
-112.2549277039738,36.08117083492122,2357
-112.2552505069063,36.08260761307279,2357
-112.2564540158376,36.08395660588506,2357
-112.2580238976449,36.08511401044813,2357
-112.2595218489022,36.08584355239394,2357
-112.2608216347552,36.08612634548589,2357
-112.262073428656,36.08626019085147,2357
-112.2633204928495,36.08621519860091,2357
-112.2644963846444,36.08627897945274,2357
-112.2656969554589,36.08649599090644,2357 </coordinates>
</LineString>
</Placemark>
<Placemark>
<name>Relative</name>
<visibility>0</visibility>
<description>Black line (10 pixels wide), height tracks terrain</description>
<LookAt>
<longitude>-112.2580438551384</longitude>
<latitude>36.1072674824385</latitude>
<altitude>0</altitude>
<heading>4.947421249553717</heading>
<tilt>44.61324882043339</tilt>
<range>2927.61105910266</range>
</LookAt>
<styleUrl>#thickBlackLine</styleUrl>
<LineString>
<tessellate>1</tessellate>
<altitudeMode>relativeToGround</altitudeMode>
<coordinates> -112.2532845153347,36.09886943729116,645
-112.2540466121145,36.09919570465255,645
-112.254734666947,36.09984998366178,645
-112.255493345654,36.10051310621746,645
-112.2563157098468,36.10108441943419,645
-112.2568033076439,36.10159722088088,645
-112.257494011321,36.10204323542867,645
-112.2584106072308,36.10229131995655,645
-112.2596588987972,36.10240001286358,645
-112.2610581199487,36.10213176873407,645
-112.2626285262793,36.10157011437219,645 </coordinates>
</LineString>
</Placemark>
<Placemark>
<name>Relative Extruded</name>
<visibility>0</visibility>
<description>Opaque blue walls with red outline, height tracks terrain</description>
<LookAt>
<longitude>-112.2683594333433</longitude>
<latitude>36.09884362144909</latitude>
<altitude>0</altitude>
<heading>-72.24271551768405</heading>
<tilt>44.60855445139561</tilt>
<range>2184.193522571467</range>
</LookAt>
<styleUrl>#redLineBluePoly</styleUrl>
<LineString>
<extrude>1</extrude>
<tessellate>1</tessellate>
<altitudeMode>relativeToGround</altitudeMode>
<coordinates> -112.2656634181359,36.09445214722695,630
-112.2652238941097,36.09520916122063,630
-112.2645079986395,36.09580763864907,630
-112.2638827428817,36.09628572284063,630
-112.2635746835406,36.09679275951239,630
-112.2635711822407,36.09740038871899,630
-112.2640296531825,36.09804913435539,630
-112.264327720538,36.09880337400301,630
-112.2642436562271,36.09963644790288,630
-112.2639148687042,36.10055381117246,630
-112.2626894973474,36.10149062823369,630 </coordinates>
</LineString>
</Placemark>
</Folder>
<Folder>
<name>Polygons</name>
<visibility>0</visibility>
<description>Examples of polygon shapes</description>
<Folder>
<name>Google Campus</name>
<visibility>0</visibility>
<description>A collection showing how easy it is to create 3-dimensional
buildings</description>
<LookAt>
<longitude>-122.084120030116</longitude>
<latitude>37.42174011925477</latitude>
<altitude>0</altitude>
<heading>-34.82469740081282</heading>
<tilt>53.454348562403</tilt>
<range>276.7870053764046</range>
</LookAt>
<Placemark>
<name>Building 40</name>
<visibility>0</visibility>
<styleUrl>#transRedPoly</styleUrl>
<Polygon>
<extrude>1</extrude>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -122.0848938459612,37.42257124044786,17
-122.0849580979198,37.42211922626856,17
-122.0847469573047,37.42207183952619,17
-122.0845725380962,37.42209006729676,17
-122.0845954886723,37.42215932700895,17
-122.0838521118269,37.42227278564371,17
-122.083792243335,37.42203539112084,17
-122.0835076656616,37.42209006957106,17
-122.0834709464152,37.42200987395161,17
-122.0831221085748,37.4221046494946,17
-122.0829247374572,37.42226503990386,17
-122.0829339169385,37.42231242843094,17
-122.0833837359737,37.42225046087618,17
-122.0833607854248,37.42234159228745,17
-122.0834204551642,37.42237075460644,17
-122.083659133885,37.42251292011001,17
-122.0839758438952,37.42265873093781,17
-122.0842374743331,37.42265143972521,17
-122.0845036949503,37.4226514386435,17
-122.0848020460801,37.42261133916315,17
-122.0847882750515,37.42256395055121,17
-122.0848938459612,37.42257124044786,17 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
<Placemark>
<name>Building 41</name>
<visibility>0</visibility>
<styleUrl>#transBluePoly</styleUrl>
<Polygon>
<extrude>1</extrude>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -122.0857412771483,37.42227033155257,17
-122.0858169768481,37.42231408832346,17
-122.085852582875,37.42230337469744,17
-122.0858799945639,37.42225686138789,17
-122.0858860101409,37.4222311076138,17
-122.0858069157288,37.42220250173855,17
-122.0858379542653,37.42214027058678,17
-122.0856732640519,37.42208690214408,17
-122.0856022926407,37.42214885429042,17
-122.0855902778436,37.422128290487,17
-122.0855841672237,37.42208171967246,17
-122.0854852065741,37.42210455874995,17
-122.0855067264352,37.42214267949824,17
-122.0854430712915,37.42212783846172,17
-122.0850990714904,37.42251282407603,17
-122.0856769818632,37.42281815323651,17
-122.0860162273783,37.42244918858722,17
-122.0857260327004,37.42229239604253,17
-122.0857412771483,37.42227033155257,17 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
<Placemark>
<name>Building 42</name>
<visibility>0</visibility>
<styleUrl>#transGreenPoly</styleUrl>
<Polygon>
<extrude>1</extrude>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -122.0857862287242,37.42136208886969,25
-122.0857312990603,37.42136935989481,25
-122.0857312992918,37.42140934910903,25
-122.0856077073679,37.42138390166565,25
-122.0855802426516,37.42137299550869,25
-122.0852186221971,37.42137299504316,25
-122.0852277765639,37.42161656508265,25
-122.0852598189347,37.42160565894403,25
-122.0852598185499,37.42168200156,25
-122.0852369311478,37.42170017860346,25
-122.0852643957828,37.42176197982575,25
-122.0853239032746,37.42176198013907,25
-122.0853559454324,37.421852864452,25
-122.0854108752463,37.42188921823734,25
-122.0854795379357,37.42189285337048,25
-122.0855436229819,37.42188921797546,25
-122.0856260178042,37.42186013499926,25
-122.085937287963,37.42186013453605,25
-122.0859428718666,37.42160898590042,25
-122.0859655469861,37.42157992759144,25
-122.0858640462341,37.42147115002957,25
-122.0858548911215,37.42140571326184,25
-122.0858091162768,37.4214057134039,25
-122.0857862287242,37.42136208886969,25 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
<Placemark>
<name>Building 43</name>
<visibility>0</visibility>
<styleUrl>#transYellowPoly</styleUrl>
<Polygon>
<extrude>1</extrude>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -122.0844371128284,37.42177253003091,19
-122.0845118855746,37.42191111542896,19
-122.0850470999805,37.42178755121535,19
-122.0850719913391,37.42143663023161,19
-122.084916406232,37.42137237822116,19
-122.0842193868167,37.42137237801626,19
-122.08421938659,37.42147617161496,19
-122.0838086419991,37.4214613409357,19
-122.0837899728564,37.42131306410796,19
-122.0832796534698,37.42129328840593,19
-122.0832609819207,37.42139213944298,19
-122.0829373621737,37.42137236399876,19
-122.0829062425667,37.42151569778871,19
-122.0828502269665,37.42176282576465,19
-122.0829435788635,37.42176776969635,19
-122.083217411188,37.42179248552686,19
-122.0835970430103,37.4217480074456,19
-122.0839455556771,37.42169364237603,19
-122.0840077894637,37.42176283815853,19
-122.084113587521,37.42174801104392,19
-122.0840762473784,37.42171341292375,19
-122.0841447047739,37.42167881534569,19
-122.084144704223,37.42181720660197,19
-122.0842503333074,37.4218170700446,19
-122.0844371128284,37.42177253003091,19 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
</Folder>
<Folder>
<name>Extruded Polygon</name>
<description>A simple way to model a building</description>
<Placemark>
<name>The Pentagon</name>
<LookAt>
<longitude>-77.05580139178142</longitude>
<latitude>38.870832443487</latitude>
<heading>59.88865561738225</heading>
<tilt>48.09646074797388</tilt>
<range>742.0552506670548</range>
</LookAt>
<Polygon>
<extrude>1</extrude>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -77.05788457660967,38.87253259892824,100
-77.05465973756702,38.87291016281703,100
-77.05315536854791,38.87053267794386,100
-77.05552622493516,38.868757801256,100
-77.05844056290393,38.86996206506943,100
-77.05788457660967,38.87253259892824,100 </coordinates>
</LinearRing>
</outerBoundaryIs>
<innerBoundaryIs>
<LinearRing>
<coordinates> -77.05668055019126,38.87154239798456,100
-77.05542625960818,38.87167890344077,100
-77.05485125901024,38.87076535397792,100
-77.05577677433152,38.87008686581446,100
-77.05691162017543,38.87054446963351,100
-77.05668055019126,38.87154239798456,100 </coordinates>
</LinearRing>
</innerBoundaryIs>
</Polygon>
</Placemark>
</Folder>
<Folder>
<name>Absolute and Relative</name>
<visibility>0</visibility>
<description>Four structures whose roofs meet exactly. Turn on/off
terrain to see the difference between relative and absolute
positioning.</description>
<LookAt>
<longitude>-112.3348969157552</longitude>
<latitude>36.14845533214919</latitude>
<altitude>0</altitude>
<heading>-86.91235037566909</heading>
<tilt>49.30695423894192</tilt>
<range>990.6761201087104</range>
</LookAt>
<Placemark>
<name>Absolute</name>
<visibility>0</visibility>
<styleUrl>#transBluePoly</styleUrl>
<Polygon>
<tessellate>1</tessellate>
<altitudeMode>absolute</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -112.3372510731295,36.14888505105317,1784
-112.3356128688403,36.14781540589019,1784
-112.3368169371048,36.14658677734382,1784
-112.3384408457543,36.14762778914076,1784
-112.3372510731295,36.14888505105317,1784 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
<Placemark>
<name>Absolute Extruded</name>
<visibility>0</visibility>
<styleUrl>#transRedPoly</styleUrl>
<Polygon>
<extrude>1</extrude>
<tessellate>1</tessellate>
<altitudeMode>absolute</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -112.3396586818843,36.14637618647505,1784
-112.3380597654315,36.14531751871353,1784
-112.3368254237788,36.14659596244607,1784
-112.3384555043203,36.14762621763982,1784
-112.3396586818843,36.14637618647505,1784 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
<Placemark>
<name>Relative</name>
<visibility>0</visibility>
<LookAt>
<longitude>-112.3350152490417</longitude>
<latitude>36.14943123077423</latitude>
<altitude>0</altitude>
<heading>-118.9214100848499</heading>
<tilt>37.92486261093203</tilt>
<range>345.5169113679813</range>
</LookAt>
<styleUrl>#transGreenPoly</styleUrl>
<Polygon>
<tessellate>1</tessellate>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -112.3349463145932,36.14988705767721,100
-112.3354019540677,36.14941108398372,100
-112.3344428289146,36.14878490381308,100
-112.3331289492913,36.14780840132443,100
-112.3317019516947,36.14680755678357,100
-112.331131440106,36.1474173426228,100
-112.332616324338,36.14845453364654,100
-112.3339876620524,36.14926570522069,100
-112.3349463145932,36.14988705767721,100 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
<Placemark>
<name>Relative Extruded</name>
<visibility>0</visibility>
<LookAt>
<longitude>-112.3351587892382</longitude>
<latitude>36.14979247129029</latitude>
<altitude>0</altitude>
<heading>-55.42811560891606</heading>
<tilt>56.10280503739589</tilt>
<range>401.0997279712519</range>
</LookAt>
<styleUrl>#transYellowPoly</styleUrl>
<Polygon>
<extrude>1</extrude>
<tessellate>1</tessellate>
<altitudeMode>relativeToGround</altitudeMode>
<outerBoundaryIs>
<LinearRing>
<coordinates> -112.3348783983763,36.1514008468736,100
-112.3372535345629,36.14888517553886,100
-112.3356068927954,36.14781612679284,100
-112.3350034807972,36.14846469024177,100
-112.3358353861232,36.1489624162954,100
-112.3345888301373,36.15026229372507,100
-112.3337937856278,36.14978096026463,100
-112.3331798208424,36.1504472788618,100
-112.3348783983763,36.1514008468736,100 </coordinates>
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>
</Folder>
</Folder>
</Document>
</kml>

View file

@ -0,0 +1,19 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/tile/Bing.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.6755, 33.936), zoom: 10 });
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var bing = new L.BingLayer("Anqm0F_JjIZvT0P3abS6KONpaBaKuTnITRrnYuiJCE0WOhH6ZbE4DzeT6brvKVR5");
map.addLayer(bing);
map.addControl(new L.Control.Layers({'OSM':osm, "Bing":bing}, {}));
</script>
</body>
</html>

View file

@ -0,0 +1,54 @@
<html>
<head>
<title>Leaflet</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<!--<script src="http://api-maps.yandex.ru/2.0/?load=package.map&lang=ru-RU" type="text/javascript"></script>-->
<script src="../layer/Layer.Deferred.js"></script>
<!--<script src="../layer/tile/Yandex.js"></script>-->
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.6755, 33.936), zoom: 10, zoomAnimation: false });
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
var layerdefs = {
mapnik: { name: "Mapnik", js: [],
init: function() {return new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');}},
kosmo: { name: "Космоснимки", js: [],
init: function() {return new L.TileLayer('http://{s}.tile.osmosnimki.ru/kosmo/{z}/{x}/{y}.png', {attribution:'Tiles Courtesy of <a href="http://kosmosnimki.ru/" target="_blank">kosmosnimki.ru</a>'});}},
gsat: { name: "Google", js: ["../layer/tile/Google.js", "http://maps.google.com/maps/api/js?v=3&sensor=false&callback=L.Google.asyncInitialize"],
init: function() {return new L.Google(); }},
ysat: { name: "Yandex", js: ["../layer/tile/Yandex.js", "http://api-maps.yandex.ru/2.0/?load=package.map&lang=ru-RU"],
init: function() {return new L.Yandex("satellite"); }},
nyak: { name: "НЯК", js: ["../layer/tile/Yandex.js", "http://api-maps.yandex.ru/2.0/?load=package.map&lang=ru-RU"],
init: function() {return new L.Yandex("publicMap"); }},
traffic: { name: "Пробки", js: ["../layer/tile/Yandex.js", "http://api-maps.yandex.ru/2.0/?load=package.map&lang=ru-RU"],
init: function() {return new L.Yandex("null", {traffic: true, opacity: 0.8, overlay: true}); }, overlay: true},
mso: { name: "Mapsurfer", js: [], overlay: true,
init: function() {return new L.TileLayer('http://129.206.74.245:8003/tms_h.ashx?x={x}&y={y}&z={z}');}}
};
var yndx = new L.DeferredLayer(layerdefs.ysat);
var kosmo = new L.DeferredLayer(layerdefs.kosmo);
var google = new L.DeferredLayer(layerdefs.gsat);
var ytraffic = new L.DeferredLayer(layerdefs.traffic);
var mso = new L.DeferredLayer(layerdefs.mso);
L.control.layers(
{
'OSM':osm,
"Kosmo":kosmo,
"Google":google,
"Yandex":yndx
},{
"Пробки":ytraffic,
"OpenMapSurfer":mso
}
).addTo(map);
</script>
</body>
</html>

View file

@ -0,0 +1,36 @@
<html>
<!--
vim: sts=4 sw=4 et
-->
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<link rel="stylesheet" href="../css/distance.css" />
<link rel="stylesheet" href="http://leaflet.github.io/Leaflet.draw/leaflet.draw.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="http://leaflet.github.io/Leaflet.draw/leaflet.draw.js"></script>
<script src="../layer/vector/GPX.js"></script>
<script src="../control/Scale.js"></script>
<script src="../control/Permalink.js"></script>
<script src="../control/Permalink.Line.js"></script>
<script src="../control/Distance.js"></script>
</head>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
</script>
<script type="text/javascript">
var map = new L.Map('map', {center: new L.LatLng(58.4, 43.0), zoom: 11});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
map.addLayer(osm);
var d = new L.Control.Distance(); map.addControl(d);
map.addControl(new L.Control.Scale());
map.addControl(new L.Control.Permalink({line: d.getLine(), useLocation: true}));
</script>
</body>
</html>

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,33 @@
<html>
<head>
<title>Google Custom Styles // Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="http://maps.google.com/maps/api/js?v=3&sensor=false"></script>
<script src="../layer/tile/Google.js"></script>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(53.9618, 58.4277), zoom: 13});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var styles = [
{
featureType: 'all',
stylers: [{hue: '#ff0000'}]
}
];
var ggl = new L.Google('ROADMAP', {
mapOptions: {
styles: styles
}
});
map.addLayer(ggl);
map.addControl(new L.Control.Layers( {'OSM':osm, 'Google':ggl}, {}));
</script>
</body>
</html>

View file

@ -0,0 +1,22 @@
<html>
<head>
<title>Google // Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="http://maps.google.com/maps/api/js?v=3&sensor=false"></script>
<script src="../layer/tile/Google.js"></script>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(53.9618, 58.4277), zoom: 13});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var ggl = new L.Google();
var ggl2 = new L.Google('TERRAIN');
map.addLayer(ggl);
map.addControl(new L.Control.Layers( {'OSM':osm, 'Google':ggl, 'Google Terrain':ggl2}, {}));
</script>
</body>
</html>

View file

@ -0,0 +1,24 @@
<html>
<head>
<title>Leaflet - GPX track without Waypoints</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/vector/GPX.js"></script>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(58.4, 43.0), zoom: 11});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var track = new L.GPX("fells_loop.gpx", {async: true, display_wpt:false})
.on("loaded", function(e) { map.fitBounds(e.target.getBounds()); });
map.addLayer(track);
map.addLayer(osm);
map.addControl(new L.Control.Layers({}, {'GPX':track}));
</script>
</body>
</html>

View file

@ -0,0 +1,26 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/vector/GPX.js"></script>
<script src="../layer/vector/GPX.Speed.js"></script>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(58.4, 43.0), zoom: 11});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var track = new L.GPX("speed.gpx", {async: true})
.on("loaded", function(e) { map.fitBounds(e.target.getBounds()); })
.speedSplitEnable({maxSpeed: 100, chunks: 1000});
map.addLayer(track);
map.addLayer(osm);
map.addControl(new L.Control.Layers({}, {'GPX':track}));
</script>
</body>
</html>

View file

@ -0,0 +1,24 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/vector/GPX.js"></script>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(58.4, 43.0), zoom: 11});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var track = new L.GPX("fells_loop.gpx", {async: true})
.on("loaded", function(e) { map.fitBounds(e.target.getBounds()); });
map.addLayer(track);
map.addLayer(osm);
map.addControl(new L.Control.Layers({}, {'GPX':track}));
</script>
</body>
</html>

View file

@ -0,0 +1,24 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/vector/KML.js"></script>
</head>
<body>
<!-- define a DIV into which the map will appear. Make it take up the whole window -->
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(58.4, 43.0), zoom: 11});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var track = new L.KML("KML_Samples.kml", {async: true});
track.on("loaded", function(e) { map.fitBounds(e.target.getBounds()); });
map.addLayer(track);
map.addLayer(osm);
map.addControl(new L.Control.Layers({}, {'Track':track}));
</script>
</body>
</html>

View file

@ -0,0 +1,39 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/Icon.Canvas.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.66904, 33.68595), zoom: 10});
map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'));
var circle = new L.Icon.Canvas({iconSize: new L.Point(30, 30)});
circle.draw = function(ctx, w, h) {
ctx.translate(w/2, h/2);
ctx.beginPath();
ctx.fillStyle = "#F00";
ctx.arc(0, 0, w/2-1, 0, Math.PI*2, true);
ctx.fill();
ctx.lineWidth = 2;
ctx.strokeStyle = '#FFF';
ctx.moveTo(-w/5, -h/5);
ctx.lineTo(w/5, h/5);
ctx.moveTo(-w/5, h/5);
ctx.lineTo(w/5, -h/5);
ctx.stroke();
ctx.closePath();
}
map.addLayer(new L.Marker(map.getCenter(), {icon: circle, draggable: true, opacity: 0.7}));
</script>
</body>
</html>

View file

@ -0,0 +1,27 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/Marker.Rotate.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.6755, 33.936), zoom: 10});
map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'));
var marker = new L.Marker(map.getCenter(), {iconAngle: 90});
map.addLayer(marker);
var angle = 0;
function _rotate() {
marker.setIconAngle(angle);
angle = (angle + 10) % 360;
setTimeout(_rotate, 1000);
}
_rotate();
</script>
</body>
</html>

View file

@ -0,0 +1,21 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/Marker.Text.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.66904, 33.68595), zoom: 10});
map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'));
var marker = new L.Marker.Text(map.getCenter(), 'Sweet!');
map.addLayer(new L.Marker(map.getCenter(), {opacity: 0.5}));
map.addLayer(marker);
</script>
</body>
</html>

View file

@ -0,0 +1,24 @@
<html>
<!--
vim: sts=4 sw=4 et
-->
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<link rel="stylesheet" href="../css/osb.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/OpenStreetBugs.js"></script>
</head>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type="text/javascript">
var map = new L.Map('map', {center: new L.LatLng(57.62, 39.89), zoom: 11});
map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'));
map.addLayer(new L.OpenStreetBugs());
</script>
</body>
</html>

View file

@ -0,0 +1,21 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../layer/vector/OSM.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(55.7, 37.6), zoom: 9, zoomAnimation: false });
map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'));
var layer = new L.OSM('ulugo.osm')
.on("loaded", function(e) { map.fitBounds(e.target.getBounds()); });
map.addLayer(layer);
map.addControl(new L.Control.Layers({}, {"OSM":layer}));
</script>
</body>
</html>

View file

@ -0,0 +1,23 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="../control/Permalink.js"></script>
<script src="../control/Permalink.Marker.js"></script>
<script src="../control/Permalink.Layer.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.6755, 33.936), zoom: 10});
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
map.addLayer(osm);
var kosm = new L.TileLayer('http://{s}.tile.osmosnimki.ru/kosmo/{z}/{x}/{y}.png', {attribution:'Tiles Courtesy of <a href="http://kosmosnimki.ru/" target="_blank">kosmosnimki.ru</a>'});
var layers = new L.Control.Layers({'OSM':osm, "Kosmo":kosm});
map.addControl(layers);
map.addControl(new L.Control.Permalink({text: 'Permalink', layers: layers}));
</script>
</body>
</html>

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,24 @@
<html>
<head>
<title>Leaflet</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="http://api-maps.yandex.ru/2.0/?load=package.map&lang=ru-RU" type="text/javascript"></script>
<script src="../layer/tile/Yandex.js"></script>
</head>
<body>
<div style="width:100%; height:100%" id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(67.6755, 33.936), zoom: 10, zoomAnimation: false });
var osm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
var yndx = new L.Yandex();
var ytraffic = new L.Yandex("null", {traffic:true, opacity:0.8, overlay:true});
map.addLayer(osm);
map.addLayer(ytraffic);
map.addControl(new L.Control.Layers({'OSM':osm, "Yandex":yndx},
{"Traffic":ytraffic}));
</script>
</body>
</html>

View file

@ -0,0 +1,27 @@
L.Icon.Canvas = L.Icon.extend({
options: {
iconSize: new L.Point(20, 20), // Have to be supplied
/*
iconAnchor: (Point)
popupAnchor: (Point)
*/
className: 'leaflet-canvas-icon'
},
createIcon: function () {
var e = document.createElement('canvas');
this._setIconStyles(e, 'icon');
var s = this.options.iconSize;
e.width = s.x
e.height = s.y;
this.draw(e.getContext('2d'), s.x, s.y);
return e;
},
createShadow: function () {
return null;
},
draw: function(canvas, width, height) {
}
});

View file

@ -0,0 +1,57 @@
L.DeferredLayer = L.LayerGroup.extend({
options: {
js: [],
init: null
},
_script_cache: {},
initialize: function(options) {
L.Util.setOptions(this, options);
L.LayerGroup.prototype.initialize.apply(this);
this._loaded = false;
},
onAdd: function(map) {
L.LayerGroup.prototype.onAdd.apply(this, [map]);
if (this._loaded) return;
//console.info("Script cache", this._script_cache);
var loaded = function() {
//console.info("Loaded", this, this.options);
this._loaded = true;
var l = this.options.init();
if (l)
this.addLayer(l);
}
this._loadScripts(this.options.js.reverse(), L.Util.bind(loaded, this));
},
_loadScripts: function(scripts, cb, args) {
if (!scripts || scripts.length == 0)
return cb(args);
var _this = this, s = scripts.pop(), c;
c = this._script_cache[s];
if (c === undefined) {
c = {url: s, wait: []};
//console.info("Load ", s);
var script = document.createElement('script');
script.src = s;
script.type = 'text/javascript';
script.onload = function () {
//console.info("Element(cb)", c.e.readyState);
c.e.readyState = "completed";
var i = 0;
for (i = 0; i < c.wait.length; i++)
c.wait[i]();
}
c.e = script;
document.getElementsByTagName('head')[0].appendChild(script);
}
function _cb() { _this._loadScripts(scripts, cb, args); }
c.wait.push(_cb);
//console.info("Element", c.e.readyState);
if (c.e.readyState == "completed")
_cb();
this._script_cache[s] = c;
}
});

View file

@ -0,0 +1,53 @@
/*
* Based on comments by @runanet and @coomsie
* https://github.com/CloudMade/Leaflet/issues/386
*
* Wrapping function is needed to preserve L.Marker.update function
*/
(function () {
var _old__setPos = L.Marker.prototype._setPos;
L.Marker.include({
_updateImg: function(i, a, s) {
a = L.point(s).divideBy(2)._subtract(L.point(a));
var transform = '';
transform += ' translate(' + -a.x + 'px, ' + -a.y + 'px)';
transform += ' rotate(' + this.options.iconAngle + 'deg)';
transform += ' translate(' + a.x + 'px, ' + a.y + 'px)';
i.style[L.DomUtil.TRANSFORM] += transform;
},
setIconAngle: function (iconAngle) {
this.options.iconAngle = iconAngle;
if (this._map) this.update();
},
_setPos: function (pos) {
if (this._icon) {
this._icon.style[L.DomUtil.TRANSFORM] = "";
}
if (this._shadow) {
this._shadow.style[L.DomUtil.TRANSFORM] = "";
}
_old__setPos.apply(this,[pos]);
if (this.options.iconAngle) {
var a = this.options.icon.options.iconAnchor;
var s = this.options.icon.options.iconSize;
var i;
if (this._icon) {
i = this._icon;
this._updateImg(i, a, s);
}
if (this._shadow) {
// Rotate around the icons anchor.
s = this.options.icon.options.shadowSize;
i = this._shadow;
this._updateImg(i, a, s);
}
} }
});
}());

View file

@ -0,0 +1,51 @@
L.Icon.Text = L.Icon.extend({
initialize: function (text, options) {
this._text = text;
L.Icon.prototype.initialize.apply(this, [options]);
},
createIcon: function() {
var el = document.createElement('div');
el.appendChild(document.createTextNode(this._text));
this._setIconStyles(el, 'icon');
el.style.textShadow = "2px 2px 2px #fff";
return el;
},
createShadow: function() { return null; }
});
L.Marker.Text = L.Marker.extend({
initialize: function (latlng, text, options) {
L.Marker.prototype.initialize.apply(this, [latlng, options]);
this._fakeicon = new L.Icon.Text(text);
},
_initIcon: function() {
L.Marker.prototype._initIcon.apply(this);
var i = this._icon, s = this._shadow, obj = this.options.icon
this._icon = this._shadow = null;
this.options.icon = this._fakeicon;
L.Marker.prototype._initIcon.apply(this);
this.options.icon = obj;
if (s) {
s.parentNode.removeChild(s);
this._icon.appendChild(s);
}
i.parentNode.removeChild(i);
this._icon.appendChild(i);
var w = this._icon.clientWidth, h = this._icon.clientHeight;
this._icon.style.marginLeft = -w / 2 + "px";
//this._icon.style.backgroundColor = "red";
var off = new L.Point(w/2, 0);
if (L.Browser.webkit) off.y = -h;
L.DomUtil.setPosition(i, off);
if (s) L.DomUtil.setPosition(s, off);
}
});

View file

@ -0,0 +1,497 @@
L.OpenStreetBugs = L.FeatureGroup.extend({
options : {
serverURL : "http://openstreetbugs.schokokeks.org/api/0.1/",
readonly : false,
setCookie : true,
username : "NoName",
cookieLifetime : 1000,
cookiePath : null,
permalinkZoom : 14,
permalinkUrl: null,
opacity : 0.7,
showOpen: true,
showClosed: true,
iconOpen: "http://openstreetbugs.schokokeks.org/client/open_bug_marker.png",
iconClosed:"http://openstreetbugs.schokokeks.org/client/closed_bug_marker.png",
iconActive: undefined,
editArea: 0.01,
popupOptions: {autoPan: false},
dblClick: true
},
initialize : function(options)
{
var tmp = L.Util.extend({}, this.options.popupOptions, (options || {}).popupOptions)
L.Util.setOptions(this, options)
this.options.popupOptions = tmp;
putAJAXMarker.layers.push(this);
this.bugs = {};
this._layers = {};
var username = this.get_cookie("osbUsername");
if (username)
this.options.username = username;
L.OpenStreetBugs.setCSS();
},
onAdd : function(map)
{
L.FeatureGroup.prototype.onAdd.apply(this, [map]);
this._map.on("moveend", this.loadBugs, this);
this.loadBugs();
if (!this.options.readonly) {
if (this.options.dblClick) {
map.doubleClickZoom.disable();
map.on('dblclick', this.addBug, this);
}
else {
map.on('click', this.addBug, this);
}
}
this.fire('add');
},
onRemove : function(map)
{
this._map.off("moveend", this.loadBugs, this);
this._iterateLayers(map.removeLayer, map);
delete this._map;
if (!this.options.readonly) {
if (this.options.dblClick) {
map.doubleClickZoom.enable();
map.off('dblclick', this.addBug, this);
}
else {
map.off('click', this.addBug, this);
}
}
this.fire('remove');
},
set_cookie : function(name, value)
{
var expires = (new Date((new Date()).getTime() + 604800000)).toGMTString(); // one week from now
document.cookie = name+"="+escape(value)+";";
},
get_cookie : function(name)
{
var cookies = (document.cookie || '').split(/;\s*/);
for(var i=0; i<cookies.length; i++)
{
var cookie = cookies[i].split("=");
if(cookie[0] == name)
return unescape(cookie[1]);
}
return null;
},
loadBugs : function()
{
//if(!this.getVisibility())
// return true;
var bounds = this._map.getBounds();
if(!bounds) return false;
var sw = bounds.getSouthWest(), ne = bounds.getNorthEast();
function round(number, digits) {
var factor = Math.pow(10, digits);
return Math.round(number*factor)/factor;
}
this.apiRequest("getBugs"
+ "?t="+round(ne.lat, 5)
+ "&r="+round(ne.lng, 5)
+ "&b="+round(sw.lat, 5)
+ "&l="+round(sw.lng, 5));
},
apiRequest : function(url, reload)
{
var script = document.createElement("script");
script.type = "text/javascript";
script.src = this.options.serverURL + url + "&nocache="+(new Date()).getTime();
var _this = this;
script.onload = function(e) {
document.body.removeChild(this);
if (reload) _this.loadBugs();
};
document.body.appendChild(script);
},
createMarker: function(id, force)
{
var bug = putAJAXMarker.bugs[id];
if(this.bugs[id])
{
if (force || this.bugs[id].osb.closed != bug[2])
this.removeLayer(this.bugs[id]);
else
return;
}
var closed = bug[2];
if (closed && !this.options.showClosed) return;
if (!closed && !this.options.showOpen) return;
var icon_url = null;
var class_popup = ' osb';
if (bug[2]) {
icon_url = this.options.iconClosed;
class_popup += ' osbClosed';
}
else if (bug[1].length == 1) {
icon_url = this.options.iconOpen;
class_popup += ' osbOpen';
}
else {
if (this.options.iconActive) {
icon_url = this.options.iconActive;
class_popup += ' osbActive';
}
else {
icon_url = this.options.iconOpen;
class_popup += ' osbOpen';
}
}
var feature = new L.Marker(bug[0], {icon:new this.osbIcon({iconUrl: icon_url})});
feature.osb = {id: id, closed: closed};
this.addLayer(feature);
this.bugs[id] = feature;
this.setPopupContent(id);
feature._popup.options.className += class_popup;
if (this.options.bugid && (parseInt(this.options.bugid) == id))
feature.openPopup();
//this.events.triggerEvent("markerAdded");
},
osbIcon : L.Icon.extend({
options: {
iconUrl: 'http://openstreetbugs.schokokeks.org/client/open_bug_marker.png',
iconSize: new L.Point(22, 22),
shadowSize: new L.Point(0, 0),
iconAnchor: new L.Point(11, 11),
popupAnchor: new L.Point(0, -11)
}
}),
setPopupContent: function(id) {
if(this.bugs[id]._popup_content)
return;
var el1,el2,el3;
var layer = this;
var rawbug = putAJAXMarker.bugs[id];
var isclosed = rawbug[2];
var newContent = L.DomUtil.create('div', 'osb-popup');
var h1 = L.DomUtil.create('h1', null, newContent);
if (rawbug[2])
h1.textContent = L.i18n("Fixed Error");
else if (rawbug[1].length == 1)
h1.textContent = L.i18n("Unresolved Error");
else
h1.textContent = L.i18n("Active Error");
var divinfo = L.DomUtil.create('div', 'osb-info', newContent);
var table = L.DomUtil.create('table', 'osb-table', divinfo);
for(var i=0; i<rawbug[1].length; i++)
{
var tr = L.DomUtil.create('tr', "osb-tr-info", table);
tr.setAttribute("valign","top")
var td = L.DomUtil.create('td', "osb-td-nickname", tr);
td.textContent = rawbug[5][i] + ':';
var td = L.DomUtil.create('td', "osb-td-datetime", tr);
td.textContent = rawbug[6][i];
var td = L.DomUtil.create('td', "osb-td-comment", L.DomUtil.create('tr', "osb-tr-comment", table));
td.setAttribute("colspan","2");
td.setAttribute("charoff","2");
td.textContent = rawbug[4][i];
}
function create_link(ul, text) {
var a = L.DomUtil.create('a', null,
L.DomUtil.create('li', null, ul));
a.href = '#';
a.textContent = L.i18n(text);
return a;
};
var ul = L.DomUtil.create('ul', null, newContent);
var _this = this;
var bug = this.bugs[id];
function showComment(title, add_comment) {
h1.textContent_old = h1.textContent;
h1.textContent = L.i18n(title);
var form = _this.createCommentForm();
form.osbid.value = id;
form.cancel.onclick = function (e) {
h1.textContent = h1.textContent_old;
newContent.removeChild(form);
newContent.appendChild(ul);
}
form.ok.onclick = function(e) {
bug.closePopup();
if (!add_comment)
_this.closeBug(form);
else
_this.submitComment(form);
return false;
};
newContent.appendChild(form);
newContent.removeChild(ul);
return false;
};
if (!isclosed && !this.options.readonly) {
var a;
a = create_link(ul, "Add comment");
a.onclick = function(e) { return showComment("Add comment", true); }
a = create_link(ul, "Mark as Fixed");
a.onclick = function(e) { return showComment("Close bug", false); }
}
var a = create_link(ul, "JOSM");
a.onclick = function() { _this.remoteEdit(rawbug[0]); };
var a = create_link(ul, "Link");
var vars = {lat:rawbug[0].lat, lon:rawbug[0].lng, zoom:this.options.permalinkZoom, bugid:id}
if (this.options.permalinkUrl)
a.href = L.Util.template(this.options.permalinkUrl, vars)
else
a.href = location.protocol + '//' + location.host + location.pathname +
L.Util.getParamString(vars)
bug._popup_content = newContent;
bug.bindPopup(newContent, this.options.popupOptions);
bug._popup.options.maxWidth=410;
bug._popup.options.minWidth=410;
bug.on('mouseover', bug.openTempPopup, bug);
},
submitComment: function(form) {
if (!form.osbcomment.value) return;
var nickname = form.osbnickname.value || this.options.username;
this.apiRequest("editPOIexec"
+ "?id="+encodeURIComponent(form.osbid.value)
+ "&text="+encodeURIComponent(form.osbcomment.value + " [" + nickname + "]")
+ "&format=js", true
);
this.set_cookie("osbUsername",nickname);
this.options.username=nickname;
},
closeBug: function(form) {
var id = form.osbid.value;
this.submitComment(form);
this.apiRequest("closePOIexec"
+ "?id="+encodeURIComponent(id)
+ "&format=js", true
);
},
createCommentForm: function(elt) {
var form = L.DomUtil.create("form", 'osb-add-comment', elt);
var content = '';
content += '<input name="osbid" type="hidden"/>';
content += '<input name="osblat" type="hidden"/>';
content += '<input name="osblon" type="hidden"/>';
content += '<div><span class="osb-inputlabel">'+L.i18n('Nickname')+':</span><input type="text" name="osbnickname"></div>';
content += '<div><span class="osb-inputlabel">'+L.i18n('Comment')+':</span><input type="text" name="osbcomment"></div>';
content += '<div class="osb-formfooter"><input type="submit" name="ok"/><input type="button" name="cancel"/></div>';
form.innerHTML = content;
form.ok.value = L.i18n('OK');
form.cancel.value = L.i18n('Cancel');
form.osbnickname.value = this.options.username;
return form;
},
addBug: function(e) {
var newContent = L.DomUtil.create('div', 'osb-popup');
newContent.innerHTML += '<h1>'+L.i18n("New bug")+'</h1>';
newContent.innerHTML += '<div class="osbCreateInfo">'+L.i18n("Find your bug?")+'<br />'+L.i18n("Contact details and someone will fix it.")+'</div>';
var popup = new L.Popup();
var _this = this;
var form = this.createCommentForm(newContent);
form.osblat.value = e.latlng.lat;
form.osblon.value = e.latlng.lng;
form.ok.value = L.i18n("Add comment");
form.onsubmit = function(e) {
_this._map.closePopup(popup);
_this.createBug(form);
return false;
};
form.cancel.onclick = function(e) { _this._map.closePopup(popup); }
popup.setLatLng(e.latlng);
popup.setContent(newContent);
popup.options.maxWidth=410;
popup.options.minWidth=410;
popup.options.className += ' osb osbCreate'
this._map.openPopup(popup);
},
createBug: function(form) {
if (!form.osbcomment.value) return;
var nickname = form.osbnickname.value || this.options.username;
this.apiRequest("addPOIexec"
+ "?lat="+encodeURIComponent(form.osblat.value)
+ "&lon="+encodeURIComponent(form.osblon.value)
+ "&text="+encodeURIComponent(form.osbcomment.value + " [" + nickname + "]")
+ "&format=js", true
);
this.set_cookie("osbUsername",nickname);
this.options.username=nickname;
},
remoteEdit: function(x) {
var ydelta = this.options.editArea || 0.01;
var xdelta = ydelta * 2;
var p = [ 'left=' + (x.lng - xdelta), 'bottom=' + (x.lat - ydelta)
, 'right=' + (x.lng + xdelta), 'top=' + (x.lat + ydelta)];
var url = 'http://localhost:8111/load_and_zoom?' + p.join('&');
var frame = L.DomUtil.create('iframe', null);
frame.style.display = 'none';
frame.src = url;
document.body.appendChild(frame);
frame.onload = function(e) { document.body.removeChild(frame); };
return false;
}
})
L.OpenStreetBugs.setCSS = function() {
if(L.OpenStreetBugs.setCSS.done)
return;
else
L.OpenStreetBugs.setCSS.done = true;
// See http://www.hunlock.com/blogs/Totally_Pwn_CSS_with_Javascript
var idx = 0;
var addRule = function(selector, rules) {
var s = document.styleSheets[0];
var rule;
if(s.addRule) // M$IE
rule = s.addRule(selector, rules, idx);
else
rule = s.insertRule(selector + " { " + rules + " }", idx);
s.style = L.Util.extend(s.style || {}, rules);
idx++;
};
addRule(".osb-popup dl", 'margin:0; padding:0;');
addRule(".osb-popup dt", 'margin:0; padding:0; font-weight:bold; float:left; clear:left;');
addRule(".osb-popup dt:after", 'content: ": ";');
addRule("* html .osb-popup dt", 'margin-right:1ex;');
addRule(".osb-popup dd", 'margin:0; padding:0;');
addRule(".osb-popup ul.buttons", 'list-style-type:none; padding:0; margin:0;');
addRule(".osb-popup ul.buttons li", 'display:inline; margin:0; padding:0;');
addRule(".osb-popup h3", 'font-size:1.2em; margin:.2em 0 .7em 0;');
};
function putAJAXMarker(id, lon, lat, text, closed)
{
var comments = text.split(/<hr \/>/);
var comments_only = []
var nickname = [];
var datetime = [];
var info = null;
var isplit = 0;
for(var i=0; i<comments.length; i++) {
info = null;
isplit = 0;
comments[i] = comments[i].replace(/&quot;/g, "\"").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&");
isplit = comments[i].lastIndexOf("[");
if (isplit > 0) {
comments_only[i] = comments[i].substr(0,isplit-1);
info = comments[i].substr(isplit+1);
nickname[i] = info.substr(0,info.lastIndexOf(","));
datetime[i] = info.substr(info.lastIndexOf(",")+2);
datetime[i] = datetime[i].substr(0,datetime[i].lastIndexOf("]"));
}
else {
comments_only[i] = comments[i];
}
}
var old = putAJAXMarker.bugs[id];
putAJAXMarker.bugs[id] = [
new L.LatLng(lat, lon),
comments,
closed,
text,
comments_only,
nickname,
datetime
];
var force = (old && old[3]) != text;
for(var i=0; i<putAJAXMarker.layers.length; i++)
putAJAXMarker.layers[i].createMarker(id, force);
}
function osbResponse(error)
{
if(error)
alert("Error: "+error);
return;
for(var i=0; i<putAJAXMarker.layers.length; i++)
putAJAXMarker.layers[i].loadBugs();
}
putAJAXMarker.layers = [ ];
putAJAXMarker.bugs = { };
L.Marker.include({
openTempPopup: function() {
this.openPopup();
this.off('click', this.openPopup, this);
function onclick() {
this.off('mouseout', onout, this);
this.off('click', onclick, this);
this.on('click', this.openPopup, this)
}
function onout() {
onclick.call(this);
this.closePopup();
};
this.on("mouseout", onout, this);
this.on("click", onclick, this);
}
});
L.i18n = function(s) { return (L.i18n.lang[L.i18n.current] || {})[s] || s; }
L.i18n.current = 'ru';
L.i18n.lang = {};
L.i18n.extend = function(lang, args) {
L.i18n.lang[lang] = L.Util.extend(L.i18n.lang[lang] || {}, args)
};
L.i18n.extend('ru', {
"Fixed Error":"Ошибка исправлена",
"Unresolved Error":"Неисправленная ошибка",
"Active Error":"Ошибка уточняется",
"Description":"Описание",
"Comment":"Описание",
"Add comment":"Дополнить",
"Mark as Fixed":"Исправлено",
"Link":"Ссылка",
"Cancel":"Отмена",
"New bug":"Я нашел ошибку",
"Find your bug?":"Нашли ошибку?",
"Contact details and someone will fix it.":"Напишите подробнее и кто-нибудь её исправит."
});

View file

@ -0,0 +1,124 @@
L.BingLayer = L.TileLayer.extend({
options: {
subdomains: [0, 1, 2, 3],
type: 'Aerial',
attribution: 'Bing',
culture: ''
},
initialize: function(key, options) {
L.Util.setOptions(this, options);
this._key = key;
this._url = null;
this.meta = {};
this.loadMetadata();
},
tile2quad: function(x, y, z) {
var quad = '';
for (var i = z; i > 0; i--) {
var digit = 0;
var mask = 1 << (i - 1);
if ((x & mask) != 0) digit += 1;
if ((y & mask) != 0) digit += 2;
quad = quad + digit;
}
return quad;
},
getTileUrl: function(p, z) {
var z = this._getZoomForUrl();
var subdomains = this.options.subdomains,
s = this.options.subdomains[Math.abs((p.x + p.y) % subdomains.length)];
return this._url.replace('{subdomain}', s)
.replace('{quadkey}', this.tile2quad(p.x, p.y, z))
.replace('http:', document.location.protocol)
.replace('{culture}', this.options.culture);
},
loadMetadata: function() {
var _this = this;
var cbid = '_bing_metadata_' + L.Util.stamp(this);
window[cbid] = function (meta) {
_this.meta = meta;
window[cbid] = undefined;
var e = document.getElementById(cbid);
e.parentNode.removeChild(e);
if (meta.errorDetails) {
if (window.console) console.log("Leaflet Bing Plugin Error - Got metadata: " + meta.errorDetails);
return;
}
_this.initMetadata();
};
var url = document.location.protocol + "//dev.virtualearth.net/REST/v1/Imagery/Metadata/" + this.options.type + "?include=ImageryProviders&jsonp=" + cbid + "&key=" + this._key;
var script = document.createElement("script");
script.type = "text/javascript";
script.src = url;
script.id = cbid;
document.getElementsByTagName("head")[0].appendChild(script);
},
initMetadata: function() {
var r = this.meta.resourceSets[0].resources[0];
this.options.subdomains = r.imageUrlSubdomains;
this._url = r.imageUrl;
this._providers = [];
if (r.imageryProviders) {
for (var i = 0; i < r.imageryProviders.length; i++) {
var p = r.imageryProviders[i];
for (var j = 0; j < p.coverageAreas.length; j++) {
var c = p.coverageAreas[j];
var coverage = {zoomMin: c.zoomMin, zoomMax: c.zoomMax, active: false};
var bounds = new L.LatLngBounds(
new L.LatLng(c.bbox[0]+0.01, c.bbox[1]+0.01),
new L.LatLng(c.bbox[2]-0.01, c.bbox[3]-0.01)
);
coverage.bounds = bounds;
coverage.attrib = p.attribution;
this._providers.push(coverage);
}
}
}
this._update();
},
_update: function() {
if (this._url == null || !this._map) return;
this._update_attribution();
L.TileLayer.prototype._update.apply(this, []);
},
_update_attribution: function() {
var bounds = this._map.getBounds();
var zoom = this._map.getZoom();
for (var i = 0; i < this._providers.length; i++) {
var p = this._providers[i];
if ((zoom <= p.zoomMax && zoom >= p.zoomMin) &&
bounds.intersects(p.bounds)) {
if (!p.active && this._map.attributionControl)
this._map.attributionControl.addAttribution(p.attrib);
p.active = true;
} else {
if (p.active && this._map.attributionControl)
this._map.attributionControl.removeAttribution(p.attrib);
p.active = false;
}
}
},
onRemove: function(map) {
for (var i = 0; i < this._providers.length; i++) {
var p = this._providers[i];
if (p.active && this._map.attributionControl) {
this._map.attributionControl.removeAttribution(p.attrib);
p.active = false;
}
}
L.TileLayer.prototype.onRemove.apply(this, [map]);
}
});
L.bingLayer = function (key, options) {
return new L.BingLayer(key, options);
};

View file

@ -0,0 +1,202 @@
/*
* Google layer using Google Maps API
*/
//(function (google, L) {
L.Google = L.Class.extend({
includes: L.Mixin.Events,
options: {
minZoom: 0,
maxZoom: 18,
tileSize: 256,
subdomains: 'abc',
errorTileUrl: '',
attribution: '',
opacity: 1,
continuousWorld: false,
noWrap: false,
mapOptions: {
backgroundColor: '#dddddd'
}
},
// Possible types: SATELLITE, ROADMAP, HYBRID, TERRAIN
initialize: function(type, options) {
L.Util.setOptions(this, options);
this._ready = google.maps.Map != undefined;
if (!this._ready) L.Google.asyncWait.push(this);
this._type = type || 'SATELLITE';
},
onAdd: function(map, insertAtTheBottom) {
this._map = map;
this._insertAtTheBottom = insertAtTheBottom;
// create a container div for tiles
this._initContainer();
this._initMapObject();
// set up events
map.on('viewreset', this._resetCallback, this);
this._limitedUpdate = L.Util.limitExecByInterval(this._update, 150, this);
map.on('move', this._update, this);
map.on('zoomanim', this._handleZoomAnim, this);
//20px instead of 1em to avoid a slight overlap with google's attribution
map._controlCorners['bottomright'].style.marginBottom = "20px";
this._reset();
this._update();
},
onRemove: function(map) {
this._map._container.removeChild(this._container);
//this._container = null;
this._map.off('viewreset', this._resetCallback, this);
this._map.off('move', this._update, this);
this._map.off('zoomanim', this._handleZoomAnim, this);
map._controlCorners['bottomright'].style.marginBottom = "0em";
//this._map.off('moveend', this._update, this);
},
getAttribution: function() {
return this.options.attribution;
},
setOpacity: function(opacity) {
this.options.opacity = opacity;
if (opacity < 1) {
L.DomUtil.setOpacity(this._container, opacity);
}
},
setElementSize: function(e, size) {
e.style.width = size.x + "px";
e.style.height = size.y + "px";
},
_initContainer: function() {
var tilePane = this._map._container,
first = tilePane.firstChild;
if (!this._container) {
this._container = L.DomUtil.create('div', 'leaflet-google-layer leaflet-top leaflet-left');
this._container.id = "_GMapContainer_" + L.Util.stamp(this);
this._container.style.zIndex = "auto";
}
if (true) {
tilePane.insertBefore(this._container, first);
this.setOpacity(this.options.opacity);
this.setElementSize(this._container, this._map.getSize());
}
},
_initMapObject: function() {
if (!this._ready) return;
this._google_center = new google.maps.LatLng(0, 0);
var map = new google.maps.Map(this._container, {
center: this._google_center,
zoom: 0,
tilt: 0,
mapTypeId: google.maps.MapTypeId[this._type],
disableDefaultUI: true,
keyboardShortcuts: false,
draggable: false,
disableDoubleClickZoom: true,
scrollwheel: false,
streetViewControl: false,
styles: this.options.mapOptions.styles,
backgroundColor: this.options.mapOptions.backgroundColor
});
var _this = this;
this._reposition = google.maps.event.addListenerOnce(map, "center_changed",
function() { _this.onReposition(); });
this._google = map;
google.maps.event.addListenerOnce(map, "idle",
function() { _this._checkZoomLevels(); });
},
_checkZoomLevels: function() {
//setting the zoom level on the Google map may result in a different zoom level than the one requested
//(it won't go beyond the level for which they have data).
// verify and make sure the zoom levels on both Leaflet and Google maps are consistent
if (this._google.getZoom() !== this._map.getZoom()) {
//zoom levels are out of sync. Set the leaflet zoom level to match the google one
this._map.setZoom( this._google.getZoom() );
}
},
_resetCallback: function(e) {
this._reset(e.hard);
},
_reset: function(clearOldContainer) {
this._initContainer();
},
_update: function(e) {
if (!this._google) return;
this._resize();
var center = e && e.latlng ? e.latlng : this._map.getCenter();
var _center = new google.maps.LatLng(center.lat, center.lng);
this._google.setCenter(_center);
this._google.setZoom(this._map.getZoom());
this._checkZoomLevels();
//this._google.fitBounds(google_bounds);
},
_resize: function() {
var size = this._map.getSize();
if (this._container.style.width == size.x &&
this._container.style.height == size.y)
return;
this.setElementSize(this._container, size);
this.onReposition();
},
_handleZoomAnim: function (e) {
var center = e.center;
var _center = new google.maps.LatLng(center.lat, center.lng);
this._google.setCenter(_center);
this._google.setZoom(e.zoom);
},
onReposition: function() {
if (!this._google) return;
google.maps.event.trigger(this._google, "resize");
}
});
L.Google.asyncWait = [];
L.Google.asyncInitialize = function() {
var i;
for (i = 0; i < L.Google.asyncWait.length; i++) {
var o = L.Google.asyncWait[i];
o._ready = true;
if (o._container) {
o._initMapObject();
o._update();
}
}
L.Google.asyncWait = [];
};
//})(window.google, L)

View file

@ -0,0 +1,161 @@
/*
* L.TileLayer is used for standard xyz-numbered tile layers.
*/
//(function (ymaps, L) {
L.Yandex = L.Class.extend({
includes: L.Mixin.Events,
options: {
minZoom: 0,
maxZoom: 18,
attribution: '',
opacity: 1,
traffic: false
},
// Possible types: map, satellite, hybrid, publicMap, publicMapHybrid
initialize: function(type, options) {
L.Util.setOptions(this, options);
this._type = "yandex#" + (type || 'map');
},
onAdd: function(map, insertAtTheBottom) {
this._map = map;
this._insertAtTheBottom = insertAtTheBottom;
// create a container div for tiles
this._initContainer();
this._initMapObject();
// set up events
map.on('viewreset', this._resetCallback, this);
this._limitedUpdate = L.Util.limitExecByInterval(this._update, 150, this);
map.on('move', this._update, this);
map._controlCorners['bottomright'].style.marginBottom = "3em";
this._reset();
this._update(true);
},
onRemove: function(map) {
this._map._container.removeChild(this._container);
this._map.off('viewreset', this._resetCallback, this);
this._map.off('move', this._update, this);
map._controlCorners['bottomright'].style.marginBottom = "0em";
},
getAttribution: function() {
return this.options.attribution;
},
setOpacity: function(opacity) {
this.options.opacity = opacity;
if (opacity < 1) {
L.DomUtil.setOpacity(this._container, opacity);
}
},
setElementSize: function(e, size) {
e.style.width = size.x + "px";
e.style.height = size.y + "px";
},
_initContainer: function() {
var tilePane = this._map._container,
first = tilePane.firstChild;
if (!this._container) {
this._container = L.DomUtil.create('div', 'leaflet-yandex-layer leaflet-top leaflet-left');
this._container.id = "_YMapContainer_" + L.Util.stamp(this);
this._container.style.zIndex = "auto";
}
if (this.options.overlay) {
first = this._map._container.getElementsByClassName('leaflet-map-pane')[0];
first = first.nextSibling;
// XXX: Bug with layer order
if (L.Browser.opera)
this._container.className += " leaflet-objects-pane";
}
tilePane.insertBefore(this._container, first);
this.setOpacity(this.options.opacity);
this.setElementSize(this._container, this._map.getSize());
},
_initMapObject: function() {
if (this._yandex) return;
// Check that ymaps.Map is ready
if (ymaps.Map === undefined) {
if (console) {
console.debug("L.Yandex: Waiting on ymaps.load('package.map')");
}
return ymaps.load(["package.map"], this._initMapObject, this);
}
// If traffic layer is requested check if control.TrafficControl is ready
if (this.options.traffic)
if (ymaps.control === undefined ||
ymaps.control.TrafficControl === undefined) {
if (console) {
console.debug("L.Yandex: loading traffic and controls");
}
return ymaps.load(["package.traffic", "package.controls"],
this._initMapObject, this);
}
var map = new ymaps.Map(this._container, {center: [0,0], zoom: 0, behaviors: []});
if (this.options.traffic)
map.controls.add(new ymaps.control.TrafficControl({shown: true}));
if (this._type == "yandex#null") {
this._type = new ymaps.MapType("null", []);
map.container.getElement().style.background = "transparent";
}
map.setType(this._type);
this._yandex = map;
this._update(true);
},
_resetCallback: function(e) {
this._reset(e.hard);
},
_reset: function(clearOldContainer) {
this._initContainer();
},
_update: function(force) {
if (!this._yandex) return;
this._resize(force);
var center = this._map.getCenter();
var _center = [center.lat, center.lng];
var zoom = this._map.getZoom();
if (force || this._yandex.getZoom() != zoom)
this._yandex.setZoom(zoom);
this._yandex.panTo(_center, {duration: 0, delay: 0});
},
_resize: function(force) {
var size = this._map.getSize(), style = this._container.style;
if (style.width == size.x + "px" &&
style.height == size.y + "px")
if (force != true) return;
this.setElementSize(this._container, size);
var b = this._map.getBounds(), sw = b.getSouthWest(), ne = b.getNorthEast();
this._yandex.container.fitToViewport();
}
});
//})(ymaps, L)

View file

@ -0,0 +1,80 @@
//#include "GPX.js"
(function() {
function d2h(d) {
var hex = '0123456789ABCDEF';
var r = '';
d = Math.floor(d);
while (d != 0) {
r = hex[d % 16] + r;
d = Math.floor(d / 16);
}
while (r.length < 2) r = '0' + r;
return r;
}
function gradient(color) {
// First arc (0, PI) in HSV colorspace
function f2h(d) { return d2h(256 * d); }
if (color < 0)
return "#FF0000";
else if (color < 1.0/3)
return "#FF" + f2h(3 * color) + "00";
else if (color < 2.0/3)
return "#" + f2h(2 - 3 * color) + "FF00";
else if (color < 1)
return "#00FF" + f2h(3 * color - 2);
else
return "#00FFFF";
};
function gpx2time(s) {
// 2011-09-24T12:07:53Z
if (s.length != 10 + 1 + 8 + 1)
return new Date();
return new Date(s);
};
L.GPX.include({
options: {
maxSpeed: 110,
chunks: 200
},
speedSplitEnable: function(options) {
L.Util.setOptions(this, options);
return this.on('addline', this.speed_split, this);
},
speedSplitDisable: function() {
return this.off('addline', this.speed_split, this);
},
speed_split: function(e) {
var l = e.line.pop(), ll = l.getLatLngs();
var chunk = Math.floor(ll.length / this.options.chunks);
if (chunk < 3) chunk = 3;
var p = null;
for (var i = 0; i < ll.length; i += chunk) {
var d = 0, t = null;
if (i + chunk > ll.length)
chunk = ll.length - i;
for (var j = 0; j < chunk; j++) {
if (p) d += p.distanceTo(ll[i+j]);
p = ll[i + j];
if (!t) t = gpx2time(p.meta.time);
}
p = ll[i + chunk - 1];
t = (gpx2time(p.meta.time) - t) / (3600 * 1000);
var speed = 0.001 * d / t;
//console.info('Dist: ' + d + "; Speed: " + speed);
var color = gradient(speed / this.options.maxSpeed);
var l = new L.Polyline(ll.slice(i, i+chunk+1), {color: color, weight: 2, opacity: 1});
l.bindPopup('Dist: ' + d.toFixed() + "m; Speed: " + speed.toFixed(2) + " km/h");
e.line.push(l);
}
}
});
})();

View file

@ -0,0 +1,143 @@
/*global L: true */
L.GPX = L.FeatureGroup.extend({
initialize: function(gpx, options) {
L.Util.setOptions(this, options);
this._gpx = gpx;
this._layers = {};
if (gpx) {
this.addGPX(gpx, options, this.options.async);
}
},
loadXML: function(url, cb, options, async) {
if (async == undefined) async = this.options.async;
if (options == undefined) options = this.options;
var req = new window.XMLHttpRequest();
req.open('GET', url, async);
try {
req.overrideMimeType('text/xml'); // unsupported by IE
} catch(e) {}
req.onreadystatechange = function() {
if (req.readyState != 4) return;
if(req.status == 200) cb(req.responseXML, options);
};
req.send(null);
},
_humanLen: function(l) {
if (l < 2000)
return l.toFixed(0) + " m";
else
return (l/1000).toFixed(1) + " km";
},
_polylineLen: function(line)//line is a L.Polyline()
{
var ll = line._latlngs;
var d = 0, p = null;
for (var i = 0; i < ll.length; i++)
{
if(i && p)
d += p.distanceTo(ll[i]);
p = ll[i];
}
return d;
},
addGPX: function(url, options, async) {
var _this = this;
var cb = function(gpx, options) { _this._addGPX(gpx, options) };
this.loadXML(url, cb, options, async);
},
_addGPX: function(gpx, options) {
var layers = this.parseGPX(gpx, options);
if (!layers) return;
this.addLayer(layers);
this.fire("loaded");
},
parseGPX: function(xml, options) {
var j, i, el, layers = [];
var named = false, tags = [['rte','rtept'], ['trkseg','trkpt']];
for (j = 0; j < tags.length; j++) {
el = xml.getElementsByTagName(tags[j][0]);
for (i = 0; i < el.length; i++) {
var l = this.parse_trkseg(el[i], xml, options, tags[j][1]);
for (var k = 0; k < l.length; k++) {
if (this.parse_name(el[i], l[k])) named = true;
layers.push(l[k]);
}
}
}
el = xml.getElementsByTagName('wpt');
if (options.display_wpt != false) {
for (i = 0; i < el.length; i++) {
var l = this.parse_wpt(el[i], xml, options);
if (!l) continue;
if (this.parse_name(el[i], l)) named = true;
layers.push(l);
}
}
if (!layers.length) return;
var layer = layers[0];
if (layers.length > 1)
layer = new L.FeatureGroup(layers);
if (!named) this.parse_name(xml, layer);
return layer;
},
parse_name: function(xml, layer) {
var i, el, txt="", name, descr="", len=0;
el = xml.getElementsByTagName('name');
if (el.length)
name = el[0].childNodes[0].nodeValue;
el = xml.getElementsByTagName('desc');
for (i = 0; i < el.length; i++) {
for (var j = 0; j < el[i].childNodes.length; j++)
descr = descr + el[i].childNodes[j].nodeValue;
}
if(layer instanceof L.Path)
len = this._polylineLen(layer);
if (name) txt += "<h2>" + name + "</h2>" + descr;
if (len) txt += "<p>" + this._humanLen(len) + "</p>";
if (layer && layer._popup === undefined) layer.bindPopup(txt);
return txt;
},
parse_trkseg: function(line, xml, options, tag) {
var el = line.getElementsByTagName(tag);
if (!el.length) return [];
var coords = [];
for (var i = 0; i < el.length; i++) {
var ll = new L.LatLng(el[i].getAttribute('lat'),
el[i].getAttribute('lon'));
ll.meta = {};
for (var j in el[i].childNodes) {
var e = el[i].childNodes[j];
if (!e.tagName) continue;
ll.meta[e.tagName] = e.textContent;
}
coords.push(ll);
}
var l = [new L.Polyline(coords, options)];
this.fire('addline', {line:l})
return l;
},
parse_wpt: function(e, xml, options) {
var m = new L.Marker(new L.LatLng(e.getAttribute('lat'),
e.getAttribute('lon')), options);
this.fire('addpoint', {point:m});
return m;
}
});

View file

@ -0,0 +1,359 @@
/*global L: true */
L.KML = L.FeatureGroup.extend({
options: {
async: true
},
initialize: function(kml, options) {
L.Util.setOptions(this, options);
this._kml = kml;
this._layers = {};
if (kml) {
this.addKML(kml, options, this.options.async);
}
},
loadXML: function(url, cb, options, async) {
if (async == undefined) async = this.options.async;
if (options == undefined) options = this.options;
var req = new window.XMLHttpRequest();
req.open('GET', url, async);
try {
req.overrideMimeType('text/xml'); // unsupported by IE
} catch(e) {}
req.onreadystatechange = function() {
if (req.readyState != 4) return;
if(req.status == 200) cb(req.responseXML, options);
};
req.send(null);
},
addKML: function(url, options, async) {
var _this = this;
var cb = function(gpx, options) { _this._addKML(gpx, options) };
this.loadXML(url, cb, options, async);
},
_addKML: function(xml, options) {
var layers = L.KML.parseKML(xml);
if (!layers || !layers.length) return;
for (var i = 0; i < layers.length; i++)
{
this.fire('addlayer', {
layer: layers[i]
});
this.addLayer(layers[i]);
}
this.latLngs = L.KML.getLatLngs(xml);
this.fire("loaded");
},
latLngs: []
});
L.Util.extend(L.KML, {
parseKML: function (xml) {
var style = this.parseStyle(xml);
this.parseStyleMap(xml, style);
var el = xml.getElementsByTagName("Folder");
var layers = [], l;
for (var i = 0; i < el.length; i++) {
if (!this._check_folder(el[i])) { continue; }
l = this.parseFolder(el[i], style);
if (l) { layers.push(l); }
}
el = xml.getElementsByTagName('Placemark');
for (var j = 0; j < el.length; j++) {
if (!this._check_folder(el[j])) { continue; }
l = this.parsePlacemark(el[j], xml, style);
if (l) { layers.push(l); }
}
return layers;
},
// Return false if e's first parent Folder is not [folder]
// - returns true if no parent Folders
_check_folder: function (e, folder) {
e = e.parentElement;
while (e && e.tagName !== "Folder")
{
e = e.parentElement;
}
return !e || e === folder;
},
parseStyle: function (xml) {
var style = {};
var sl = xml.getElementsByTagName("Style");
//for (var i = 0; i < sl.length; i++) {
var attributes = {color: true, width: true, Icon: true, href: true,
hotSpot: true};
function _parse(xml) {
var options = {};
for (var i = 0; i < xml.childNodes.length; i++) {
var e = xml.childNodes[i];
var key = e.tagName;
if (!attributes[key]) { continue; }
if (key === 'hotSpot')
{
for (var j = 0; j < e.attributes.length; j++) {
options[e.attributes[j].name] = e.attributes[j].nodeValue;
}
} else {
var value = e.childNodes[0].nodeValue;
if (key === 'color') {
options.opacity = parseInt(value.substring(0, 2), 16) / 255.0;
options.color = "#" + value.substring(6, 8) + value.substring(4, 6) + value.substring(2, 4);
} else if (key === 'width') {
options.weight = value;
} else if (key === 'Icon') {
ioptions = _parse(e);
if (ioptions.href) { options.href = ioptions.href; }
} else if (key === 'href') {
options.href = value;
}
}
}
return options;
}
for (var i = 0; i < sl.length; i++) {
var e = sl[i], el;
var options = {}, poptions = {}, ioptions = {};
el = e.getElementsByTagName("LineStyle");
if (el && el[0]) { options = _parse(el[0]); }
el = e.getElementsByTagName("PolyStyle");
if (el && el[0]) { poptions = _parse(el[0]); }
if (poptions.color) { options.fillColor = poptions.color; }
if (poptions.opacity) { options.fillOpacity = poptions.opacity; }
el = e.getElementsByTagName("IconStyle");
if (el && el[0]) { ioptions = _parse(el[0]); }
if (ioptions.href) {
// save anchor info until the image is loaded
options.icon = new L.KMLIcon({
iconUrl: ioptions.href,
shadowUrl: null,
iconAnchorRef: {x: ioptions.x, y: ioptions.y},
iconAnchorType: {x: ioptions.xunits, y: ioptions.yunits}
});
}
style['#' + e.getAttribute('id')] = options;
}
return style;
},
parseStyleMap: function (xml, existingStyles) {
var sl = xml.getElementsByTagName("StyleMap");
for (var i = 0; i < sl.length; i++) {
var e = sl[i], el;
var smKey, smStyleUrl;
el = e.getElementsByTagName("key");
if (el && el[0]) { smKey = el[0].textContent; }
el = e.getElementsByTagName("styleUrl");
if (el && el[0]) { smStyleUrl = el[0].textContent; }
if (smKey=='normal')
{
existingStyles['#' + e.getAttribute('id')] = existingStyles[smStyleUrl];
}
}
return;
},
parseFolder: function (xml, style) {
var el, layers = [], l;
el = xml.getElementsByTagName('Folder');
for (var i = 0; i < el.length; i++) {
if (!this._check_folder(el[i], xml)) { continue; }
l = this.parseFolder(el[i], style);
if (l) { layers.push(l); }
}
el = xml.getElementsByTagName('Placemark');
for (var j = 0; j < el.length; j++) {
if (!this._check_folder(el[j], xml)) { continue; }
l = this.parsePlacemark(el[j], xml, style);
if (l) { layers.push(l); }
}
if (!layers.length) { return; }
if (layers.length === 1) { return layers[0]; }
return new L.FeatureGroup(layers);
},
parsePlacemark: function (place, xml, style) {
var i, j, el, options = {};
el = place.getElementsByTagName('styleUrl');
for (i = 0; i < el.length; i++) {
var url = el[i].childNodes[0].nodeValue;
for (var a in style[url])
{
// for jshint
if (true)
{
options[a] = style[url][a];
}
}
}
var layers = [];
var parse = ['LineString', 'Polygon', 'Point'];
for (j in parse) {
// for jshint
if (true)
{
var tag = parse[j];
el = place.getElementsByTagName(tag);
for (i = 0; i < el.length; i++) {
var l = this["parse" + tag](el[i], xml, options);
if (l) { layers.push(l); }
}
}
}
if (!layers.length) {
return;
}
var layer = layers[0];
if (layers.length > 1) {
layer = new L.FeatureGroup(layers);
}
var name, descr = "";
el = place.getElementsByTagName('name');
if (el.length && el[0].childNodes.length) {
name = el[0].childNodes[0].nodeValue;
}
el = place.getElementsByTagName('description');
for (i = 0; i < el.length; i++) {
for (j = 0; j < el[i].childNodes.length; j++) {
descr = descr + el[i].childNodes[j].nodeValue;
}
}
if (name) {
layer.bindPopup("<h2>" + name + "</h2>" + descr);
}
return layer;
},
parseCoords: function (xml) {
var el = xml.getElementsByTagName('coordinates');
return this._read_coords(el[0]);
},
parseLineString: function (line, xml, options) {
var coords = this.parseCoords(line);
if (!coords.length) { return; }
return new L.Polyline(coords, options);
},
parsePoint: function (line, xml, options) {
var el = line.getElementsByTagName('coordinates');
if (!el.length) {
return;
}
var ll = el[0].childNodes[0].nodeValue.split(',');
return new L.KMLMarker(new L.LatLng(ll[1], ll[0]), options);
},
parsePolygon: function (line, xml, options) {
var el, polys = [], inner = [], i, coords;
el = line.getElementsByTagName('outerBoundaryIs');
for (i = 0; i < el.length; i++) {
coords = this.parseCoords(el[i]);
if (coords) {
polys.push(coords);
}
}
el = line.getElementsByTagName('innerBoundaryIs');
for (i = 0; i < el.length; i++) {
coords = this.parseCoords(el[i]);
if (coords) {
inner.push(coords);
}
}
if (!polys.length) {
return;
}
if (options.fillColor) {
options.fill = true;
}
if (polys.length === 1) {
return new L.Polygon(polys.concat(inner), options);
}
return new L.MultiPolygon(polys, options);
},
getLatLngs: function (xml) {
var el = xml.getElementsByTagName('coordinates');
var coords = [];
for (var j = 0; j < el.length; j++) {
// text might span many childNodes
coords = coords.concat(this._read_coords(el[j]));
}
return coords;
},
_read_coords: function (el) {
var text = "", coords = [], i;
for (i = 0; i < el.childNodes.length; i++) {
text = text + el.childNodes[i].nodeValue;
}
text = text.split(/[\s\n]+/);
for (i = 0; i < text.length; i++) {
var ll = text[i].split(',');
if (ll.length < 2) {
continue;
}
coords.push(new L.LatLng(ll[1], ll[0]));
}
return coords;
}
});
L.KMLIcon = L.Icon.extend({
createIcon: function () {
var img = this._createIcon('icon');
img.onload = function () {
var i = new Image();
i.src = this.src;
this.style.width = i.width + 'px';
this.style.height = i.height + 'px';
if (this.anchorType.x === 'UNITS_FRACTION' || this.anchorType.x === 'fraction') {
img.style.marginLeft = (-this.anchor.x * i.width) + 'px';
}
if (this.anchorType.y === 'UNITS_FRACTION' || this.anchorType.x === 'fraction') {
img.style.marginTop = (-(1 - this.anchor.y) * i.height) + 'px';
}
this.style.display = "";
};
return img;
},
_setIconStyles: function (img, name) {
L.Icon.prototype._setIconStyles.apply(this, [img, name])
// save anchor information to the image
img.anchor = this.options.iconAnchorRef;
img.anchorType = this.options.iconAnchorType;
}
});
L.KMLMarker = L.Marker.extend({
options: {
icon: new L.KMLIcon.Default()
}
});

View file

@ -0,0 +1,172 @@
/*global L: true */
L.OSM = L.FeatureGroup.extend({
options: {
async: true,
forceAll: false
},
initialize: function(url, options) {
L.Util.setOptions(this, options);
this._url = url;
this._layers = {};
if (url) {
this.addXML(url, options, this.options.async);
}
},
loadXML: function(url, cb, options, async) {
if (async == undefined) async = this.options.async;
if (options == undefined) options = this.options;
var req = new window.XMLHttpRequest();
req.open('GET', url, async);
req.overrideMimeType('text/xml');
req.onreadystatechange = function() {
if (req.readyState != 4) return;
if(req.status == 200) cb(req.responseXML, options);
};
req.send(null);
},
addXML: function(url, options, async) {
var _this = this;
var cb = function(xml, options) { _this._addXML(xml, options) };
this.loadXML(url, cb, options, async);
},
_addXML: function(xml, options) {
var layers = this.parseOSM(xml, options);
if (!layers) return;
this.addLayer(layers);
this.fire("loaded");
},
parseOSM: function(xml, options) {
var i, el, ll, layers = [];
var nodes = {};
var ways = {};
var named = false;
el = xml.getElementsByTagName('node');
for (i = 0; i < el.length; i++) {
var l = this.parse_node(el[i], xml, options);
if (l == undefined) continue;
nodes[l.osmid] = l;
if (!this.options.forceAll && !l.tags.length) continue;
var m = this.named_node(l, options);
if (!ll) ll = m.getLatLng();
if (this.parse_name(m, l, "Node")) named = true;
layers.push(m);
}
el = xml.getElementsByTagName('way');
for (i = 0; i < el.length; i++) {
if (i > 10) break;
var l = this.parse_way(el[i], nodes, options);
if (!l) continue;
if (!ll) ll = l.getLatLngs()[0];
if (this.parse_name(l, l, "Way")) named = true;
layers.push(l);
ways[l.osmid] = l;
}
el = xml.getElementsByTagName('relation');
for (i = 0; i < el.length; i++) {
if (i > 10) break;
var l = this.parse_relation(el[i], ways, options);
if (!l) continue;
if (!ll) ll = l.getLatLngs()[0];
if (this.parse_name(l, l, "Relation")) named = true;
layers.push(l);
}
if (!layers.length) return;
var layer = layers[0];
if (layers.length > 1)
layer = new L.FeatureGroup(layers);
if (!named) this.parse_name(xml, layer);
layer.focusPoint = ll;
return layer;
},
parse_name: function(layer, obj, obj_name) {
console.info("parse name");
console.info(this.options);
if (!this.options.forceAll)
if (!obj.tags || !obj.tags.length) return;
var i, txt = "<table>";
for (i = 0; i < obj.tags.length; i++) {
var t = obj.tags[i];
txt += "<tr><td>" + t.k + "</td><td>=</td><td>" + t.v + "</td></tr>";
}
txt += "</table>"
txt = "<h2>" + obj_name + " " + obj.osmid + "</h2>" + txt;
if (layer) layer.bindPopup(txt);
return txt;
},
parse_tags: function(line) {
var tags = [], el = line.getElementsByTagName('tag');
for (var i = 0; i < el.length; i++)
tags.push({k: el[i].getAttribute('k'), v: el[i].getAttribute('v')})
return tags;
},
parse_node: function(e) {
var n = { osmid: e.getAttribute('id')
, lat:e.getAttribute('lat')
, lon:e.getAttribute('lon')
}
n.ll = new L.LatLng(n.lat, n.lon);
n.tags = this.parse_tags(e);
return n;
},
parse_way: function(line, nodes, options) {
var el = line.getElementsByTagName('nd');
if (!el.length) return;
var coords = [], tags = [];
for (var i = 0; i < el.length; i++) {
var ref = el[i].getAttribute('ref'), n = nodes[ref];
if (!n) return;
coords.push(n.ll);
}
var layer = new L.Polyline(coords, options);
layer.tags = this.parse_tags(line);
layer.osmid = line.getAttribute('id')
return layer;
},
parse_relation: function(line, ways, options) {
var el = line.getElementsByTagName('member');
if (!el.length) return;
var rt, coords = [], tags = this.parse_tags(line);
for (var i = 0; i < tags.length; i++)
if (tags[i].k == "type") rt = tags[i].v;
if (rt != "multipolygon" && rt != "boundary" && rt != "waterway")
return;
for (var i = 0; i < el.length; i++) {
var mt = el[i].getAttribute("type"), ref = el[i].getAttribute("ref");
if (mt != "way") continue;
var w = ways[ref];
console.info("Way: " + ref + " " + w);
if (!w) return;
coords.push(w);
}
console.info("Coords: " + coords.length);
if (!coords.length) return;
var layer = new L.MultiPolyline(coords, options);
layer.tags = this.parse_tags(line);
layer.osmid = line.getAttribute('id')
return layer;
},
named_node: function(node, options) {
var marker = new L.Marker(new L.LatLng(node.lat, node.lon), options);
return marker;
}
});

View file

@ -0,0 +1,22 @@
{
"author": "Pavel Shramov",
"name": "leaflet-plugins",
"version": "1.0.1",
"description": "Miscellaneous plugins for Leaflet library for services that need to display route information and need satellite imagery from different providers",
"repository": {
"type": "git",
"url": "git@github.com:shramov/leaflet-plugins.git"
},
"contributors": [
"Bruno Bergot <bruno@eliaz.fr>",
"Andrey Lushchick <andrew@lushchick.org>"
],
"keywords": [
"leaflet",
"plugins",
"map",
"google",
"bing",
"yandex"
]
}