Map with German administrative districts: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary |
A WASSERMANN (talk | contribs) No edit summary |
||
Line 29: | Line 29: | ||
}; | }; | ||
function | brd.suspendUpdate(); | ||
brd. | JXG.timedChunk(paths, createCurve, null, final); | ||
JXG. | |||
</jsxgraph> | |||
© Bundesamt für Kartographie und Geodäsie, Frankfurt am Main, 2009 | |||
Vervielfältigung, Verbreitung und öffentliche Zugänglichmachung, auch auszugsweise, mit Quellenangabe gestattet. | |||
===The JavaScript code=== | |||
The data has been downloaded in ArcView/shape format from [http://www.geodatenzentrum.de/geodaten/gdz_rahmen.gdz_div?gdz_spr=deu&gdz_akt_zeile=5&gdz_anz_zeile=4&gdz_user_id=0 Bundesamt für Kartographie und Geodäsie]. Then, using [http://shapelib.maptools.org/ shapelib] and [http://ftp.intevation.de/users/bh/pyshapelib/ pyshapelib] the file was converted to JavaScript, see [http://jsxgraph.uni-bayreuth.de/ajax/krs.js]. | |||
The shape data from this file is displayed using the following JSXGraph code. | |||
<source lang="javascript"> | |||
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:bbox, keepaspectratio:true}), | |||
c = [], | |||
len = paths.length; | |||
function final() { | |||
brd.unsuspendUpdate(); | |||
} | |||
function createCurve(path) { | |||
var i = c.length, | |||
col = JXG.hsv2rgb(360/len*i,0.7,0.9), // fill color | |||
scol = '#999999', // stroke color | |||
sw = 1, // stroke width | |||
hcol = '#ffff00'; // highlight color | |||
c[i] = brd.create('curve',path, | |||
{name:info[path[2]][2], | |||
fillColor:col, | |||
strokeColor:scol,strokeWidth:sw,highlightFillColor:hcol,fillOpacity:0.4}); | |||
JXG.addEvent(c[i].rendNode, 'mouseover', (function(g){ return function(){g.highlight(); document.getElementById('landkreis').innerHTML=g.name;};})(c[i]), c[i]); | |||
JXG.addEvent(c[i].rendNode, 'mouseout', (function(g){ return function(){g.noHighlight();};})(c[i]), c[i]); | |||
c[i].hasPoint = function(){return false;}; | |||
}; | }; | ||
</ | brd.suspendUpdate(); | ||
JXG.timedChunk(paths, createCurve, null, final); | |||
</source> | |||
[[Category:Examples]] | |||
[[Category:Charts]] |
Revision as of 17:24, 14 December 2009
This map shows the German administrative districts (counties).
The JavaScript code
The data has been downloaded in ArcView/shape format from Bundesamt für Kartographie und Geodäsie. Then, using shapelib and pyshapelib the file was converted to JavaScript, see [1]. The shape data from this file is displayed using the following JSXGraph code.
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:bbox, keepaspectratio:true}),
c = [],
len = paths.length;
function final() {
brd.unsuspendUpdate();
}
function createCurve(path) {
var i = c.length,
col = JXG.hsv2rgb(360/len*i,0.7,0.9), // fill color
scol = '#999999', // stroke color
sw = 1, // stroke width
hcol = '#ffff00'; // highlight color
c[i] = brd.create('curve',path,
{name:info[path[2]][2],
fillColor:col,
strokeColor:scol,strokeWidth:sw,highlightFillColor:hcol,fillOpacity:0.4});
JXG.addEvent(c[i].rendNode, 'mouseover', (function(g){ return function(){g.highlight(); document.getElementById('landkreis').innerHTML=g.name;};})(c[i]), c[i]);
JXG.addEvent(c[i].rendNode, 'mouseout', (function(g){ return function(){g.noHighlight();};})(c[i]), c[i]);
c[i].hasPoint = function(){return false;};
};
brd.suspendUpdate();
JXG.timedChunk(paths, createCurve, null, final);