Plotting div inside React component

[laakkti]

Hi,

I have a React SPA app. At one page I have a component and inside it

when call inside component dataframe.plot("plot_div").bar({ layout, config}); it is pointing to parent of the component (page where component is laying) not that expected inside component.
Is there something misunderstandig for me or what is doing wrong?

Br. Timo

[risenW]

Hi,

I have a React SPA app. At one page I have a component and inside it

when call inside component dataframe.plot("plot_div").bar({ layout, config}); it is pointing to parent of the component (page where component is laying) not that expected inside component.
Is there something misunderstandig for me or what is doing wrong?
Br. Timo

Can you add some code example so I can better understand what you have tried and what you want. You can use codesandbox

[Gnpd]

Not sure if you are calling the plot on a useEffect. You need to wait till the component is rendered to use the div id.
If that's the case you can try something like:

import { useEffect } from 'react';
import * as dfd from 'danfojs';

const YourComponent = () => {
 const df = new dfd.DataFrame({
      pig: [20, 18, 489, 675, 1776],
      horse: [4, 25, 281, 600, 1900],
    });
  useEffect(() => {
    df.plot('plot_div').bar();
  }, [df]);
  return <div id="plot_div" />;
};