Если я добавлю две оси Y в Apexchart, он будет перемещен за обертку и не изменится должным образом. Я хотел бы, чтобы одна ось Y отображалась в левой части графика, а другая — в правой.

Я попытался отладить его в моих инструментах разработки, но я уверен, что это проблема холста.

Ниже приведен фрагмент, который показывает, как выходят данные левой оси Y и января.

var yearMapOptions = { chart: { fontFamily: "'Varela Round', sans-serif", foreColor: '#2e1a6d', toolbar: { show: false }, height: "100%", stacked: false }, colors: ['#2e1a6d', '#47bfb6', '#f37b94', '#ebf394'], dataLabels: { enabled: false }, series: [{ name: 'Net Pips', type: 'line', data: [-10, 17, 39, -4, 63, -27, 55, 290, -83, 26, -45, 17], }, { name: 'Net Profit', type: 'line', data: [-35, 45, 190, -70, -50, 36, -80, 59, -29, 62, -65, 70] }, { name: 'Total Volume', type: 'column', data: [20, 60, 35, 57, 330, 30, 660, 58, 58, 230, 70, 120] }, { name: 'Total Trades', type: 'column', data: [6, 23, 11, 8, 33, 4, 57, 13, 13, 45, 17, 28] }], stroke: { width: [3, 3, 3, 3], curve: 'smooth' }, xaxis: { categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'June', 'July', 'August', 'Sep', 'Oct', 'Nov', 'Dec'], }, yaxis: [{ show: true, seriesName: 'Net Pips', opposite: true, tickAmount: 2, forceNiceScale: true, axisTicks: { show: false, }, axisBorder: { show: true, color: '#00E396' }, axisTicks: { show: false, borderType: 'solid', color: '#47bfb6', }, labels: { style: { color: '#00E396', } }, title: { text: undefined, style: { color: '#00E396', } }, }, { show: true, seriesName: 'Net Profit', opposite: false, tickAmount: 2, forceNiceScale: true, axisTicks: { show: true, borderType: 'solid', color: '#2e1a6d', }, axisBorder: { show: true, color: '#FEB019' }, labels: { style: { color: '#FEB019', }, }, title: { text: undefined, style: { color: '#FEB019', } }, } ], plotOptions: { bar: { horizontal: false, endingShape: 'rounded', barheight: '100%' } }, tooltip: { fixed: { enabled: true, position: 'topLeft', // topRight, topLeft, bottomRight, bottomLeft offsetY: 30, offsetX: 60 }, }, grid: { show: false }, legend: { position: 'top', horizontalAlign: 'left', offsetY: 10 } }; var yearMapChart = new ApexCharts( document.querySelector("#yearMap"), yearMapOptions ); yearMapChart.render(); 
 .apexcharts-yaxis, .apexcharts-xaxis-label { font-weight: bold; } .yearMapWrapper { height: 100%; width: 80%; margin-left: 10%; } 
 {amp}lt;html{amp}gt; {amp}lt;body{amp}gt; {amp}lt;div class="rowFiveCol2 layerStyles"{amp}gt; {amp}lt;div class="yearMapWrapper"{amp}gt; {amp}lt;div id="yearMap"{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/body{amp}gt; {amp}lt;script src="https://cdn.jsdelivr.net/npm/apexcharts"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;html{amp}gt; 

Удаление grid: { show: false } делает ось Y видимой.

PS: изменение поведения сетки не должно влиять на ось Y. Похоже, ошибка в ApexCharts, которая будет устранена в ближайшее время.