@react-stockcharts3/annotations/lib/BarAnnotation.js

Annotations for react-stockcharts3

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { functor } from "@react-stockcharts3/core";
import * as React from "react";
export class BarAnnotation extends React.Component {
    constructor() {
        super(...arguments);
        this.onClick = (e) => {
            const { onClick, xScale, yScale, datum } = this.props;
            if (onClick !== undefined) {
                onClick(e, { xScale, yScale, datum });
            }
        };
        this.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),
            };
        };
    }
    render() {
        const { className, stroke, opacity, xAccessor, xScale, yScale, path, text, textXOffset, textYOffset, textAnchor, fontFamily, fontSize, textFill, textOpacity, textRotate, textIcon, textIconFontSize, textIconFill, textIconOpacity, textIconRotate, textIconXOffset, textIconYOffset, } = this.props;
        const { x, y, fill, tooltip } = this.helper(this.props, xAccessor, xScale, yScale);
        return (_jsxs("g", { className: className, onClick: this.onClick, children: [tooltip !== undefined ? _jsx("title", { children: tooltip }) : null, text !== undefined ? (_jsx("text", { x: x, y: y, dx: textXOffset, dy: textYOffset, fontFamily: fontFamily, fontSize: fontSize, fill: textFill, opacity: textOpacity, transform: textRotate != undefined ? `rotate(${textRotate}, ${x}, ${y})` : undefined, textAnchor: textAnchor, children: text })) : null, textIcon !== undefined ? (_jsx("text", { x: x, y: y, dx: textIconXOffset, dy: textIconYOffset, fontSize: textIconFontSize, fill: textIconFill, opacity: textIconOpacity, transform: textIconRotate != undefined ? `rotate(${textIconRotate}, ${x}, ${y})` : undefined, textAnchor: textAnchor, children: textIcon })) : null, path !== undefined ? _jsx("path", { d: path({ x, y }), stroke: stroke, fill: fill, opacity: opacity }) : null] }));
    }
}
BarAnnotation.defaultProps = {
    className: "react-financial-charts-bar-annotation",
    opacity: 1,
    fill: "#000000",
    fontFamily: "-apple-system, system-ui, Roboto, 'Helvetica Neue', Ubuntu, sans-serif",
    fontSize: 10,
    textAnchor: "middle",
    textFill: "#000000",
    textOpacity: 1,
    textIconFill: "#000000",
    textIconFontSize: 10,
    x: ({ xScale, xAccessor, datum, }) => xScale(xAccessor(datum)),
};
//# sourceMappingURL=BarAnnotation.js.map