antvis/G2

How to show custom icons for scatter plot data points? #3603

imaaditya-stack posted onGitHub

<!-- Thank you for reporting an issue. 1. It's RECOMMENDED to submit PR for typo or tiny bug fix. 2. If this's a FEATURE request, please provide: details, pseudo codes if necessary. 3. If this's a BUG, please provide: course repetition, error log and configuration. Fill in as much of the template below as you're able. 4. It will be nice to use to provide a CodePen Link which can reproduce the issue, we provide a CodePen template g2-github-issue. 感谢您向我们反馈问题。 1. 提交问题前,请先阅读 https://antv.alipay.com/zh-cn/g2/3.x/index.html 上的文档。 2. 我们推荐如果是小问题(错别字修改,小的 bug fix)直接提交 PR。 3. 如果是一个新需求,请提供:详细需求描述,最好是有伪代码实现。 4. 如果是一个 BUG,请提供:复现步骤,错误日志以及相关配置,并尽量填写下面的模板中的条目。 5. 如果可以,请提供尽可能精简的 CodePen 链接,可使用 CodePen 模板 https://codepen.io/leungwensen/pen/WXJgox,方便我们排查问题。 6. 扩展阅读:如何向开源项目提交无法解答的问题 -->

  • G2 Version:
  • Platform:
  • Mini Showcase(like screenshots):
  • CodePen Link:

<!-- Enter your issue details below this comment. -->

Below is an example of my scatter plot image

I want to show custom ant design icons for each data point based on a data point in my data like below

image

My chart config

  var config = {
    data: data,
    xField: "date",
    yField: "score",
    xAxis: {
      tickCount: 4,
      label: {
        formatter: function formatter(v: any) {
          return moment(v, "YYYY-MM-DD hh:mm A").format("hh:mm A");
        },
        style: {
          fill: "#6E759F",
        },
      },
    },
    yAxis: {
      label: {
        style: {
          fill: "#9AA5B5",
        },
      },
    },
    meta: {
      score: {
        min: 0,
        max: 100,
        tickInterval: 25,
      },
    },
  };

My data structure

  {
    "id": ,
    "date": "2021/05/20 12:03:00 PM",
    "Application": "",
    "Activity": "",
    "score": 50
  }

The icon should be based on Activity in the data structure above. For eg -> If Activity is Login then login icon will show for the data point.


posted by hustcc over 1 year ago

Fund this Issue

$0.00
Funded

Pull requests