Questions tagged [react-apexcharts]
18 questions
1
vote
0 answers
Y-axis scale in react-apexcharts doesn't update the symbol dynamically
I'm using react-apexcharts to visualize some financial data. My chart has an option to switch the Y-axis scale between percentages and dollars. Although the scale changes correctly when I click on the respective buttons, the axis labels (symbols %…

Damiano Dotto
- 105
- 1
- 10
1
vote
0 answers
How to limit the range of scrollable x-axis in ApexCharts?
I'm using columns type chart. Just same chart with this example in apexchart demo.
React Chart Demos > Column Charts > Stacked Columns
To-be
When x-axis scroll reaches the left-most bar of the chart, make it no longer scrolls to the left. (same in…

Lucy
- 49
- 1
- 5
1
vote
1 answer
How to show apps icons at the top of chart bar using react-apex chart?
Hi i am using React Fuse theme suggested from one of my client. On Dashboard i am showing some chart line chart bar and line chart etc. According to the design there are app icons at the top of the chart bars.
Look at the screenshot attached with…

Asmar Munir
- 13
- 4
1
vote
0 answers
Testing react-apexcharts apexcharts with Jest and React Testing Library. snapshot fails read properties of undefined (reading 'node')
Testing react-apexcharts apexcharts with Jest and React Testing Library. snapshot fails
Hi, I'm trying to test my chart component, that i created using apexchart with the react integration. But I can't even create a snapshot that seems related to…

Fran
- 11
- 1
0
votes
0 answers
How to handle labels in x-axis in ellipsis format in Apexchart
I want to show all the labels on x-axis in ellipsis format and onhovering the labels tooltip should show the actual context.
To achieve this, I tried two approaches:
The build-in property trim. By using this property I achieved the ellipsis property…
0
votes
0 answers
ApexCharts make specific legend series not clickable?
In the below code I'm hiding the series that contain zero data
useEffect(() => {
if (props.bicycleType === "ROAD_BIKE")
roadBikeSeries.forEach((series) => {
if (series.data.length === 0) {
ApexCharts.exec("RoadBike",…

Strike
- 77
- 1
- 7
0
votes
0 answers
Adding data to Series B data also effect series A data in apexchart React js
I want series A (Horizontal Bar chart) data to be always of length 11. but if the data of series B increases from 11 it also effect series A. The horizontal bar chart show threshold and line chart show data from center. the sensor data updates every…
0
votes
1 answer
React Apexchart Multi-Series Bar Chart
I'm trying to make a multi-series bar chart (NOT A TIME SERIES) and I've finally figured it out but my bars are too thin because I have to render null values in other places in order to make the chart function correctly.
What I want are thicker…

Nikster
- 427
- 5
- 14
0
votes
0 answers
React Apexcharts not resizing when drawer opens
I am using MUI mini variant drawer, I have set the main div content where the outlet is at to be padded by 100px when the drawer is closed partially and 300px when the drawer is opened, it's working fine on all components except react apexcharts…

Fouad Hamdy
- 33
- 3
0
votes
0 answers
How to display all bars in a bar chart when one category has a much higher value?
I am currently working on a bar chart component using ReactApexChart(react-apexcharts: ^1.3.9) library to visualize some data. The chart contains a set of categories (countries) and their corresponding values. The issue I am facing is that when one…

Muthukumar M
- 1
- 1
0
votes
1 answer
How to export ApexCharts graph to PDF when using hooks?
I'm using ApexCharts to render graphs on user selection. I'm using React hooks. I want to have a button that will generate a PDF file from the current ( or multiple) graph.
I have checked jsPDF and there is an example how to do that , but I'm unable…

zlobul
- 335
- 1
- 5
- 20
0
votes
1 answer
React Apex-charts Unable to change chart.id
I'm unable to change my chart id dynamically and cant understand why. The reason I want to change it is because it is related to the graph filename , when I want to export a graph as CSV or Image. Also I would need the chart id to generate some PDF…

zlobul
- 335
- 1
- 5
- 20
0
votes
0 answers
React Apex Charts Update options
I am using apex chart and wanted to change the x-axis formatter function based on a state, but it is still using the first function passed to it when the component renders for the first time.
I was expecting it to use the other function when the…

Nishant Singh
- 1
- 1
0
votes
0 answers
Is it possible to make this kind of label using apex charts with react?
I've been tinkering with the options for some time now and managed to offset the the dataLabels, then using formater to add some custom text.
dataLabels: {
enabled: true,
style: {
colors: ['primary'],
fontSize:…

MadeOfTwoJays
- 31
- 3
0
votes
0 answers
Apexchart.js dosnt show RangeBar with horizontal Xaxis lines
I am using the Apexchart libary (https://apexcharts.com/). I am trying to build a rangebar with horizontal xAxis lines. In the following Code you see my example. https://codesandbox.io/s/react-basic-example-forked-cmf82r?file=/src/App.js
I have…

CanB
- 1
- 1