Coder Social home page Coder Social logo

yaph / d3-geomap Goto Github PK

View Code? Open in Web Editor NEW
132.0 8.0 45.0 7.29 MB

A library for creating geographical maps based on D3.js

Home Page: https://d3-geomap.github.io/

License: MIT License

Makefile 6.26% Python 7.65% JavaScript 83.94% Sass 2.15%
javascript map mapping d3 d3js choropleth choropleth-map geography geo svg

d3-geomap's Introduction

d3-geomap

npm package version npm package license

d3-geomap is designed to be a reusable geographic map for D3. In its current stage it consists of a class to create plain maps d3.geomap() and one for choropleth maps d3.choropleth().

Refer to the documentation on how to use d3-geomap and to download a bundle that contains minified versions of d3-geomap and its dependencies as well as TopoJSON files for creating world and individual country maps.

Install

$ npm install d3-geomap

Usage

ES6:

import { select } from 'd3-selection';
import { geomap } from 'd3-geomap';

const worldMap = geomap();
worldMap.geofile('./node_modules/d3-geomap/src/world/countries.json');

worldMap.draw(select('#map'));

Otherwise, see examples in the /examples directory.

Develop

Clone the repo & install dependencies:

$ git clone https://github.com/yaph/d3-geomap.git
$ cd d3-geomap
$ npm install

Start the development server:

$ npm run serve

A browser should open pointed to http://localhost:8000/examples/. Choose to view one of the example maps.

Map Showcase

World Cup 2014 Players' Birth Countries

The map above, showing birth countries of Football World Cup 2014 players, was created with d3-geomap. You can find more example maps here.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.