rumble-charts/cjs/Lines.js

Truly declarative React charts components

'use strict';

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

var tslib_es6 = require('./external/tslib/tslib.es6.js');
var React = require('react');
var d3Shape = require('d3-shape');
var colorFunc = require('./helpers/colorFunc.js');
var curves = require('./helpers/curves.js');
require('d3-ease');
var isString = require('./helpers/isString.js');
var isNumber = require('./helpers/isNumber.js');
var value = require('./helpers/value.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

/**
 * Renders lines for your line chart.
 */
function Lines(props) {
    var className = props.className, style = props.style, scaleX = props.scaleX, scaleY = props.scaleY, minY = props.minY, asAreas = props.asAreas, _a = props.colors, colors = _a === void 0 ? colorFunc.defaultSchemeName : _a, series = props.series, opacity = props.opacity, _b = props.interpolation, interpolation = _b === void 0 ? 'monotone' : _b, _c = props.lineWidth, lineWidth = _c === void 0 ? 3 : _c;
    var rotate = scaleX.swap || scaleY.swap;
    var x = scaleX.factory(props);
    var y = scaleY.factory(props);
    var _y0 = y(minY || 0);
    var color = colorFunc.colorFunc(colors);
    return React__default["default"].createElement("g", { className: className, style: style, opacity: opacity }, series === null || series === void 0 ? void 0 : series.map(function (series, index) {
        if ('seriesVisible' in props) {
            var seriesVisible = value.value(props.seriesVisible, { seriesIndex: index, series: series, props: props });
            if (!seriesVisible) {
                return;
            }
        }
        var seriesAttributes = value.value(props.seriesAttributes, { seriesIndex: index, series: series, props: props });
        var seriesStyle = value.value(props.seriesStyle, { seriesIndex: index, series: series, props: props });
        var lineVisible = !('lineVisible' in props)
            || value.value(props.lineVisible, { seriesIndex: index, series: series, props: props });
        var linePath;
        if (lineVisible) {
            var line = void 0;
            if (rotate) {
                line = asAreas ?
                    d3Shape.area()
                        .x0(function (point) { return point.y0 ? y(point.y0) : _y0; })
                        .x1(function (point) { return y(point.y); }) :
                    d3Shape.line()
                        .x(function (point) { return y(point.y); });
                line.y(function (point) { return x(point.x); });
            }
            else {
                line = asAreas ?
                    d3Shape.area()
                        .y0(function (point) { return point.y0 ? y(point.y0) : _y0; })
                        .y1(function (point) { return y(point.y); }) :
                    d3Shape.line()
                        .y(function (point) { return y(point.y); });
                line.x(function (point) { return x(point.x); });
            }
            var lineColor = series.color || color(index);
            var curve = isString.isString(interpolation) ? curves.curves[interpolation] : interpolation;
            line.defined(function (point) { return isNumber.isNumber(point.y); }).curve(curve);
            var lineAttributes = value.value(props.lineAttributes, { seriesIndex: index, series: series, props: props });
            var lineStyle = value.value([series.style, props.lineStyle], { seriesIndex: index, series: series, props: props });
            var _lineWidth = value.value(lineWidth, { seriesIndex: index, series: series, props: props });
            linePath = React__default["default"].createElement("path", tslib_es6.__assign({ style: lineStyle, fill: asAreas ? lineColor : 'transparent', stroke: asAreas ? 'transparent' : lineColor, strokeWidth: _lineWidth, d: line(series.data) }, lineAttributes));
        }
        return React__default["default"].createElement("g", tslib_es6.__assign({ key: index, className: className && ("".concat(className, "-series ").concat(className, "-series-").concat(index)), style: seriesStyle, opacity: series.opacity }, seriesAttributes), linePath);
    }));
}

exports.Lines = Lines;