antV chart design legend

Question

please I want to make legend in this chart based on the 'action' value. I just got 'sell' for the both lines: enter image description here The code:

  const config = {
    data,
    xField: 'createdAt',
    yField: 'price',
    seriesField: 'action',
    yAxis: {
      label: {

        formatter: (v) => `${v}`.replace(/\d{1,3}(?=(\d{3})+$)/g, (s) => `${s},`),
      },
    },
    
    legend: {
      position: 'top-right',
      itemName: {
        style: {
          fill: '#000',
        },

        formatter: (seriesField) => {
          if (seriesField.value === "1") {
            return 'buy';
          }

          return 'sell';

        },
        //formatter: (name) => name,

      },
    },


  };

Answer 1

I think you just need legend: true inside your config

Answer 2

Your condition is always same. Variable 'seriesField' is a string, so there is no need to used as 'seriesField.value'.

formatter: (seriesField) => {
    if (seriesField === "1") {
        return 'buy';
    }
    return seriesField;
},