草稿
## BarChart
```js
data: {
xAxisName: '名称',//x轴--所属类型或单位或是代表的含义
yAxisName: '人数',//x轴--所属类型或单位或是代表的含义
xAxisData: ["分队1", "分队2", "分队3", "分队4", "分队5", "分队6", "分队7"],//x轴的数据
yData: [220, 182, 191, 234, 290, 330, 310],//y轴数据
}
```
## BarTransverseChart
```js
data: {
legendData: ["使用时长", "使用年限"],//图例(当xAxisData有多条数据时加上此属性)
xAxisData: [
{//可多个
isShow:true,//x轴单位数据是否显示,当有x轴有多个时,可设置哪条不显示
name: "人数",//x轴单位、含义
type:"value",//x值类型
position:"bottom",//x轴显示位置
data: null//x轴数据
}
],
yAxisData: [
{//暂未有多个
name: "证书种类",//y轴单位
type:"category",//y轴类型
data: ["证书1", "证书2", "证书3", "证书4", "证书5", "证书6", "证书7"]//y轴数据
}
],
seriesData:[//数据及样式
{
barWidth:"16",//柱状图的宽度
color:["#2bce9d","#3fe9b5"],//柱状图的颜色
name:null,//-----忘记为什么要加了,可以先加上
data:[22, 33, 44, 55, 66, 77, 88]//数据
}
],
}
```
## BarTransverseChart2
```js
data: {
yDate1: ["设备1", "设备2", "设备3", "设备4", "设备5"],//y轴一侧的数据
yDate2: [150, 134, 114, 183, 145],//y轴另一侧的数据
seriesData: [150, 134, 114, 183, 145],//柱状图反应的数据长度
}
```
## PolygonalChart
```js
data: {
xAxisName: '政治面貌',//x轴代表的数据单位、含义
yAxisName: '人数',//y轴代表的数据的单位、含义
xAxisData: ["团员", "党员", "群众"],//x轴数据
yData: [28, 12, 6, 28, 7, 6, 3],//y轴数据
}
```
## PolygonalChart2
```js
data: {
color:["#3398DB"],//颜色
xAxisData: [
{
name:"时",//x轴代表的单位、含义
value:["2","4","6","8","10","12","14","16","18","20","22","24"]//x轴数据
}
],
yAxisData:["kwh"],//y轴数据的单位、含义
seriesData:[
{
name:"总电量",//是什么数据
value:[246, 250, 160, 451, 455, 148, 243, 143, 156, 258, 160, 142]//数据的值
}
]
}
```
## BarPolygonaChart
```js
data: {
legendData: ["系统分配", "手动添加", "未接收", "已接收", "已完成"],//图例
xAxisName: '月',//x轴单位、含义(非必要)
xAxisData: ["2015", "2016", "2017", "2018", "2019"],//x轴数据
yAxisData: ["故障来源(个)", "处理结果(个)"],//y轴数据,若只有一个["能耗(KW/h)",""]
seriesData: [
{//若柱状图有背景需加上此对象
name: "背景",//背景柱
type:"bar",//背景是个柱
color:null,//背景的颜色
hasBG:true,//有否要背景
bgbarWidth: "70%",//背景的宽度
bgbarGap: "-75%",//背景间的距离
hasStack:false,//
color:["rgba(47, 151, 226, 0)","rgba(47, 151, 226, 0.4)"],//背景颜色是个渐变
data: [250, 250, 250, 250, 250,250, 250, 250, 250, 250, 250, 250],//背景数据
},
{//数据类型是柱,可多个
name: '系统分配',//数据1名称
type:'bar',//数据1类型是柱(线、柱)-(line、bar)
color:["#11eed6","#31f2c9"],//数据1颜色
barWidth:15,//数据1(类型是柱时加上)
hasStack:true,//忘记代表什么含义了
data: [50, 200, 100, 80, 180],//数据1
},
{ //数据类型时线,可多条
name: '未接收',//数据2名称
type:'line',//数据2类型是线
color:["#f90","#f90"],//数据2颜色
data: [15, 10, 22, 18, 24],//数据2
},
]
}
},
```
## RingChart
```js
data: {
text: 8000,//中间现实的数值
subtext: '工程总人数范围',//中间显示的文字
legendData: ["将官", "士兵", "校官", "尉官"],//图例
rankData: [//数值
{ value: 2392, name: "将官" },
{ value: 1922, name: "士兵" },
{ value: 1862, name: "校官" },
{ value: 3200, name: "尉官" }
]
}
```
## RingChart2
```js
data: {
scaleData: [
{
name: "专业类型1",
value: 10
},
{
name: "专业类型2",
value: 10
},
{
name: "专业类型3",
value: 10
},
{
name: "专业类型4",
value: 10
},
{
name: "专业类型5",
value: 10
},
{
name: "专业类型6",
value: 10
}
]
}
```
## RingChart3
```js
data:{
intervalvValue: 1.4, // 两曲线环间距
scaleData:[//数据
{
name: "待接收",
value: 20
},
{
name: "已完成",
value: 15
},
{
name: "处理中",
value: 10
}
],
colorData:[["#01c0e0","#00a8ec"],["#70fbaf","#547be2"],["#726ef5","#726ef5"],["#726ef5","#726ef5"]],//组成颜色
titleDta:{
text:"任务状态",//中间显示内容
x: "45%",//text显示位置
},
legendData:{//图例
data: ["待接收", "已完成", "处理中"]
},
seriesData:{暂未做其他设置,后续可添加
center:["50%", "50%"]//数据显示位置
}
}
```
## RingsChart
```js
data: {
dataArray: [//数据
{
value: 1, //值
name: "一般", //名称
id: "001",
parentId: "0" //父级
},
{ value: 0, name: "通风", id: "001", parentId: "001" },
{ value: 0, name: "给排水", id: "002", parentId: "001" },
{ value: 0, name: "电气", id: "003", parentId: "001" },
{ value: 1, name: "消防", id: "004", parentId: "001" },
{ value: 0, name: "防护", id: "005", parentId: "001" },
{ value: 0, name: "土建", id: "006", parentId: "001" },
{ value: 2, name: "严重", id: "002", parentId: "0" },
{ value: 1, name: "通风", id: "001", parentId: "002" },
{ value: 0, name: "给排水", id: "002", parentId: "002" },
{ value: 0, name: "电气", id: "003", parentId: "002" },
{ value: 0, name: "消防", id: "004", parentId: "002" },
{ value: 0, name: "防护", id: "005", parentId: "002" },
{ value: 1, name: "土建", id: "006", parentId: "002" },
{ value: 0, name: "紧急", id: "003", parentId: "0" },
{ value: 0, name: "通风", id: "001", parentId: "003" },
{ value: 0, name: "给排水", id: "002", parentId: "003" },
{ value: 0, name: "电气", id: "003", parentId: "003" },
{ value: 0, name: "消防", id: "004", parentId: "003" },
{ value: 0, name: "防护", id: "005", parentId: "003" },
{ value: 0, name: "土建", id: "006", parentId: "003" },
]
}
```
## RingsChart2

