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
1
vote
1 answer
How to dynamically change mouse event functions in Highchart?
I'm using Highchart networkgraph for a directed graph.
I want the users to be able to on node hover highlight the shortest path from the start node.
I also have some checkboxes that would highlight the shortest node from start to the specified node.…
Martin Olasz
- 13
- 4
1
vote
1 answer
How to remove decimal values on x-axis of bar chart : Highcharts
I am having trouble setting integer only values to the x-axis of the bar chart. Can someone help me as to how to solve this.
This is my sandbox: https://codesandbox.io/s/react-line-chart-forked-0409lk?file=/src/LineChart.js
Have tried, allowDecimal:…
user16860065
1
vote
1 answer
React Highcharts - how to use drillUp from parent component?
I am trying to drillUp from the parent component
This is the father component:
Or Nakash
- 1,345
- 1
- 9
- 22
1
vote
1 answer
How to add dots to Highcharts legend and bars?
Right now, my bar and legend looks like this. It is just a single color.
However, I am trying to add a pattern that does not exist within the default pattern fills. I want it to look like this.
I have looked quite a bit online, but can't seem to…
drewkiimon
- 591
- 1
- 9
- 16
1
vote
1 answer
Highcharts Treemap Custom Width
I am building treemap using Highcharts Treemap in which I have sector categories. Categories are displayed properly but I want the width of category to be 100%(IT, Chemical etc in JSFiddle). Currently I can only position it…
pranav shinde
- 1,260
- 13
- 11
1
vote
1 answer
Highcharts: How to add another(custom) label/ legend/ something else to the top right of the graph?
In my highcharts, I already have a legend at the bottom left of the graph but want to add a custom status indicator for the entire graph. It's going to be a colored oval with a colored dot and a status on it like in the picture.
Should I be trying…
Tim
- 51
- 1
- 7
1
vote
0 answers
Highcharts Accessible navigation without using arrow keys
Is there a way to allow users to navigate without needing to use the arrow keys, but instead just the tab key? In my use case, the entire page uses tab (no arrows) and when the user reaches the legend and presses tab, it skips the remaining legend…
Alex
- 139
- 1
- 7
1
vote
1 answer
Multiple Gauge Chart
Is it possible to Draw this type of gauges in the left and right of the circle using Highcharts?
Basically left side gauge is representing the shorts' %age at left, the right side gauge is representing the shorts' %age at right, and the center is…
1
vote
1 answer
Dynamically updating a highcharts object after data refresh in React
I am trying to build an employee org chart using Highcharts network graph but I'm running into errors. The idea is simple. I want to render an initial chart with the president and a few of their direct reports. After that, if the user clicks on a…
jay queue
- 285
- 2
- 14
1
vote
1 answer
Background event on Highcharts Gantt
Here is for a project we used before FullCalendar in resourceView mode to display a from an algorithm. In this gantt we have jobs, as well as the display of the unavailability of resources (workstation here).
Sandbox:…
Minos
- 216
- 2
- 11
1
vote
1 answer
Highcharts Gantt - Set max height and scrollbar on yAxis
I'm doing a project using Highcharts Gantt, and I'm having a little trouble mastering it at the moment, especially the management of its height and Y axis.
Here Sandbox :…
Minos
- 216
- 2
- 11
1
vote
1 answer
How to use types with typescript on highcharts.js
I've read the docs regarding typescript on Highcharts but I still don't have it very clear how to use types in highcharts.js functions.
For example, I have a formatter function on my tooltip options and it admits a parameter this. How do I type…
Alvaro
- 40,778
- 30
- 164
- 336
1
vote
1 answer
How to use a react component as the label in Highcharts?
I have a bubble map chart that shows the location of cities on the map. The map has the default label but I want to use a custom react component as the label on the map. This is my source code but it has error and doesn't work:
import React, {…
Zahra Talebi
- 675
- 4
- 11
- 26
1
vote
1 answer
How to import or load Dumbbell chart in react app
I am trying to use Dumbbell chart of highcharts in react app.
As per the link below, I have imported dumbbell module.
https://www.npmjs.com/package/highcharts-react-official#how-to-add-a-module
import highchartsDumbbell from…
santosh
- 23
- 4
1
vote
1 answer
Highlight highcharts bars on mouse hover events
I'm struggling with Highcharts, I just want to highlight my columns on mouse hover events this way:
I used fake data like below, but I don't think it's the right way to perform this, moreover I want to keep the tooltip on real columns only, not…
highpoof
- 13
- 3