Highcharts component for react. Highcharts is a Javascript charting library that uses HTML, SVG, and VML. The editor offers both open source/nonprofit and commercial editions of the product.
Questions tagged [react-highcharts]
409 questions
12
votes
5 answers
How can I use chart tooltip formatter in react-highcharts?
how can I use chart tooltip formatter?
I am using react wrapper for highcharts.
I have config like this:
const CHART_CONFIG = {
...
tooltip:
{
formatter: (tooltip) => {
var s = '' + this.x + '';
…
kraizybone
- 313
- 1
- 3
- 12
8
votes
2 answers
Dynamically update Highcharts chart in react
I am using highcharts-react-official in react-redux to create a drilldown chart.
However when I click on a bar to drilldown, I also update some props which causes the component to re-render - which seems to prevent the drilldown event.
I kind of…
user1960089
- 167
- 1
- 1
- 10
6
votes
1 answer
How do we show loading via highcharts-react-official package
I am trying to use loading option from highcharts. But I am not able to find a way to do it using highcharts-react-official package.
nero
- 143
- 2
- 8
6
votes
1 answer
Why ReactHighcharts SolidGauge's rounded is not working in react
I use react-highcharts to create a SolidGauge in my Dashboard Page.
and draw rounded edges.
So , I setting the plotOptions.rounded to true.
code:
import ReactHighcharts from 'react-highcharts';
import HighchartsMore from 'highcharts-more';
import…
Giambi Huang
- 111
- 1
- 13
6
votes
1 answer
React-highcharts scrollbar feature not working
I am using react-highchart . The scrollbar feature does not seem to work . Below is the piece of code .
The scrollbar is enable in the xaxis and it doesnt seem to scroll .
Please refer the highcharts implementation :…
Balaji V
- 918
- 3
- 10
- 28
5
votes
3 answers
React plot options onclick event
I have made a highcharts column chart in my react application, and am now trying to add an onClick event to the chart. My aim is that when the user click a column, I can obtain the values of the X and Y axis, and then call a function from the…
Alex
- 3,730
- 9
- 43
- 94
4
votes
1 answer
Define and apply theme on highcharts-react-official
I'm trying to update higcharts texts font globally, I coundn't find anywhere on documentation how to apply a custom theme using highcharts-react-official. Is there an equivalent of Highcharts.theme = style and Highcharts.setOption(Highcharts.theme)?
Bernardo Marques
- 925
- 2
- 10
- 33
4
votes
1 answer
How to define a custom class to HighchartsReact component
I am using HighchartsReact to render some pie charts and I need to add custom css to it.
Without react I used the id of the div to style
But now in react I am using something like:
Damini Ganesh
- 288
- 1
- 10
4
votes
2 answers
react-highcharts how to call reflow?
I use kirjs/react-highcharts plugin for react but I have no idea how to get Highchart component in order to call reflow like: $('#container1').highcharts().reflow()
From docs its tells:
For access to methods & properties from the Highcharts…
snaggs
- 5,543
- 17
- 64
- 127
3
votes
0 answers
TypeError: Cannot read properties of undefined (reading 'activeDataLabelStyle')
I have a Highcharts graph on my React page and I redraw it after getting data by updating the state hook. This works well in development mode without any issues.
However, after npm run build and starting the application I get the error:
TypeError:…
C. Gokhan
- 31
- 4
3
votes
1 answer
Highcharts.js variable pie chart not rendering data correctly along percentage dataLabels
The issue is that the individual sliver radius' of this variable pie chart are not consistent with the the percentage labels (i.e. 25%, 50%, 75%, and 100%). The radius' all seem to be correctly calculated, but visually I cannot seem to figure out…
Kodee McIntosh
- 98
- 1
- 6
3
votes
0 answers
Highchart not display correct size on initial load, only resize when resizing window in react js
currently I am developing chart in my React. I am using Highchart. My problem is when my chart first loaded, the size is not following the container size, when i resize the window then only the chart display correct size.
many solution suggested to…
Muneeb K
- 457
- 1
- 9
- 21
3
votes
1 answer
Highcharts 3D cylinder wiht ReactJS
I was trying to add cylinder 3D chart in my react component. However, I am facing this error.
Error: Highcharts error #17: www.highcharts.com/errors/17/?missingModuleFor=cylinder
missingModuleFor: cylinder
In my component, my code is
import…
sunny Garg
- 53
- 6
3
votes
2 answers
How to add export functionality to custom button in React highcharts?
I have this project in which I am trying to implement export highchart functionality from out side of the chart.
Is there any way I can achieve that? I am using React highcharts and the download formats are Jpeg and CSV.
Thanks in advance
Abhishek Gangwar
- 2,168
- 18
- 26
3
votes
1 answer
How to Add button in React Highchart Tooltip?
I am trying to add a button to the High-chart Tool-tip.But I am getting
Uncaught ReferenceError: showMoreDetails is not defined
at HTMLButtonElement.onclick
Following is the code I have for chart options. I am trying to add tooltip using…
Abhishek Gangwar
- 2,168
- 18
- 26