Hi Frank If you want to see a preview, take a look here: http://khtml.org/osm/v0.95/examples/tutorial/ It's all buggy... In 8 days I will have a working version. Bernhard On 2011-07-07 09:50, Frank Heinen wrote:
Hey, Very nice work. I will play with this soon. Regards, Frank2011/7/7 bernhard zwischenbrugger <bz@xxxxxxxxxxxxxxx <mailto:bz@xxxxxxxxxxxxxxx>>Hi all There was lots of work done on khtml.maplib. Stefan Keller and Florian Hengartner did lots of great work on vector graphics. Ewald Wieser is working on Markers. I put things together and try to keep everything fast and simple. New overlay Syntax: ---------------------------- The new Syntax is based on geojson, CSS and DOM Core. Geojson: http://geojson.org/ Has a Syntax for static overlays. It provides Point, LineString, Polygon,... Geojson describes the geometry but does not describe how things are displayed on a map. Geojson Example: { "type": "Feature", "geometry": { "type": "LineString", "coordinates": [ [102.0, 0.0], [103.0, 1.0], [104.0, 0.0], [105.0, 1.0] ] }, All thing that can be put on a map are called "Feature". There is also a container for features called "FeatureCollection". { "type": "FeatureCollection", "features": [ { "type": "Feature", "geometry": {"type": "Point", "coordinates": [102.0, 0.5]}, "properties": {"prop0": "value0"} }, { "type": "Feature", "geometry": { "type": "LineString", "coordinates": [ [102.0, 0.0], [103.0, 1.0], [104.0, 0.0], [105.0, 1.0] ] }, "properties": { "prop0": "value0", "prop1": 0.0 } }, { "type": "Feature", "geometry": { "type": "Polygon", "coordinates": [ [ [100.0, 0.0], [101.0, 0.0], [101.0, 1.0], [100.0, 1.0], [100.0, 0.0] ] ] }, "properties": { "prop0": "value0", "prop1": {"this": "that"} } } ] } khtml.maplib syntax: ============= To create a new feature in the maplib you have to use this code: var feature=new khtml.maplib.overlay.Feature({type:"LineString",coordinates:[[10,10],[20,20],[10,20]....]}); Styling: ---------- Geojson does not have a syntax for styling. Here we use the W3C css Syntax: feature.style.fill="red"; feature.className.baseVal="myCSSRule"; Grouping: ------------- features can be grouped in FeatureCollections. featureCollection.appendChild(feature); // add a new feature ... featureCollection.removeChild(feature); //remove a feature It is possible to put FeatureCollections to FeatureCollections and build hierarchical structures. The map provides at the beginning a default FeatureCollection. You can use this syntax: <style type="text/css"> .mystyle{ fill:none; stroke:blue; stroke-width:5; stroke-dasharray:5,5; } </style> .... new feature= khtml.maplib.overlay.Feature({type:"Linestring",coordinates:[...]}); map.featureCollection.appendChild(feature); map.className.baseVal="mystyle"; Programming: ------------------- The internal structure is also geojson. To change the stroke color of all features you could do this: var features=map.featureCollection.features; for(var i=0;i<features.length;i++){ features[i].style.stroke="lime"; } Moving a LatLng of the LineString: map.featureCollection.features[1].geometry.coordinates[0].lat(48.0); of feature.geometry.coordinates[0].lat(48.0) map.featureCollection.render(); to make changes visible. Every feature has a render() method and it can be much fast to only update a single feature: feature.render(); Changes: ------------ Geojson has the type "Point" which similar to a marker. In khtml.maplib there was also a class called Point. These two data types are not the same and to prevent confusion I renamed the Point to "LatLng" as in Google maps. The new syntax: var p=khtml.maplib.LatLng(48.2,16.4) Changes done on Hengartner/Kellers work: --------------------------------------------------------- (only interesting for them) Layer -> FeatureCollection Geometry: There is no need for geometry Classes. A geometry is only visible if it is inside a Feature. My advice was not to use JSON-Parameter - now I do it ;-) addContent -> appendChild Groundoverlay is working now without jquery. At the moment I'm fixing Kml and add styling. More Informations: ------------------------- I try to keep updated this page for overlay syntax http://wiki.openstreetmap.org/wiki/Simple_overlay_API At SOTM-EU I will present all these things Bernhard