Adding component for world map

Author: booleanhunter

reactjs-adminlte/public/dist/js/buttons.bundle.js

@@ -0,0 +1,57 @@
+define(
+    [
+        'react',
+        'jquery',
+        'jvectormap',
+        'jvectormapWorld'
+    ],
+    function(React,$){
+    	var WorldMap = React.createClass({
+            getDefaultProps: function() {
+                return {
+                    id: 'world-map-1',
+                }
+            },
+            componentDidMount: function(){
+                console.log(this.props.info["US"])
+                var visitorsData = this.props.info;
+                $('#'+this.props.id).vectorMap({
+                    map: 'world_mill_en',
+                    backgroundColor: "transparent",
+                    regionStyle: {
+                        initial: {
+                            fill: '#e4e4e4',
+                            "fill-opacity": 1,
+                            stroke: 'none',
+                            "stroke-width": 0,
+                            "stroke-opacity": 1
+                        }
+                    },
+                    series: {
+                        regions: [{
+                            values: visitorsData,
+                            scale: ["#92c1dc", "#ebf4f9"],
+                            normalizeFunction: 'polynomial'
+                        }]
+                    },
+                    onRegionLabelShow: function(e, el, code) {
+                        if(typeof visitorsData[code] != "undefined")
+                            el.html(el.html() + ': ' + visitorsData[code] + ' new visitors');
+                    }
+                });
+            },
+    		render: function(){
+                var style = {
+                    height: '250px'
+                };
+                //style="overflow: hidden; width: auto; height: 250px;"
+    			return (
+                    <div id={this.props.id} style={style}>
+                    </div>
+    			)
+    		}
+    	})
+
+    	return WorldMap;
+    }   
+)     

reactjs-adminlte/public/dist/js/chartVendors.bundle.js

@@ -2,9 +2,12 @@ define(
     [
         'react',
         'jquery',
+
     ],
     function(React,$){
     	var ContainerFive = React.createClass({
+            componentDidMount: function(){
+            },
     		render: function(){
                 var style = {
                     height: '250px'
@@ -29,6 +32,7 @@ define(
                         </div>
 
                         <div className="box-body" style={style}>
+                            {this.props.children}
                         </div>
 
                         <div className="box-footer no-border">

reactjs-adminlte/public/dist/js/dashboardV1.bundle.js

@@ -9,6 +9,7 @@ define(
         './control-panel',
         './charts/donut-chart',
         './charts/area-chart',
+        './charts/world-map',
         './containers/container-one',
         './containers/container-two',
         './containers/container-three',
@@ -19,7 +20,7 @@ define(
         './controls-menu',
         './stat-tile'
     ],
-    function(React, $, Raphael, Morris, HeaderBar, NavigationMenu, ControlPanel, DonutChart, AreaChart, ContainerOne, ContainerTwo, ContainerThree, ContainerFour,ContainerFive,ContainerSix,ContainerSeven,ControlsMenu,StatTile){
+    function(React, $, Raphael, Morris, HeaderBar, NavigationMenu, ControlPanel, DonutChart, AreaChart, WorldMap, ContainerOne, ContainerTwo, ContainerThree, ContainerFour,ContainerFive,ContainerSix,ContainerSeven,ControlsMenu,StatTile){
     	var Dashboard = React.createClass({
             getInitialState: function() {
                 return {
@@ -144,7 +145,23 @@ define(
     								</section>
 
                                     <section className="col-lg-5 connectedSortable ui-sortable">
-                                        <ContainerFive />
+                                        <ContainerFive>
+                                            <WorldMap 
+                                                id="world-map"
+                                                info = {{
+                                                    "US": 398,
+                                                    "SA": 400, 
+                                                    "CA": 1000, 
+                                                    "DE": 500, 
+                                                    "FR": 760, 
+                                                    "CN": 300, 
+                                                    "AU": 700, 
+                                                    "BR": 600, 
+                                                    "IN": 800,
+                                                    "GB": 320, 
+                                                    "RU": 3000 
+                                                }} />
+                                        </ContainerFive>
                                         <ContainerSix />
                                         <ContainerSeven />
                                     </section>