react-financial / react-financial-charts

Charts dedicated to finance.
https://react-financial.github.io/react-financial-charts/
MIT License
1.2k stars 211 forks source link

Can set hoverText for each TrendLine #670

Open OnlyC opened 1 year ago

OnlyC commented 1 year ago

I'm submitting a...

What is the current behavior

hoverText for all TrendLine on chart is the same.

What is the expected behavior

I need to set each TrendLine a different hoverText.

Other information

Change this in interactive => TrendLine file:

const hoverTextWithDefault = each.hoverText
          ? { ...TrendLine.defaultProps.hoverText, ...each.hoverText }
          : {
                ...TrendLine.defaultProps.hoverText,
                ...hoverText,
            };

trends parse function:


const parse = (lines: any) => {
  return lines.map((obj: any) => {
    obj.start = [obj.start_idx, obj.price]
    obj.end = [obj.end_idx, obj.price]
    obj.hoverText = {
      text: `text `,
      selectedText: `selected`
    }
    obj.appearance = {
      strokeStyle: 'rgba(60, 179, 0, 0.6)',
      strokeDasharray: 'Solid',
      strokeWidth: 3,
      r: 0
    }
    return obj
  })
}