import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
ready(echart) {
console.log(echart);
echart.on('click', (params)=>{
console.log(params);
alert("click");
});
}
render() {
<Chart options={ options } onReady={this.ready} />
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
render() {
<Chart {...options} >
<Chart.Line {...series} />
<Chart.Line {...series1} />
</Chart>
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
render() {
<Chart {...options} >
<Chart.Bar {...series} />
</Chart>
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
render() {
<Chart {...options} >
<Chart.Pie {...series} />
</Chart>
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
render() {
<Chart {...options} >
<Chart.Cloud {...series} />
</Chart>
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
render() {
<Chart {...options} >
<Chart.Map {...series} />
</Chart>
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
render() {
<Chart {...options} >
<Chart.Series {...series} type="line" />
</Chart>
}
})
ReactDOM.render(<myChart />, container);
import Chart from 'rc-echart';
import React from 'react';
import ReactDOM from 'react-dom';
const myChart = React.creatClass({
ready(chart) {
chart.on('click', ()=>{
alert('click');
});
}
render() {
const options = {
legend: {
data: ['最高气温', '最低气温'],
},
xAxis: [{
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
}],
yAxis: [{
type: 'value',
axisLabel: {
formatter: '{value} °C'
}
}],
};
return (
<Chart {...options} onReady={this.ready}>
<Chart.Line
name="最高气温"
data={[11, 11, 15, 13, 12, 13, 10]}/>
<Chart.Line
name="最低气温"
data={[1, -2, 2, 5, 3, 2, 0]}/>
</Chart>
);
}
})
ReactDOM.render(<myChart />, container);
rc-echart is released under the MIT license.