迷你面积图会超出设置的大小 #6064
YY88Xu posted onGitHub
问题描述
<img width="411" alt="image" src="https://github.com/antvis/G2/assets/14836228/25923702-ae28-4a3e-9260-3ab7065da30d"> 如图,面积图的小尖尖被盖住了
重现链接
No response
重现步骤
import { Chart } from '@antv/g2';
const data = [ 264, 417, 438, 887, 309, 397, 550, 575, 563, 430, 525, 592, 492, 467, 513, 546, 983, 340, 539, 243, 226, 192, ];
const chart = new Chart({ container: 'container', width: 207, height: 40, });
chart.data(data);
chart .area() .encode('x', (_, idx) => idx) .encode('y', (d) => d) .encode('shape', 'smooth') .scale('y', { zero: true }) .style('fill', 'linear-gradient(-90deg, white 0%, darkgreen 100%)') .style('fillOpacity', 0.6) .animate('enter', { type: 'fadeIn' }) .axis(false);
chart .line() .encode('x', (_, idx) => idx) .encode('y', (d) => d) .encode('shape', 'smooth') .style('strokeWidth', 3)
chart.interaction('tooltip', { render: (e, { title, items }) => items[0].value, })
chart.attr('padding', 0).attr('margin', 0).attr('paddingTop', '20')
chart.render();
预期行为
No response
平台
- 操作系统: [macOS, Windows, Linux, React Native ...]
- 网页浏览器: [Google Chrome, Safari, Firefox]
屏幕截图或视频(可选)
No response
补充说明(可选)
No response