Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
222 changes: 111 additions & 111 deletions lib/components/Baseline.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
"use strict";

Object.defineProperty(exports, "__esModule", {
value: true
value: true
});

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; }; }();
Expand Down Expand Up @@ -39,18 +39,18 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
*/

var defaultStyle = {
label: {
fill: "#8B7E7E", // Default label color
fontWeight: 100,
fontSize: 11,
pointerEvents: "none"
},
line: {
stroke: "#626262",
strokeWidth: 1,
strokeDasharray: "5,3",
pointerEvents: "none"
}
label: {
fill: "#8B7E7E", // Default label color
fontWeight: 100,
fontSize: 11,
pointerEvents: "none"
},
line: {
stroke: "#626262",
strokeWidth: 1,
strokeDasharray: "5,3",
pointerEvents: "none"
}
};

/**
Expand Down Expand Up @@ -81,113 +81,113 @@ var defaultStyle = {
*/

var Baseline = function (_React$Component) {
_inherits(Baseline, _React$Component);

function Baseline() {
_classCallCheck(this, Baseline);

return _possibleConstructorReturn(this, (Baseline.__proto__ || Object.getPrototypeOf(Baseline)).apply(this, arguments));
}

_createClass(Baseline, [{
key: "render",
value: function render() {
if (!this.props.yScale || _underscore2.default.isUndefined(this.props.value)) {
return null;
}

var y = this.props.yScale(this.props.value);
var transform = "translate(0 " + y + ")";
var textAnchor = void 0;
var textPositionX = void 0;
var pts = [];

var textPositionY = -3;

if (this.props.position === "left") {
textAnchor = "start";
textPositionX = 5;
}
if (this.props.position === "right") {
textAnchor = "end";
textPositionX = this.props.width - 5;
}

pts.push("0 0");
pts.push(this.props.width + " 0");
var points = pts.join(" ");

//
// Style
//

var labelStyle = (0, _merge2.default)(true, defaultStyle.label, this.props.style.label ? this.props.style.label : {});
var lineStyle = (0, _merge2.default)(true, defaultStyle.line, this.props.style.line ? this.props.style.line : {});

return _react2.default.createElement(
"g",
{ className: "baseline", transform: transform },
_react2.default.createElement("polyline", { points: points, style: lineStyle }),
_react2.default.createElement(
"text",
{
style: labelStyle,
x: textPositionX,
y: textPositionY,
textAnchor: textAnchor
},
this.props.label
)
);
_inherits(Baseline, _React$Component);

function Baseline() {
_classCallCheck(this, Baseline);

return _possibleConstructorReturn(this, (Baseline.__proto__ || Object.getPrototypeOf(Baseline)).apply(this, arguments));
}
}]);

return Baseline;
_createClass(Baseline, [{
key: "render",
value: function render() {
if (!this.props.yScale || _underscore2.default.isUndefined(this.props.value)) {
return null;
}

var y = this.props.yScale(this.props.value);
var transform = "translate(0 " + y + ")";
var textAnchor = void 0;
var textPositionX = void 0;
var pts = [];

var textPositionY = -3;

if (this.props.position === "left") {
textAnchor = "start";
textPositionX = 5;
}
if (this.props.position === "right") {
textAnchor = "end";
textPositionX = this.props.width - 5;
}

pts.push("0 0");
pts.push(this.props.width + " 0");
var points = pts.join(" ");

//
// Style
//

var labelStyle = (0, _merge2.default)(true, defaultStyle.label, this.props.style.label ? this.props.style.label : {});
var lineStyle = (0, _merge2.default)(true, defaultStyle.line, this.props.style.line ? this.props.style.line : {});

return _react2.default.createElement(
"g",
{ className: "baseline", transform: transform },
_react2.default.createElement("polyline", { points: points, style: lineStyle }),
_react2.default.createElement(
"text",
{
style: labelStyle,
x: textPositionX,
y: textPositionY,
textAnchor: textAnchor
},
this.props.label
)
);
}
}]);

return Baseline;
}(_react2.default.Component);

exports.default = Baseline;


Baseline.defaultProps = {
value: 0,
label: "",
position: "left",
style: defaultStyle
value: 0,
label: "",
position: "left",
style: defaultStyle
};

Baseline.propTypes = {
/**
* Reference to the axis which provides the vertical scale for drawing. e.g.
* specifying axis="trafficRate" would refer the y-scale to the YAxis of id="trafficRate".
*/
axis: _propTypes2.default.string.isRequired, // eslint-disable-line
/**
* An object describing the style of the baseline of the form
* { label, line }. "label" and "line" are both objects containing
* the inline CSS for that part of the baseline.
*/
style: _propTypes2.default.shape({
label: _propTypes2.default.object, // eslint-disable-line
line: _propTypes2.default.object // eslint-disable-line
}),
/**
* The y-value to display the line at.
*/
value: _propTypes2.default.number,
/**
* The label to display with the axis.
*/
label: _propTypes2.default.string,
/**
* Whether to display the label on the "left" or "right".
*/
position: _propTypes2.default.oneOf(["left", "right"]),
/**
* [Internal] The yScale supplied by the associated YAxis
*/
yScale: _propTypes2.default.func,
/**
* [Internal] The width supplied by the surrounding ChartContainer
*/
width: _propTypes2.default.number
/**
* Reference to the axis which provides the vertical scale for drawing. e.g.
* specifying axis="trafficRate" would refer the y-scale to the YAxis of id="trafficRate".
*/
axis: _propTypes2.default.string.isRequired, // eslint-disable-line
/**
* An object describing the style of the baseline of the form
* { label, line }. "label" and "line" are both objects containing
* the inline CSS for that part of the baseline.
*/
style: _propTypes2.default.shape({
label: _propTypes2.default.object, // eslint-disable-line
line: _propTypes2.default.object // eslint-disable-line
}),
/**
* The y-value to display the line at.
*/
value: _propTypes2.default.number,
/**
* The label to display with the axis.
*/
label: _propTypes2.default.string,
/**
* Whether to display the label on the "left" or "right".
*/
position: _propTypes2.default.oneOf(["left", "right"]),
/**
* [Internal] The yScale supplied by the associated YAxis
*/
yScale: _propTypes2.default.func,
/**
* [Internal] The width supplied by the surrounding ChartContainer
*/
width: _propTypes2.default.number
};
Loading