I'm encountering an issue where I cannot seem to be able to figure out how to do a mixed chart that combines steplines with simple lines
I seem to be able to do steplines on their own or any other combo
- full stepline by adding a
options.stroke.curve = "stepline"value - line + column by editing
series[x].type = "column"
However, series[x].type = "line"+series[x].stroke.curve = "stepline" does not seem to work
I did notice that the options tend to overwrite the contents of the series when applicable but the series not dot seem to want to do a stepline
Here is a simple example of what I am attempting to do :
import React from 'react';import ReactApexChart from 'react-apexcharts';import { ApexOptions } from 'apexcharts';function MyChart() { const series = [ { name: "Straight Line", type: 'line', data: [10, 41, 35, 51, 49, 62, 69, 91, 148] }, { name: "Step Line", type: 'line', data: [30, 32, 33, 38, 37, 44, 55, 60, 66], stroke: { curve: 'stepline' } } ]; const options: ApexOptions = { chart: { height: 350, type: 'line', }, stroke: { width: [4, 4] }, title: { text: 'Line and Step Line Chart' }, xaxis: { categories: [1, 2, 3, 4, 5, 6, 7, 8, 9] }, yaxis: { title: { text: 'Values' } } }; return (<ReactApexChart options={options} series={series} type="line" height={350} /> );}export default MyChart;What am I not doing correctly ? As I am assuming that it should be possible considering that I did not see anything it was not in the documentation
