Skip to content

Commit 1fec6b2

Browse files
zimrickzimrick
committed
Added map
1 parent 9661f73 commit 1fec6b2

27 files changed

+2082
-1
lines changed

‎.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
2+
.DS_Store
3+
node_modules

‎README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
# react-simple-maps
2-
A svg map component built with and for React
2+
An svg map component built with and for React. Please note that this is a work in progress!

‎lib/Geographies.js

+102
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8+
9+
var _react = require("react");
10+
11+
var _react2 = _interopRequireDefault(_react);
12+
13+
var _defaultStyles = require("./defaultStyles");
14+
15+
var _defaultStyles2 = _interopRequireDefault(_defaultStyles);
16+
17+
var _utils = require("./utils");
18+
19+
var _Geography = require("./Geography");
20+
21+
var _Geography2 = _interopRequireDefault(_Geography);
22+
23+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
24+
25+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
26+
27+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
28+
29+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
30+
31+
var Geographies = function (_React$Component) {
32+
_inherits(Geographies, _React$Component);
33+
34+
function Geographies() {
35+
_classCallCheck(this, Geographies);
36+
37+
return _possibleConstructorReturn(this, (Geographies.__proto__ || Object.getPrototypeOf(Geographies)).apply(this, arguments));
38+
}
39+
40+
_createClass(Geographies, [{
41+
key: "shouldComponentUpdate",
42+
value: function shouldComponentUpdate(nextProps) {
43+
var geoPathsChanged = nextProps.geographyPaths.length !== this.props.geographyPaths.length;
44+
var includesChanged = nextProps.include.length !== this.props.include.length;
45+
var excludesChanged = nextProps.exclude.length !== this.props.exclude.length;
46+
var choroplethChanged = JSON.stringify(nextProps.choropleth) !== JSON.stringify(this.props.choropleth);
47+
return !this.props.freezeGeographyPaths || geoPathsChanged || includesChanged || excludesChanged || choroplethChanged;
48+
}
49+
}, {
50+
key: "render",
51+
value: function render() {
52+
var _this2 = this;
53+
54+
var styles = this.props.styles.geography || _defaultStyles2.default.geography;
55+
56+
return _react2.default.createElement(
57+
"g",
58+
{ className: "rsm-geographies" },
59+
this.props.geographyPaths.map(function (geography, i) {
60+
var included = _this2.props.include.indexOf(geography.id) !== -1;
61+
var notExcluded = _this2.props.exclude.indexOf(geography.id) === -1;
62+
var shouldInclude = _this2.props.include.length > 0 ? included : notExcluded;
63+
64+
return shouldInclude ? _react2.default.createElement(_Geography2.default, {
65+
zoom: _this2.props.zoom,
66+
key: geography.id ? geography.id + "-" + i : i,
67+
geography: geography,
68+
projection: _this2.props.projection,
69+
choroplethValue: _this2.props.choropleth[geography.id],
70+
styles: styles,
71+
events: _this2.props.events
72+
}) : null;
73+
})
74+
);
75+
}
76+
}]);
77+
78+
return Geographies;
79+
}(_react2.default.Component);
80+
81+
Geographies.propTypes = {
82+
geographyPaths: _react.PropTypes.array,
83+
projection: _react.PropTypes.func.isRequired,
84+
freezeGeographyPaths: _react.PropTypes.bool,
85+
exclude: _react.PropTypes.array,
86+
include: _react.PropTypes.array,
87+
styles: _react.PropTypes.object,
88+
choropleth: _react.PropTypes.object,
89+
events: _react.PropTypes.object
90+
};
91+
92+
Geographies.defaultProps = {
93+
geographyPaths: [],
94+
freezeGeographyPaths: true,
95+
exclude: [],
96+
include: [],
97+
styles: _defaultStyles2.default,
98+
choropleth: {},
99+
events: {}
100+
};
101+
102+
exports.default = Geographies;

‎lib/Geography.js