```js
data: {
seriesData: [
{
name: "任务来源",//数据1代表含义
data: [//数据1
{
value: 6,
name: "维护任务"
},
{
value: 5,
name: "设备故障"
},
{
value: 6,
name: "备品备件"
},
{
value: 5,
name: "物资情况"
},
{
value: 6,
name: "环境报警"
},
{
value: 5,
name: "应急任务"
}
]
},
{
name: "报警来源",//数据2代表含义
data: [//数据2
{
value: 15,
name: "误报"
},
{
value: 12,
name: "处理"
},
{
value: 8,
name: "厂商协助"
}
]
}
]
}
```
## PieChart


```js
data: {
titleData:[
{//饼图标题(非必要)-可多条
text:"系统检测(报警)",
x:"20%",
y:"5%"
}
],
legendData: [],//图例非必要
seriesData: [
{//数据---可多条
name:"系统检测(报警)",
data:[
{
value: 456,
name: "消防"
},
{
value: 251,
name: "入侵"
},
{
value: 456,
name: "核生化"
},
{
value: 251,
name: "核电磁脉冲攻击"
},
{
value: 251,
name: "其他"
}
],
center:["25%", "50%"]/饼图放置位置
}
],
color: [ '#37a2da','#32c5e9','#9fe6b8','#ffdb5c','#ff9f7f','#fb7293','#e7bcf3','#8378ea']//组成颜色
}
```