antvis/G2

双轴的网格对齐线可以共用一份吗? #6094

YY88Xu posted onGitHub

问题描述

<img width="1304" alt="image" src="https://github.com/antvis/G2/assets/14836228/016a8374-f616-4db3-8b49-886a829e9271"> 如图,左侧坐标轴的网格线没有跟右侧坐标轴对齐,可以对齐吗?

重现链接

No response

重现步骤

import { Chart } from '@antv/g2';

const data = [ { time: '10:10', call: 4, waiting: 2, people: 2 }, { time: '10:15', call: 2, waiting: 6, people: 3 }, { time: '10:20', call: 13, waiting: 2, people: 5 }, { time: '10:25', call: 9, waiting: 9, people: 1 }, { time: '10:30', call: 5, waiting: 2, people: 3 }, { time: '10:35', call: 8, waiting: 2, people: 1 }, { time: '10:40', call: 13, waiting: 1, people: 2 }, ];

const chart = new Chart({ container: 'container', autoFit: true, });

chart.data(data);

chart .interval() .encode('x', 'time') .encode('y', 'waiting') .axis('y', { title: 'Waiting', titleFill: '#5B8FF9' }) .scale('y', { nice: true, })

chart .line() .encode('x', 'time') .encode('y', 'people') .encode('shape', 'smooth') .style('stroke', '#fdae6b') .style('lineWidth', 2) .scale('y', { independent: true,nice: true }) .axis('y', { position: 'right', grid: null, title: 'People', titleFill: '#fdae6b', });

chart.render();

预期行为

No response

平台

  • 操作系统: [macOS, Windows, Linux, React Native ...]
  • 网页浏览器: [Google Chrome, Safari, Firefox]

屏幕截图或视频(可选)

No response

补充说明(可选)

No response


只能通过自定义的 tickMethod 来自己根据自己的数据范围来实现,要实现对于不确定的数据范围做同 tick,目前算法上有些困难。

posted by hustcc about 1 year ago

Fund this Issue

$0.00
Funded

Pull requests