world-countries

Stylized map of world countries.

by ryanttb

HTML

<script src="http://code.jquerygeo.com/jquery.geo-1.0.0-b1.5.js"></script>
<div id="map"></div>

CSS

#map {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

JavaScript

// create a map with no services
// but set the shapeStyle option
var map = $("#map").geomap({
  center: [ 20, 20 ],
  zoom: 3,    
  services: [],
  shapeStyle: {
    color: "#444",
    stroke: "#fff",
    strokeWidth: "3px"
  }
});

// grab the world countires file
$.getJSON("http://data.jquerygeo.com/world-countries.json", function (result) {
  // append them to the map
    $.each( result.features, function( ) {
        
        
        var red = Math.round(0xff * Math.random()).toString(16);
        map.geomap("append", this, {
            color: "#" + red + "1111"
        }, false);
    });
    
    // show them
    map.geomap("refresh");
});