F2 icon indicating copy to clipboard operation
F2 copied to clipboard

Support customing the fill attribute of the chart component

Open HelloAny opened this issue 1 year ago β€’ 2 comments

  • [ ] I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

  1. Help users more flexibly modify the background of the Chart component.
  2. When I adapt to the company's hybrid container, will get some error when useing 'transparent'.

What does the proposed API look like?

const { fillStyle } = props;

  <group
        ref={this.coordRef}
        style={{
          width: width,
          height: height,
          fill: fillStyle || 'transparent',
        }}
      >
...
 </group>

HelloAny avatar Dec 04 '24 06:12 HelloAny

https://github.com/antvis/F2/blob/e3659d21db9b7c540cad7f9e75664ee564a7028f/packages/f2/src/chart/index.tsx#L357

HelloAny avatar Dec 04 '24 06:12 HelloAny

I got a idea to extend Chart Instance, and override the Render Function. But this approach seems not very flexible.

class NewChart extends Chart {
   ...super
render() {

}
}

This approach need to compile with babel/plugin-transform-react-jsx. But my project is use Vue framework. This does not seem to be a very good way

HelloAny avatar Dec 05 '24 02:12 HelloAny