Creating Maps

<script src='https://d3js.org/d3.v3.min.js'></script>
<script src='https://d3js.org/topojson.v0.min.js'></script>
was added in the page head.

xxxxxxxxxx

 

1

%%html

2

<style>#svg1 {background-color:midnightblue;}

3

.land {fill:#3636ff; stroke:silver;}

4

.countries {fill:none; stroke:silver;}

5

</style><svg id='svg1' width='640px' height='420px'/>

6

<script type='text/javascript'>

7

var projection=d3.geo.equirectangular().translate([120,260]);

8

var svg=d3.select('#svg1'),g=svg.append('g');

9

var path=d3.geo.path().projection(projection);

10

var url1='https://raw.githubusercontent.com/n1n9-jp/',

11

    url2='CSIS_map_140514/master/data/',

12

    file='world-50m.json';

13

d3.json(url1.concat(url2).concat(file),

14

        function(world) {

15

            g.attr('class','land').selectAll('land')

16

             .data([topojson.object(world,world.objects.land)])

17

             .enter().append('path').attr('d',path);

18

            svg.attr('class','countries').selectAll('countries')

19

               .data([topojson.object(world,world.objects.countries)])

20

               .enter().append('path').attr('d',path);});

Language: Sage Gap GP HTML Macaulay2 Maxima Octave Python R Singular

---

Messages