Interactive maps for data visualizations. Bundled into a single Javascript file.

Datamaps is intended to provide some data visualizations based on geographical data. It's SVG-based, can scale to any screen size, and includes everything inside of 1 script file. It heavily relies on the amazing D3.js library. Full documentation can be found: https://github.com/markmarkoh/datamaps

 $scope.mapObject1 = {
        scope: 'world',
        responsive: true,
        fills: {
            defaultFill: "#DBDAD6"
        },
        geographyConfig: {
            highlightFillColor: '#1C977A',
            highlightBorderWidth: 0,
        },
    } 

$scope.mapObject2 = {
        scope: 'world',
        responsive: true,
        fills: {
            defaultFill: "#DBDAD6",
            active: "#2BA587"
        },
        geographyConfig: {
            highlightFillColor: '#1C977A',
            highlightBorderWidth: 0,
        },
        data: {
            USA: { fillKey: "active" },
            RUS: { fillKey: "active" },
            DEU: { fillKey: "active" },
            BRA: { fillKey: "active" }
        }
    } 

$scope.mapObject3 = {
        responsive: true,
        scope: 'usa',
        fills: {
            defaultFill: "#DBDAD6",
            active: "#2BA587"
        },
        geographyConfig: {
            highlightFillColor: '#1C977A',
            highlightBorderWidth: 0
        },
        data: {
            NE: { fillKey: "active" },
            CA: { fillKey: "active" },
            NY: { fillKey: "active" },
        }
    }

$scope.mapObject4 = {
        scope: 'world',
        responsive: true,
        fills: {
            defaultFill: "#F2F2F0",
            active: "#DBDAD6",
            usa: "#269479"
        },
        geographyConfig: {
            highlightFillColor: '#1C977A',
            highlightBorderWidth: 0
        },
        data: {
            USA: {fillKey: "usa"},
            RUS: {fillKey: "active"},
            DEU: {fillKey: "active"},
            POL: {fillKey: "active"},
            JAP: {fillKey: "active"},
            AUS: {fillKey: "active"},
            BRA: {fillKey: "active"}
        }
    };