@tradingaction/annotations/lib/LabelAnnotation.js

Annotations for react-financial-charts

import { functor } from "@tradingaction/core";
import * as React from "react";
export class LabelAnnotation extends React.Component {
    constructor() {
        super(...arguments);
        this.handleClick = (e) => {
            const { onClick, xScale, yScale, datum } = this.props;
            if (onClick !== undefined) {
                onClick(e, { xScale, yScale, datum });
            }
        };
        this.helper = () => {
            const { x, y, datum, fill, text, tooltip, xAccessor, xScale, yScale, plotData } = this.props;
            const xFunc = functor(x);
            const yFunc = functor(y);
            const [xPos, yPos] = [
                xFunc({ xScale, xAccessor, datum, plotData }),
                yFunc({ yScale, datum, plotData }),
            ];
            return {
                xPos,
                yPos,
                text: functor(text)(datum),
                fill: functor(fill)(datum),
                tooltip: functor(tooltip)(datum),
            };
        };
    }
    render() {
        const { className, textAnchor, fontFamily, fontSize, opacity, rotate } = this.props;
        const { xPos, yPos, fill, text, tooltip } = this.helper();
        return (React.createElement("g", { className: className },
            React.createElement("title", null, tooltip),
            React.createElement("text", { x: xPos, y: yPos, fontFamily: fontFamily, fontSize: fontSize, fill: fill, opacity: opacity, transform: `rotate(${rotate}, ${xPos}, ${yPos})`, onClick: this.handleClick, textAnchor: textAnchor }, text.split('\n').map((line, i) => (React.createElement("tspan", { x: xPos, dy: i === 0 ? '0' : '1.2em', key: `txt_el_${i}` }, line))))));
    }
}
LabelAnnotation.defaultProps = {
    className: "react-financial-charts-label-annotation",
    textAnchor: "middle",
    fontFamily: "-apple-system, system-ui, Roboto, 'Helvetica Neue', Ubuntu, sans-serif",
    fontSize: 12,
    fill: "#000000",
    opacity: 1,
    rotate: 0,
    x: ({ xScale, xAccessor, datum, }) => xScale(xAccessor(datum)),
};
//# sourceMappingURL=LabelAnnotation.js.map