antvis/G2

color 通道使用回调自定义颜色的时候,折线图显示有问题 #5009

hustcc posted onGitHub

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

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

chart
  .line()
  .data({
    type: 'fetch',
    value: 'https://assets.antv.antgroup.com/g2/indices.json',
  })
  .transform({ type: 'normalizeY', basis: 'first', groupBy: 'color' })
  .encode('x', (d) => new Date(d.Date))
  .encode('y', 'Close')
  .encode('color', (d) => d.Symbol === 'AAPL' ? 'red' : 'blue')  // 👈🏻
  .scale('color', { type: 'identity' })
  .scale('y', { type: 'log' })
  .axis('y', { title: '↑ Change in price (%)' })
  .label({
    text: 'Symbol',
    selector: 'last',
    style: {
      fontSize: 10,
    },
  })
  .tooltip({ channel: 'y', valueFormatter: '.1f' });

chart.render();

image


增加配置:

{
  series: 'Symbol',
}
posted by hustcc almost 2 years ago

Fund this Issue

$0.00
Funded

Pull requests