ant-design / ant-design-charts

A React Chart Library
https://ant-design-charts.antgroup.com/
MIT License
1.92k stars 361 forks source link

🧐[问题] I am not able to change the color of funnel chart with latest version #2726

Open darshakey opened 11 hours ago

darshakey commented 11 hours ago

Hi, I am unable to simply change the colors for funnel chart:

import React from 'react';
import ReactDOM from 'react-dom';
import { Funnel } from '@ant-design/plots';

const DemoFunnel = () => {
  const data = [
    { stage: 'Pre', number: 1 },
    { stage: 'C', number: 2,  },
    { stage: 'Warm', number:  3, },
    { stage: 'Engaged', number: 4 },
    { stage: 'hot', number: 5,  },
  ];

  const config = {
    data: data,
    xField: 'stage',
    yField: 'number',
    isTransposed: false,
    color: ["#3b82f6", "#8b5cf6", "#FFBF00", "#8F00FF", "#50C878", "#FFC0CB"],
    label: [
      {
        text: (d) => d.number,
        position: 'inside',
        fontSize: 16,
      },
    ],
  };

  return <Funnel {...config} />;
};

ReactDOM.render(<DemoFunnel />, document.getElementById('container'));

Version - 2.3.2 (I can able to change the color with the older version)

Here I am trying to change the color - https://ant-design-charts.antgroup.com/en/examples/statistics/funnel

can somebody help what is the new syntax for changing the color for funnel chart

Thanks

darshakey commented 11 hours ago

https://ant--design--charts-antgroup-com.translate.goog/en/examples/statistics/funnel?_x_tr_sl=auto&_x_tr_tl=en&_x_tr_hl=en-US&_x_tr_pto=wapp#transpose