2
0

ExpPie.tsx 1005 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import { Pie } from "@ant-design/plots";
  2. export interface IPieData {
  3. type: string;
  4. value: number;
  5. }
  6. interface IWidget {
  7. data?: IPieData[];
  8. }
  9. const ExpPieWidget = ({ data = [] }: IWidget) => {
  10. console.log("pie data", data);
  11. const config = {
  12. appendPadding: 10,
  13. data,
  14. angleField: "value",
  15. colorField: "type",
  16. radius: 1,
  17. innerRadius: 0.6,
  18. label: {
  19. type: "inner",
  20. offset: "-50%",
  21. content: "{value}",
  22. style: {
  23. textAlign: "center",
  24. fontSize: 14,
  25. display: "none",
  26. },
  27. },
  28. interactions: [
  29. {
  30. type: "element-selected",
  31. },
  32. {
  33. type: "element-active",
  34. },
  35. ],
  36. statistic: {
  37. content: {
  38. style: {
  39. whiteSpace: "pre-wrap",
  40. overflow: "hidden",
  41. textOverflow: "ellipsis",
  42. display: "none",
  43. },
  44. content: "a",
  45. },
  46. },
  47. };
  48. return <Pie {...config} style={{ height: 120 }} />;
  49. };
  50. export default ExpPieWidget;