Commit c8ea5979 authored by ι™ˆεΈ…'s avatar ι™ˆεΈ…

remove auto width

parent a2cca354
...@@ -12,7 +12,6 @@ import styles from './index.less'; ...@@ -12,7 +12,6 @@ import styles from './index.less';
/* eslint react/no-danger:0 */ /* eslint react/no-danger:0 */
class Pie extends Component { class Pie extends Component {
state = { state = {
width: 0,
height: 0, height: 0,
legendData: [], legendData: [],
legendBlock: false, legendBlock: false,
...@@ -96,19 +95,18 @@ class Pie extends Component { ...@@ -96,19 +95,18 @@ class Pie extends Component {
resizeObserver() { resizeObserver() {
const ro = new ResizeObserver(entries => { const ro = new ResizeObserver(entries => {
const { width, height } = entries[0].contentRect; const { height } = entries[0].contentRect;
this.setState((preState, { hasLegend }) => { this.setState(preState => {
if (preState.width !== width || preState.height !== height) { if (preState.height !== height) {
return { return {
width: width - (hasLegend ? 240 : 0),
height, height,
}; };
} }
return null; return null;
}); });
}); });
if (this.root) { if (this.chartDom) {
ro.observe(this.root); ro.observe(this.chartDom);
} }
} }
...@@ -152,7 +150,7 @@ class Pie extends Component { ...@@ -152,7 +150,7 @@ class Pie extends Component {
lineWidth = 1, lineWidth = 1,
} = this.props; } = this.props;
const { legendData, height: StateHeight, width, legendBlock } = this.state; const { legendData, height: stateHeight, legendBlock } = this.state;
const pieClassName = classNames(styles.pie, className, { const pieClassName = classNames(styles.pie, className, {
[styles.hasLegend]: !!hasLegend, [styles.hasLegend]: !!hasLegend,
[styles.legendBlock]: legendBlock, [styles.legendBlock]: legendBlock,
...@@ -225,13 +223,17 @@ class Pie extends Component { ...@@ -225,13 +223,17 @@ class Pie extends Component {
return ( return (
<div ref={this.handleRoot} className={pieClassName} style={style}> <div ref={this.handleRoot} className={pieClassName} style={style}>
<div
ref={ref => {
this.chartDom = ref;
}}
>
<ReactFitText maxFontSize={25}> <ReactFitText maxFontSize={25}>
<div className={styles.chart}> <div className={styles.chart}>
<Chart <Chart
scale={scale} scale={scale}
height={height || StateHeight} height={height || stateHeight}
data={dv} data={dv}
width={width}
padding={padding} padding={padding}
animate={animate} animate={animate}
onGetG2Instance={this.getG2Instance} onGetG2Instance={this.getG2Instance}
...@@ -259,6 +261,7 @@ class Pie extends Component { ...@@ -259,6 +261,7 @@ class Pie extends Component {
)} )}
</div> </div>
</ReactFitText> </ReactFitText>
</div>
{hasLegend && ( {hasLegend && (
<ul className={styles.legend}> <ul className={styles.legend}>
{legendData.map((item, i) => ( {legendData.map((item, i) => (
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment