q-react-highchart v1.0.0

安装

npm install q-react-highchart

本地调试

npm run dev

本地测试

ES6转ES5

npm run babel

使用

import { LineChart, PieChart }　from 'q-react-highchart';

const lineSeries = [
  {
    name: 'name1',
    data: [{
      x: 1231232131,
      y: 1123,
    }, {
      x: 1231235551,
      y: 1123123,
    }],
  },
];

const lineConfig = {
  colors: ['#F06C53', '#56bc76', '#1eb7d8', '#7A5AA6', '#F0CA4D', '#98CB65', '#0873b9'],
};


const pieSeries =[
  {        
    suffix: 'GB', 
    name: 'A-1', 
    y: 100,
  },
  {        
    suffix: 'GB', 
    name: 'B-1', 
    y: 30,
  }
];

const pieConfig = {
  colors: ['#F06C53', '#56bc76', '#1eb7d8', '#7A5AA6', '#F0CA4D', '#98CB65', '#0873b9'],
};


class　Demo extends Component {
  constructor(props) {
    super(props);
  }

  render () {

    return (
      <div>
        <div>
          <LineChart data={lineSeries} config={lineConfig} />
          <PieChart data={pieSeries} config={pieConfig} />
        </div>
      </div>
    )
  }
}

ReactDOM.render(
  <Demo />,
  document.getElementById('root')
);

LineChart线性图

data

PieChart饼图

data