rc-leaflet
Version:
React Map Components of Leaflet
118 lines (117 loc) • 6.55 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
result["default"] = mod;
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = require("react");
var prop_types_1 = __importDefault(require("prop-types"));
var PropTypes_1 = require("../../util/PropTypes");
var Layer_1 = __importDefault(require("../Layer"));
var Popup_1 = __importDefault(require("../Popup"));
var Tooltip_1 = __importDefault(require("../Tooltip"));
var MassLayer_1 = __importStar(require("./MassLayer"));
var Icon = {
iconUrl: prop_types_1.default.string,
iconSize: PropTypes_1.Pixel,
iconAnchor: PropTypes_1.Pixel,
popupAnchor: PropTypes_1.Pixel,
tooltipAnchor: PropTypes_1.Pixel
};
var MassPoints = /** @class */ (function (_super) {
__extends(MassPoints, _super);
function MassPoints(props, context) {
var _this = _super.call(this, props, context) || this;
_this.onPopupClose = function () { return _this.setState({ clickPoint: undefined }); };
_this.onClick = function () { return _this.setState(function (_a) {
var clickPoint = _a.clickPoint, hoverPoint = _a.hoverPoint;
return ({ clickPoint: clickPoint === hoverPoint ? undefined : hoverPoint });
}); };
_this.onMouseOut = function () { return _this.setState({ hoverPoint: undefined }); };
_this.onMouseOver = function (e) { return _this.setState({ hoverPoint: { index: e.index, point: e.point } }); };
_this.state = { clickPoint: undefined, hoverPoint: undefined };
_this.instance.on('click', _this.onClick);
_this.instance.on('mouseover', _this.onMouseOver);
_this.instance.on('mouseout', _this.onMouseOut);
return _this;
}
MassPoints.prototype.componentDidUpdate = function (prevProps) {
var prevPoints = prevProps.points, prevIconUrl = prevProps.iconUrl, prevIconSize = prevProps.iconSize, prevIconAnchor = prevProps.iconAnchor, prevPopupAnchor = prevProps.popupAnchor, prevTooltipAnchor = prevProps.tooltipAnchor, prevThrottleThreshold = prevProps.throttleThreshold, prevThrottleDuration = prevProps.throttleDuration;
var _a = this.props, points = _a.points, iconUrl = _a.iconUrl, iconSize = _a.iconSize, iconAnchor = _a.iconAnchor, popupAnchor = _a.popupAnchor, tooltipAnchor = _a.tooltipAnchor, throttleThreshold = _a.throttleThreshold, throttleDuration = _a.throttleDuration;
if (points !== prevPoints) {
this.setState({ clickPoint: undefined, hoverPoint: undefined });
}
if (popupAnchor !== prevPopupAnchor) {
this.instance.setPopupAnchor(popupAnchor);
}
if (tooltipAnchor !== prevTooltipAnchor) {
this.instance.setTooltipAnchor(tooltipAnchor);
}
if (points !== prevPoints || iconUrl !== prevIconUrl || iconSize !== prevIconSize || iconAnchor !== prevIconAnchor || throttleThreshold !== prevThrottleThreshold || throttleDuration !== prevThrottleDuration) {
this.instance.setOptions({ points: points, iconUrl: iconUrl, iconSize: iconSize, iconAnchor: iconAnchor, throttleThreshold: throttleThreshold, throttleDuration: throttleDuration });
}
_super.prototype.componentDidUpdate.call(this, prevProps);
};
MassPoints.prototype.createInstance = function (props) {
var points = props.points, iconUrl = props.iconUrl, iconSize = props.iconSize, iconAnchor = props.iconAnchor, popupAnchor = props.popupAnchor, tooltipAnchor = props.tooltipAnchor, throttleThreshold = props.throttleThreshold, throttleDuration = props.throttleDuration;
return new MassLayer_1.default({ points: points, iconUrl: iconUrl, iconSize: iconSize, iconAnchor: iconAnchor, popupAnchor: popupAnchor, tooltipAnchor: tooltipAnchor, throttleThreshold: throttleThreshold, throttleDuration: throttleDuration });
};
MassPoints.prototype.render = function () {
var _this = this;
var children = this.props.children;
var _a = this.state, clickPoint = _a.clickPoint, hoverPoint = _a.hoverPoint;
return children ? (react_1.Children.map(children, function (child) {
if (react_1.isValidElement(child)) {
var onClose = void 0;
var target = void 0;
var type = child.type;
if (clickPoint && type === Popup_1.default) {
onClose = _this.onPopupClose;
target = clickPoint;
}
else if (hoverPoint && type === Tooltip_1.default) {
target = hoverPoint;
}
return react_1.cloneElement(child, { layer: _this.instance, target: target, onClose: onClose });
}
return child;
})) : null;
};
MassPoints.propTypes = __assign({}, Layer_1.default.propTypes, { points: prop_types_1.default.arrayOf(prop_types_1.default.shape(__assign({ position: PropTypes_1.Point }, Icon))).isRequired }, Icon);
MassPoints.defaultProps = {
throttleThreshold: MassLayer_1.defaultOptions.throttleThreshold,
throttleDuration: MassLayer_1.defaultOptions.throttleDuration
};
return MassPoints;
}(Layer_1.default));
exports.default = MassPoints;