Ant-design-pro: Pie chart "Color" prod doesn't working

Created on 9 Apr 2018  ·  2Comments  ·  Source: ant-design/ant-design-pro

Hey,
I'm using latest ant pro (1.2.1), trying to use the Pie card, and Color prop but it seems that it ignores the value I'm writing.

any ideas?

Thanks!

Most helpful comment

@sahar922 when Pie in percent type, the color property will change the Circel color, but when Pie in default mode, you need use colors property, this will be a array.

we will replenish to the docs.

              <Pie
                hasLegend
                subTitle="销售额"
                colors={['#001122', '#003322', '#004422', '#005522', '#006622', '#007722', '#008822' ]}
                total={() => (
                  <span
                    dangerouslySetInnerHTML={{
                      __html: yuan(salesPieData.reduce((pre, now) => now.y + pre, 0)),
                    }}
                  />
                )}
                data={salesPieData}
                valueFormat={val => <span dangerouslySetInnerHTML={{ __html: yuan(val) }} />}
                height={248}
                lineWidth={4}
              />

All 2 comments

@nikogu

@sahar922 when Pie in percent type, the color property will change the Circel color, but when Pie in default mode, you need use colors property, this will be a array.

we will replenish to the docs.

              <Pie
                hasLegend
                subTitle="销售额"
                colors={['#001122', '#003322', '#004422', '#005522', '#006622', '#007722', '#008822' ]}
                total={() => (
                  <span
                    dangerouslySetInnerHTML={{
                      __html: yuan(salesPieData.reduce((pre, now) => now.y + pre, 0)),
                    }}
                  />
                )}
                data={salesPieData}
                valueFormat={val => <span dangerouslySetInnerHTML={{ __html: yuan(val) }} />}
                height={248}
                lineWidth={4}
              />
Was this page helpful?
0 / 5 - 0 ratings

Related issues

yjz1004 picture yjz1004  ·  3Comments

cheung1111 picture cheung1111  ·  3Comments

wuyongdec picture wuyongdec  ·  3Comments

lvzheng0404 picture lvzheng0404  ·  3Comments

zhuanglong picture zhuanglong  ·  3Comments