antvis/G2

Do you want to work on this issue?

You can request for a bounty in order to promote it!

5.0新增api对应4.0的getXY #6620

sanye-huang posted onGitHub

主要用于给某一些x的特定位置(比如max、min)添加标注。目前设置text要么是data要么是x y的百分比像素,无法做到对应的功能。


感觉需要的是text标记的data语法糖(max,min),getXY方法的优先级可能不高?

posted by interstellarmt about 2 months ago

📝 To help us better understand and address your issue, please provide more information, or use the standard format, otherwise we will not process this issue.

Reference document:


📝 为了帮助我们更好地理解和解决你的问题,请提供更多信息,或者使用规范的格式,否则我们不会处理这个 issue。

参考文档:

posted by github-actions[bot] about 2 months ago

需要感觉的是文本标记的数据语法糖(max,min),getXY方法的优先级可能不高?

优先级都不是很高,getxy和min、max我觉得对一些灵活场景都非常有必要

posted by sanye-huang about 2 months ago

如果是上面说的这种场景,给某一些x的特定位置(比如max、min)添加标注,其实内置的transform已经支持

type Selector =
  | 'min'
  | 'max'
  | 'first'
  | 'last'
  | 'mean'
  | 'median'
  | ((I: number[], V: number[]) => number[]);

以下是示例

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

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

chart
  .data({
    type: 'fetch',
    value:
      'https://gw.alipayobjects.com/os/antvdemo/assets/data/blockchain.json',
    transform: [
      {
        type: 'fold',
        fields: ['blockchain', 'nlp'],
        key: 'type',
        value: 'value',
      },
    ],
  })
  .axis('x', { labelAutoHide: 'greedy' });

chart
  .line()
  .encode('x', (d) => new Date(d.date))
  .encode('y', 'value')
  .encode('color', 'type');

chart
  .text()
  .encode('x', (d) => new Date(d.date))
  .encode('y', 'value')
  .transform({ type: 'select', channel: 'y', selector: 'max' })
  .style({
    text: `2017-12-17, 受比特币影响,blockchain 搜索热度达到峰值:100`,
    wordWrap: true,
    wordWrapWidth: 164,
    dx: -174,
    dy: 30,
    fill: '#2C3542',
    fillOpacity: 0.65,
    fontSize: 10,
    background: true,
    backgroundRadius: 2,
    connector: true,
    startMarker: true,
    startMarkerFill: '#2C3542',
    startMarkerFillOpacity: 0.65,
  })
  .tooltip(false);

chart.render();
posted by interstellarmt about 2 months ago

假设我希望画一个图形,如下

Image

可能是一个点到另外一个点的箭头,可能是三个点的三角形关系,在4里面只需要获取各个点的xy,然后render一个自定义shape就可以

posted by sanye-huang about 2 months ago

Fund this Issue

$0.00
Funded
Only logged in users can fund an issue

Pull requests