binmade-charts v0.0.6

@BinMade/BinMadeCharts

BinMade自用图表

🖥 支持环境

• 现代浏览器和 IE11 及以上。

📦 安装

npm install binmade-charts

yarn add binmade-charts

🔨 示例

import { PieChart } from 'binmade-charts';

export default function() {
  const options = {
    title: {
      text: '能耗占比',
    },
    legend: {
      data: ['电', '蒸汽', '燃气', '水'],
    },
    tooltip: {
      unit: '万元',
    },
    color: ['#48D3C4', '#2C88FC', '#7A7EFF', '#FE9957'],
    series: {
      name: '能耗占比',
      data: [
        {
          name: '电',
          value: 123,
        },
        {
          name: '蒸汽',
          value: 234,
        },
        {
          name: '燃气',
          value: 45,
        },
        {
          name: '水',
          value: 34,
        },
      ],
      radius: ['55%', '75%'],
      center: ['50%', '40%'],
    },
  };

  return <PieChart options={options} style={{ height: 250 }} />;
}

🛡 TypeScript

参考 在 TypeScript 中使用

✨ 运行

# example运行
cd example && umi dev

# 如果没有 umi 这个命令, 请安装
$ yarn global add umi

# 文档运行
index.mdx编写后 yarn dev

# 监控文件变化并打包
$ yarn run dev

# 打包
$ yarn run build

🌈 Todo

• 柱状图和折线图
• 饼图
• 仪表盘
• React-Native 图表转换

⚙️ 可覆盖配置项

🤝 以下配置项均可参照echarts对应配置项覆盖更改，如有不满足需求的地方，请联系王晓烽进行更改