+148
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,148 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8+
9+
var _react = require("react");
10+
11+
var _react2 = _interopRequireDefault(_react);
12+
13+
var _d3Geo = require("d3-geo");
14+
15+
var _defaultStyles = require("./defaultStyles");
16+
17+
var _defaultStyles2 = _interopRequireDefault(_defaultStyles);
18+
19+
var _utils = require("./utils");
20+
21+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
22+
23+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
24+
25+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
26+
27+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
28+
29+
var Geography = function (_React$Component) {
30+
_inherits(Geography, _React$Component);
31+
32+
function Geography() {
33+
_classCallCheck(this, Geography);
34+
35+
var _this = _possibleConstructorReturn(this, (Geography.__proto__ || Object.getPrototypeOf(Geography)).call(this));
36+
37+
_this.state = {
38+
hovered: false
39+
};
40+
41+
_this.handleMouseEnter = _this.handleMouseEnter.bind(_this);
42+
_this.handleMouseLeave = _this.handleMouseLeave.bind(_this);
43+
_this.handleMouseMove = _this.handleMouseMove.bind(_this);
44+
_this.handleClick = _this.handleClick.bind(_this);
45+
return _this;
46+
}
47+
48+
_createClass(Geography, [{
49+
key: "handleMouseEnter",
50+
value: function handleMouseEnter(geography, evt) {
51+
evt.preventDefault();
52+
this.setState({ hovered: true });
53+
if (this.props.events.onMouseEnter) {
54+
this.props.events.onMouseEnter(geography, evt);
55+
}
56+
}
57+
}, {
58+
key: "handleMouseLeave",
59+
value: function handleMouseLeave(geography, evt) {
60+
evt.preventDefault();
61+
this.setState({ hovered: false });
62+
if (this.props.events.onMouseLeave) {
63+
this.props.events.onMouseLeave(geography, evt);
64+
}
65+
}
66+
}, {
67+
key: "handleMouseMove",
68+
value: function handleMouseMove(geography, evt) {
69+
evt.preventDefault();
70+
if (this.props.events.onMouseMove) {
71+
this.props.events.onMouseMove(geography, evt);
72+
}
73+
}
74+
}, {
75+
key: "handleClick",
76+
value: function handleClick(geography, evt) {
77+
evt.preventDefault();
78+
if (this.props.events.onClick) {
79+
this.props.events.onClick(geography, evt);
80+
}
81+
}
82+
}, {
83+
key: "shouldComponentUpdate",
84+
value: function shouldComponentUpdate(nextProps, nextState) {
85+
var changedHoverState = this.state.hovered !== nextState.hovered;
86+
var changedChoroplethValue = this.props.choroplethValue !== nextProps.choroplethValue;
87+
var changedGeography = this.props.geography !== nextProps.geography;
88+
return changedGeography || changedChoroplethValue || changedHoverState;
89+
}
90+
}, {
91+
key: "render",
92+
value: function render() {
93+
var _this2 = this;
94+
95+
var _props = this.props,
96+
geography = _props.geography,
97+
projection = _props.projection,
98+
styles = _props.styles,
99+
choroplethValue = _props.choroplethValue;
100+
101+
// return (
102+
// <path
103+
// d={ geoPath().projection(projection())(geography) }
104+
// onMouseEnter={(evt) => this.handleMouseEnter(geography, evt) }
105+
// onMouseLeave={(evt) => this.handleMouseLeave(geography, evt) }
106+
// onClick={(evt) => this.handleClick(geography, evt) }
107+
// style={ createChoroplethStyles(styles, choroplethValue) }
108+
// className="rsm-geography"
109+
// />
110+
// )
111+
112+
return _react2.default.createElement("path", {
113+
d: (0, _d3Geo.geoPath)().projection(projection())(geography),
114+
onMouseEnter: function onMouseEnter(evt) {
115+
return _this2.handleMouseEnter(geography, evt);
116+
},
117+
onMouseLeave: function onMouseLeave(evt) {
118+
return _this2.handleMouseLeave(geography, evt);
119+
},
120+
onMouseMove: function onMouseMove(evt) {
121+
return _this2.handleMouseMove(geography, evt);
122+
},
123+
onClick: function onClick(evt) {
124+
return _this2.handleClick(geography, evt);
125+
},
126+
style: styles(choroplethValue, geography)[this.state.hovered ? "hover" : "default"] || styles(choroplethValue, geography)["default"],
127+
className: "rsm-geography"
128+
});
129+
}
130+
}]);
131+
132+
return Geography;
133+
}(_react2.default.Component);
134+
135+
Geography.propTypes = {
136+
geography: _react.PropTypes.object.isRequired,
137+
projection: _react.PropTypes.func.isRequired,
138+
choroplethValue: _react.PropTypes.object,
139+
// styles: PropTypes.object,
140+
events: _react.PropTypes.object
141+
};
142+
143+
Geography.defaultProps = {
144+
styles: _defaultStyles2.default.geography,
145+
events: {}
146+
};
147+
148+
exports.default = Geography;

‎lib/Loader.js

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8+
9+
var _react = require("react");
10+
11+
var _react2 = _interopRequireDefault(_react);
12+
13+
var _defaultStyles = require("./defaultStyles");
14+
15+
var _defaultStyles2 = _interopRequireDefault(_defaultStyles);
16+
17+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18+
19+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
20+
21+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
22+
23+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
24+
25+
var Loader = function (_React$Component) {
26+
_inherits(Loader, _React$Component);
27+
28+
function Loader() {
29+
_classCallCheck(this, Loader);
30+
31+
return _possibleConstructorReturn(this, (Loader.__proto__ || Object.getPrototypeOf(Loader)).apply(this, arguments));
32+
}
33+
34+
_createClass(Loader, [{
35+
key: "render",
36+
value: function render() {
37+
var _props = this.props,
38+
waitMessage = _props.waitMessage,
39+
errorHeading = _props.errorHeading,
40+
loadingError = _props.loadingError,
41+
styles = _props.styles;
42+
43+
44+
return _react2.default.createElement(
45+
"div",
46+
{ style: styles ? styles() : _defaultStyles2.default.loader(), className: "rsm-loader" },
47+
loadingError ? _react2.default.createElement(
48+
"span",
49+
null,
50+
errorHeading,
51+
_react2.default.createElement("br", null),
52+
loadingError
53+
) : _react2.default.createElement(
54+
"span",
55+
null,
56+
waitMessage
57+
)
58+
);
59+
}
60+
}]);
61+
62+
return Loader;
63+
}(_react2.default.Component);
64+
65+
Loader.propTypes = {
66+
waitMessage: _react.PropTypes.string,
67+
errorHeading: _react.PropTypes.string,
68+
loadingError: _react.PropTypes.string,
69+
styles: _react.PropTypes.func
70+
};
71+
72+
Loader.defaultProps = {
73+
waitMessage: "Loading map...",
74+
errorHeading: "Couldn't load map",
75+
loadingError: null,
76+
styles: _defaultStyles2.default.loader
77+
};
78+
79+
exports.default = Loader;

0 commit comments

Comments
 (0)