score:1
Accepted answer
You can find a demo of this chart in React here: https://stackblitz.com/edit/react-highcharts-xrange-demo
You have to remember to properly load highcharts modules: https://github.com/highcharts/highcharts-react#how-to-add-a-module
score:0
Seeing same error but (using Typescript) for my fix i needed to pass in Highcharts to the xrange like so:
import Highcharts from 'highcharts';
import HighchartsReact from 'highcharts-react-official';
import xrange from 'highcharts/modules/xrange';
xrange(Highcharts);
and then the markup:
<HighchartsReact
highcharts={Highcharts}
options={options}
{...this.props}
/>
Source: stackoverflow.com
Related Articles
- creating a bar chart using Highcharts with React - getting an error that rendering div isn't found
- Error in rendering a React highcharts x-range chart
- HighCharts Stock Chart error code 18
- Uncaught Error: Highcharts error #17 while creating sunburst chart using react
- How to create a column range chart in Highcharts using range and navigator functions?
- How do you increase the performance of highcharts chart creation and rendering
- Dynamically update Highcharts chart in react
- highcharts organization chart is throwing error when loading module
- Not rendering VU-meter Gauge chart using HighCharts in Durandal
- Highcharts chart going blank on zoomType: 'x' area range zoom?
- Issues using highcharts node export server from ClojureScript - "0x03 error when performing chart generation"
- Highcharts error 13, but rendering Div exists
- Adding date range filter to Highcharts chart
- Highcharts stock chart - Technical Indicators - Stock price is missing in the tooltip when selecting the 'All' range
- Highcharts rendering the same chart twice
- How to use Highcharts React to create chart with multiple lines for same XAxis?
- Highcharts - bubble chart with titles at x- and y-Axis - Error #14
- Drawing Bubble Chart by using npm highcharts with error #17
- How to create a HighCharts chart in react
- Rendering more than one chart with Highcharts using Angular js Directives
- Highcharts with react Error: "missingModule" with chart type of "timeline"
- Highcharts Sunburst chart - What is the range of colorVariation.to values?
- HighCharts chart asp.net mvc rendering
- Rendering Highcharts Chart in Two Container
- Highcharts display label for pie chart using html table as data source
- Highcharts organization chart (org chart) with React Native
- Remove gap in Highcharts column chart from null value from JSON file in React
- HighCharts error #17 for pyramid chart angular2
- Use exported data from Highcharts Editor in a new React chart
- Highcharts column chart histogram show x range in tooltip
- Uncaught TypeError: Cannot read property 'addPoint' of undefined ( Highstock live data)
- Create a vertical navigator to zoom in Highchart
- Highcharts line chart not loading data
- Reversing the min and max values in column chart
- highcharts pie window resize issue
- Summing graph data in highcharts
- Select which chart data category to show versus omit
- iterate JSON response with jQuery for Highcharts
- Highstock graph shows points instead of line at certain zoom levels
- Is it possible to have multiple highcharts with one id?
- Exclude "H:m"in dateTimeLabel Highcharts
- Network diagram meets Sankey chart
- angular-highcharts conflicts with legacy application's highcharts lib
- color in legend with range highcharts
- How To Change The Color of specific span of data in a chart
- Highcharts formatting data labels
- to check highcharts values using selenium and firefox
- Highcharts - show only hours and minutes in xAxis
- Highscharts not working after array passed array_diff
- Error: Unexpected token. A constructor, method, accessor, or property is expected. ts(1068)