UNPKG

@react-stockcharts3/annotations

Version:

Annotations for react-stockcharts3

40 lines 1.74 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import { functor } from "@react-stockcharts3/core"; import * as React from "react"; export class SvgPathAnnotation 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, 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 { x: Math.round(xPos), y: Math.round(yPos), fill: functor(fill)(datum), tooltip: functor(tooltip)(datum), }; }; } render() { const { className, datum, stroke, opacity, path, pathWidth, pathHeight } = this.props; const { x, y, fill, tooltip } = this.helper(); return (_jsxs("g", { className: className, onClick: this.handleClick, children: [_jsx("title", { children: tooltip }), _jsx("path", { transform: `translate(${x - pathWidth},${y - pathHeight})`, d: path(datum), stroke: stroke, fill: fill, opacity: opacity })] })); } } SvgPathAnnotation.defaultProps = { className: "react-financial-charts-svg-path-annotation", opacity: 1, x: ({ xScale, xAccessor, datum, }) => xScale(xAccessor(datum)), }; //# sourceMappingURL=SvgPathAnnotation.js.map