react-financial-charts/lib/annotation/SvgPathAnnotation.js

React charts specific to finance.

import * as React from "react";
import { functor } from "../utils";
export class SvgPathAnnotation extends React.Component {
    constructor() {
        super(...arguments);
        this.handleClick = (e) => {
            const { onClick } = this.props;
            if (onClick) {
                const { xScale, yScale, datum } = this.props;
                onClick({ xScale, yScale, datum }, e);
            }
        };
    }
    render() {
        const { className, stroke, opacity } = this.props;
        const { xAccessor, xScale, yScale, path } = this.props;
        const { x, y, fill, tooltip } = helper(this.props, xAccessor, xScale, yScale);
        return (React.createElement("g", { className: className, onClick: this.handleClick },
            React.createElement("title", null, tooltip),
            React.createElement("path", { d: path({ x, y }), stroke: stroke, fill: fill, opacity: opacity })));
    }
}
SvgPathAnnotation.defaultProps = {
    className: "react-financial-charts-svgpathannotation",
    opacity: 1,
    x: ({ xScale, xAccessor, datum }) => xScale(xAccessor(datum)),
};
function helper(props, xAccessor, xScale, yScale) {
    const { x, y, datum, fill, tooltip, plotData } = props;
    const xFunc = functor(x);
    const yFunc = functor(y);
    const [xPos, yPos] = [xFunc({ xScale, xAccessor, datum, plotData }), yFunc({ yScale, datum, plotData })];
    return {
        x: xPos,
        y: yPos,
        fill: functor(fill)(datum),
        tooltip: functor(tooltip)(datum),
    };
}
//# sourceMappingURL=SvgPathAnnotation.js.map