mathias22osterhagen22 opened a new issue, #18046: URL: https://github.com/apache/echarts/issues/18046
### Version 5.3.3 ### Link to Minimal Reproduction https://stackblitz.com/edit/vue-echarts-vue-3-pks16h?file=src/App.vue ### Steps to Reproduce 1. Creating a chart mixing stacked bar and one line serie. 2. Using these options: ```js const options = { tooltip: { trigger: 'axis', backgroundColor: '#152A83', borderColor: '#12236e', axisPointer: { type: 'shadow' }, textStyle: { fontSize: '14', color: 'white' }, }, legend: { textStyle: { color: 'white', fontSize: '14' } }, xAxis: { type: 'category', axisLabel: { fontSize: '14' }, axisLine: { lineStyle: { color: 'white' } }, data: [ '2020/12/09', '2021/01/09', '2021/02/09', '2021/03/09', '2021/04/09', '2021/05/09', '2021/06/09', '2021/07/09', '2021/08/09', '2021/09/09', '2021/10/09', '2021/11/09', '2021/12/09', '2022/01/09', '2022/02/09', '2022/03/09', '2022/04/09', '2022/05/09', '2022/06/09', '2022/07/09', '2022/08/09', '2022/09/09', '2022/10/09', '2022/11/09', ], }, yAxis: { type: 'value', axisLabel: { fontSize: '14' }, axisLine: { lineStyle: { color: 'white' } }, splitLine: { lineStyle: { color: '#00000055', width: 2 } }, }, series: [ { name: 'Total', type: 'line', smooth: true, data: [ 29341.42, 39495.51, 53975.13, 70495.36, 94098.58, 129141.18, 176459.8, 234632.52, 310709.61, 433640.1, 578090.69, 802503.55, 1077747.54, 1461113.99, 2042923.78, 2733625.67, 3792537.04, 5251416.56, 7294474.68, 9571496.06, 12897894.4, 17253890.78, 23558025.78, 31847609.51, ], color: '#1bba5e', lineStyle: { width: 4 }, connectNulls: true, symbol: 'circle', symbolSize: 6, }, { name: 'Product A', data: [ 606.65, 833.76, 1094.02, 1514.06, 2097.37, 2733.29, 3909.57, 5336.61, 7108.32, 9357.14, 12977.96, 17662.4, 23634.12, 31849.36, 43798.97, 57012.87, 78890.76, 102731.86, 139061.26, 191898.79, 267471.26, 364311.53, 480762.38, 636944.62, ], type: 'bar', stack: 'a', color: '#f7931a', }, { name: 'Product B', data: [ 3398.58, 4425.34, 5893.6, 8025.25, 11280.82, 14899.64, 21451.33, 28441.68, 38841.51, 51804.19, 67520.18, 90446.44, 127754.98, 171509.62, 235397.33, 307721.15, 403461.92, 559226.07, 803925.12, 1074673.6, 1440038.84, 2060738.41, 2666871.24, 3345564.55, ], type: 'bar', stack: 'a', color: '#627feb', }, { name: 'Product C', data: [ 10104.74, 13968.51, 20334.25, 26976.08, 35872.01, 49180.23, 68563.64, 92788.51, 121899.49, 162141.15, 218232.44, 298863.7, 412390.81, 569312.72, 774470.61, 1055789.35, 1548356.84, 2100664.54, 2962701.44, 3816219.73, 4934664.39, 6540221.74, 8791465.53, 11852330.33, ], type: 'bar', stack: 'a', color: '#26a07a', }, { name: 'Product D', data: [ { value: 15231.45, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 20267.9, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 26653.26, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 33979.97, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 44848.38, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 62328.02, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 82535.26, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 108065.72, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 142860.29, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 210337.62, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 279360.11, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 395531.01, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 513967.63, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 688442.29, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 989256.87, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 1313102.3, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 1761827.52, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 2488794.09, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 3388786.86, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 4488703.94, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 6255719.91, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 8288619.1, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 11618926.63, itemStyle: { borderRadius: [10, 10, 0, 0] } }, { value: 16012770.01, itemStyle: { borderRadius: [10, 10, 0, 0] } }, ], type: 'bar', stack: 'a', color: '#3f73c5', }, ], } ``` ### Current Behavior The Chart get out of the div container and not centered:   Result:  You can see in SVG mode that the `rectangle` inside the `svg` element is correct:  But the `g` element is out of shape:  ### Expected Behavior The Canva should be centered:  (Made a manual fix)  ### Environment ```markdown - OS: Windows 10 & 11 - Browser: Chrome & Firefox & Brave - Framework: Vue@3 ``` ### Any additional comments? _No response_ -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
