Difference between revisions of "Map with German electoral districts"

From JSXGraph Wiki
Jump to navigationJump to search
(works in 0.98)
 
(One intermediate revision by one other user not shown)
Line 40: Line 40:
 
             c.push(new JXG.Coords(JXG.COORDS_BY_USER, [1*a[0], 1*a[1]], brd));
 
             c.push(new JXG.Coords(JXG.COORDS_BY_USER, [1*a[0], 1*a[1]], brd));
 
         }
 
         }
         c = JXG.Math.Numerics.RamenDouglasPeuker(c,1.3);
+
         c = JXG.Math.Numerics.RamerDouglasPeuker(c,1.3);
 
         len = c.length;
 
         len = c.length;
 
         for (i=0;i<len;i++) {
 
         for (i=0;i<len;i++) {
Line 51: Line 51:
 
                     strokeWidth:1,strokeColor:'black',highlightStrokeColor:'black'});
 
                     strokeWidth:1,strokeColor:'black',highlightStrokeColor:'black'});
 
         if (k==0) {
 
         if (k==0) {
             JXG.addEvent(graph.rendNode, 'mouseover', (function(g){ return function(){g.highlight(); wahlkreisNode.nodeValue=area[1];};})(graph), graph);
+
             JXG.addEvent(graph.rendNode, 'mouseover', function(){graph.nohcol = graph.visProp.fillcolor; graph.setAttribute({fillColor: 'yellow'});}, graph);
             JXG.addEvent(graph.rendNode, 'mouseout', (function(g){ return function(){g.noHighlight();};})(graph), graph);
+
             JXG.addEvent(graph.rendNode, 'mouseout', function(){graph.setAttribute({fillColor: graph.nohcol});}, graph);
 
         }
 
         }
 
         graph.hasPoint = function(){return false; };
 
         graph.hasPoint = function(){return false; };
Line 115: Line 115:
 
             c.push(new JXG.Coords(JXG.COORDS_BY_USER, [1*a[0], 1*a[1]], brd));
 
             c.push(new JXG.Coords(JXG.COORDS_BY_USER, [1*a[0], 1*a[1]], brd));
 
         }
 
         }
         c = JXG.Math.Numerics.RamenDouglasPeuker(c,1.3);
+
         c = JXG.Math.Numerics.RamerDouglasPeuker(c,1.3);
 
         len = c.length;
 
         len = c.length;
 
         for (i=0;i<len;i++) {
 
         for (i=0;i<len;i++) {
Line 126: Line 126:
 
                     strokeWidth:1,strokeColor:'black',highlightStrokeColor:'black'});
 
                     strokeWidth:1,strokeColor:'black',highlightStrokeColor:'black'});
 
         if (k==0) {
 
         if (k==0) {
             JXG.addEvent(graph.rendNode, 'mouseover', (function(g){ return function(){g.highlight(); wahlkreisNode.nodeValue=area[1];};})(graph), graph);
+
             JXG.addEvent(graph.rendNode, 'mouseover', function(){graph.nohcol = graph.visProp.fillcolor; graph.setAttribute({fillColor: 'yellow'});}, graph);
             JXG.addEvent(graph.rendNode, 'mouseout', (function(g){ return function(){g.noHighlight();};})(graph), graph);
+
             JXG.addEvent(graph.rendNode, 'mouseout', function(){graph.setAttribute({fillColor: graph.nohcol});}, graph);
 
         }
 
         }
 
         graph.hasPoint = function(){return false; };
 
         graph.hasPoint = function(){return false; };

Latest revision as of 15:14, 7 August 2013

 

For a more elaborate version see http://vis.uell.net/wahlatlas/.

© Bundeswahlleiter, Statistisches Bundesamt, Wiesbaden 2008, Wahlkreiskarte für die Wahl zum 17. Deutschen Bundestag

Geoinformationen © Bundesamt für Kartographie und Geodäsie www.bkg.bund.de


The underlying JavaScript code

<script type="text/javascript" src="/ajax/germany.js"></script>
<div id="wahlkreis">&nbsp;</div>
var minX =-289319.4,
    maxY = 6827620,
    maxX = 351315.7,
    minY = 5960587,
    brd,
    wahlkreisNode = document.getElementById('wahlkreis').firstChild,    
    points = [],
    len = data.length, // from germany.js
    lastWk = null,
    i, col = 0;
    
brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[minX-1000,maxY+1000,maxX+1000,minY-1000],keepaspectratio:true});

for(i=0;i<len;i++) {
    if(i%6==1) {
        lastWk = data[i];
    }
    else if(i%6 == 5) {
        points.push([data[i],lastWk]);
    }
}

function createCurve(area)  {
    var compos = area[0].split(';'), // Connected component
        x = [], y = [],
        c = [], num, i, a, graph, k, a;
        
    num = compos.length;
    for (k=0;k<num;k++) {
        x = []; y = []; c = [];
        xy = compos[k].split(',');
        len = xy.length;
        for(i=0;i<len;i++) {
            a = xy[i].split(' ');
            c.push(new JXG.Coords(JXG.COORDS_BY_USER, [1*a[0], 1*a[1]], brd));
        }
        c = JXG.Math.Numerics.RamerDouglasPeuker(c,1.3);
        len = c.length;
        for (i=0;i<len;i++) {
            x.push(c[i].usrCoords[1]);
            y.push(c[i].usrCoords[2]);
        }
        graph = brd.createElement('curve', [x,y], 
                    {fillColor:JXG.hsv2rgb(0.5*(col++),0.5,0.9),
                     highlightFillColor:'yellow',
                     strokeWidth:1,strokeColor:'black',highlightStrokeColor:'black'});
        if (k==0) {
            JXG.addEvent(graph.rendNode, 'mouseover', function(){graph.nohcol = graph.visProp.fillcolor; graph.setAttribute({fillColor: 'yellow'});}, graph);
            JXG.addEvent(graph.rendNode, 'mouseout', function(){graph.setAttribute({fillColor: graph.nohcol});}, graph);
        }
        graph.hasPoint = function(){return false; };
    }
}

brd.suspendUpdate();
JXG.timedChunk(points, createCurve, null, final);