antvis/G2

柱折组合图。.scale('series', { independent: true })表示含义是什么 #6349

Calmio-Y posted onGitHub

问题描述

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

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

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 }, ];

chart.data(data);

chart .interval() .encode('x', 'time') .encode('y', 'waiting') .encode('color', () => 'waiting') .encode('series', () => 'waiting') .axis('y', { title: 'Waiting' }) .scale('y', { nice: true });

// chart // .interval() // .encode('x', 'time') // .encode('y', 'people') // .encode('color', () => 'people') // .encode('series', () => 'people') // .scale('y', { independent: true }) // .axis('y', { position: 'right', grid: null, title: 'People' });

chart .line() .encode('x', 'time') .encode('y', 'call') .encode('color', () => 'call') .scale('series', { independent: true });

chart.render();

重现链接

No response

重现步骤

No response

预期行为

No response

平台

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

屏幕截图或视频(可选)

image

image

补充说明(可选)

示例代码: 三个图混合tooltip显示正常 二个图混合tooltip显示异常 .scale('series', { independent: true })意义是什么?


posted by interstellarmt 4 months ago

多轴图双轴图的用法之后会有更详细的文档,敬请期待~

posted by interstellarmt 4 months ago

Fund this Issue

$0.00
Funded

Pull requests