|
@@ -20,94 +20,114 @@
|
|
|
const color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
|
|
|
|
|
|
//事件转换函数,主要用作格式化x轴为时间轴,根据需求自行修改
|
|
|
-const formatDateTime = (timeStamp, returnType)=>{
|
|
|
- var date = new Date();
|
|
|
- date.setTime(timeStamp * 1000);
|
|
|
- var y = date.getFullYear();
|
|
|
- var m = date.getMonth() + 1;
|
|
|
- m = m < 10 ? ('0' + m) : m;
|
|
|
- var d = date.getDate();
|
|
|
- d = d < 10 ? ('0' + d) : d;
|
|
|
- var h = date.getHours();
|
|
|
- h = h < 10 ? ('0' + h) : h;
|
|
|
- var minute = date.getMinutes();
|
|
|
- var second = date.getSeconds();
|
|
|
- minute = minute < 10 ? ('0' + minute) : minute;
|
|
|
- second = second < 10 ? ('0' + second) : second;
|
|
|
- if(returnType == 'full'){return y + '-' + m + '-' + d + ' '+ h +':' + minute + ':' + second;}
|
|
|
- if(returnType == 'y-m-d'){return y + '-' + m + '-' + d;}
|
|
|
- if(returnType == 'h:m'){return h +':' + minute;}
|
|
|
- if(returnType == 'h:m:s'){return h +':' + minute +':' + second;}
|
|
|
- return [y, m, d, h, minute, second];
|
|
|
+const formatDateTime = (timeStamp, returnType) => {
|
|
|
+ var date = new Date();
|
|
|
+ date.setTime(timeStamp * 1000);
|
|
|
+ var y = date.getFullYear();
|
|
|
+ var m = date.getMonth() + 1;
|
|
|
+ m = m < 10 ? ('0' + m) : m;
|
|
|
+ var d = date.getDate();
|
|
|
+ d = d < 10 ? ('0' + d) : d;
|
|
|
+ var h = date.getHours();
|
|
|
+ h = h < 10 ? ('0' + h) : h;
|
|
|
+ var minute = date.getMinutes();
|
|
|
+ var second = date.getSeconds();
|
|
|
+ minute = minute < 10 ? ('0' + minute) : minute;
|
|
|
+ second = second < 10 ? ('0' + second) : second;
|
|
|
+ if (returnType == 'full') {
|
|
|
+ return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
|
|
|
+ }
|
|
|
+ if (returnType == 'y-m-d') {
|
|
|
+ return y + '-' + m + '-' + d;
|
|
|
+ }
|
|
|
+ if (returnType == 'h:m') {
|
|
|
+ return h + ':' + minute;
|
|
|
+ }
|
|
|
+ if (returnType == 'h:m:s') {
|
|
|
+ return h + ':' + minute + ':' + second;
|
|
|
+ }
|
|
|
+ return [y, m, d, h, minute, second];
|
|
|
}
|
|
|
|
|
|
const cfu = {
|
|
|
- //demotype为自定义图表类型,一般不需要自定义图表类型,只需要改根节点上对应的类型即可
|
|
|
- "type":["pie","ring","rose","word","funnel","map","arcbar","line","column","bar","area","radar","gauge","candle","mix","tline","tarea","scatter","bubble","demotype"],
|
|
|
- "range":["饼状图","圆环图","玫瑰图","词云图","漏斗图","地图","圆弧进度条","折线图","柱状图","条状图","区域图","雷达图","仪表盘","K线图","混合图","时间轴折线","时间轴区域","散点图","气泡图","自定义类型"],
|
|
|
- //增加自定义图表类型,如果需要categories,请在这里加入您的图表类型,例如最后的"demotype"
|
|
|
- //自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴(矢量x轴)类图表,没有categories,不需要加入categories
|
|
|
- "categories":["line","column","bar","area","radar","gauge","candle","mix","demotype"],
|
|
|
- //instance为实例变量承载属性,不要删除
|
|
|
- "instance":{},
|
|
|
- //option为opts及eopts承载属性,不要删除
|
|
|
- "option":{},
|
|
|
- //下面是自定义format配置,因除H5端外的其他端无法通过props传递函数,只能通过此属性对应下标的方式来替换
|
|
|
- "formatter":{
|
|
|
- "yAxisDemo1":function(val){return val+'元'},
|
|
|
- "yAxisDemo2":function(val){return val.toFixed(2)},
|
|
|
- "xAxisDemo1":function(val){return val+'年'},
|
|
|
- "xAxisDemo2":function(val){return formatDateTime(val,'h:m')},
|
|
|
- "seriesDemo1":function(val){return val+'元'},
|
|
|
- "tooltipDemo1":function(item, category, index, opts){
|
|
|
- if(index==0){
|
|
|
- return '随便用'+item.data+'年'
|
|
|
- }else{
|
|
|
- return '其他我没改'+item.data+'天'
|
|
|
- }
|
|
|
- },
|
|
|
- "pieDemo":function(val, index, series){
|
|
|
- if(index !== undefined){
|
|
|
- return series[index].name+':'+series[index].data+'元'
|
|
|
- }
|
|
|
- },
|
|
|
- // column_1
|
|
|
- "column_1": function(item, category, index, opts) {
|
|
|
- return item.name
|
|
|
+ //demotype为自定义图表类型,一般不需要自定义图表类型,只需要改根节点上对应的类型即可
|
|
|
+ "type": ["pie", "ring", "rose", "word", "funnel", "map", "arcbar", "line", "column", "mount", "bar", "area",
|
|
|
+ "radar", "gauge", "candle", "mix", "tline", "tarea", "scatter", "bubble", "demotype"
|
|
|
+ ],
|
|
|
+ "range": ["饼状图", "圆环图", "玫瑰图", "词云图", "漏斗图", "地图", "圆弧进度条", "折线图", "柱状图", "山峰图", "条状图", "区域图", "雷达图", "仪表盘",
|
|
|
+ "K线图", "混合图", "时间轴折线", "时间轴区域", "散点图", "气泡图", "自定义类型"
|
|
|
+ ],
|
|
|
+ //增加自定义图表类型,如果需要categories,请在这里加入您的图表类型,例如最后的"demotype"
|
|
|
+ //自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴(矢量x轴)类图表,没有categories,不需要加入categories
|
|
|
+ "categories": ["line", "column", "mount", "bar", "area", "radar", "gauge", "candle", "mix", "demotype"],
|
|
|
+ //instance为实例变量承载属性,不要删除
|
|
|
+ "instance": {},
|
|
|
+ //option为opts及eopts承载属性,不要删除
|
|
|
+ "option": {},
|
|
|
+ //下面是自定义format配置,因除H5端外的其他端无法通过props传递函数,只能通过此属性对应下标的方式来替换
|
|
|
+ "formatter": {
|
|
|
+ "yAxisDemo1": function(val, index, opts) {
|
|
|
+ return val + '元'
|
|
|
+ },
|
|
|
+ "yAxisDemo2": function(val, index, opts) {
|
|
|
+ return val.toFixed(2)
|
|
|
+ },
|
|
|
+ "xAxisDemo1": function(val, index, opts) {
|
|
|
+ return val + '年';
|
|
|
+ },
|
|
|
+ "xAxisDemo2": function(val, index, opts) {
|
|
|
+ return formatDateTime(val, 'h:m')
|
|
|
+ },
|
|
|
+ "seriesDemo1": function(val, index, series, opts) {
|
|
|
+ return val + '元'
|
|
|
+ },
|
|
|
+ "tooltipDemo1": function(item, category, index, opts) {
|
|
|
+ if (index == 0) {
|
|
|
+ return '随便用' + item.data + '年'
|
|
|
+ } else {
|
|
|
+ return '其他我没改' + item.data + '天'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "pieDemo": function(val, index, series, opts) {
|
|
|
+ if (index !== undefined) {
|
|
|
+ return series[index].name + ':' + series[index].data + '元'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // column_1
|
|
|
+ "column_1": function(item, category, index, opts) {
|
|
|
+ return item.name
|
|
|
+ },
|
|
|
+ // 显示 百分比
|
|
|
+ "column_bfb": function(item, category, index, opts) {
|
|
|
+ return item.name + ':' + item.data + '%'
|
|
|
+ },
|
|
|
},
|
|
|
- // 显示 百分比
|
|
|
- "column_bfb": function(item, category, index, opts) {
|
|
|
- return item.name + ':' + item.data + '%'
|
|
|
+ //这里演示了自定义您的图表类型的option,可以随意命名,之后在组件上 type="demotype" 后,组件会调用这个花括号里的option,如果组件上还存在opts参数,会将demotype与opts中option合并后渲染图表。
|
|
|
+ "demotype": {
|
|
|
+ //我这里把曲线图当做了自定义图表类型,您可以根据需要随意指定类型或配置
|
|
|
+ "type": "line",
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 10, 0, 15],
|
|
|
+ "xAxis": {
|
|
|
+ "disableGrid": true,
|
|
|
+ },
|
|
|
+ "yAxis": {
|
|
|
+ "gridType": "dash",
|
|
|
+ "dashLength": 2,
|
|
|
+ },
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "line": {
|
|
|
+ "type": "curve",
|
|
|
+ "width": 2
|
|
|
+ },
|
|
|
+ }
|
|
|
},
|
|
|
-
|
|
|
- },
|
|
|
- //这里演示了自定义您的图表类型的option,可以随意命名,之后在组件上 type="demotype" 后,组件会调用这个花括号里的option,如果组件上还存在opts参数,会将demotype与opts中option合并后渲染图表。
|
|
|
- "demotype":{
|
|
|
- //我这里把曲线图当做了自定义图表类型,您可以根据需要随意指定类型或配置
|
|
|
- "type": "line",
|
|
|
- "color": color,
|
|
|
- "padding": [15,10,0,15],
|
|
|
- "xAxis": {
|
|
|
- "disableGrid": true,
|
|
|
- },
|
|
|
- "yAxis": {
|
|
|
- "gridType": "dash",
|
|
|
- "dashLength": 2,
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
- "extra": {
|
|
|
- "line": {
|
|
|
- "type": "curve",
|
|
|
- "width": 2
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- //下面是自定义配置,请添加项目所需的通用配置
|
|
|
- "pie":{
|
|
|
+ //下面是自定义配置,请添加项目所需的通用配置
|
|
|
+ "pie": {
|
|
|
"type": "pie",
|
|
|
- "color": color,
|
|
|
- "padding": [5,5,5,5],
|
|
|
+ "color": color,
|
|
|
+ "padding": [5, 5, 5, 5],
|
|
|
"extra": {
|
|
|
"pie": {
|
|
|
"activeOpacity": 0.5,
|
|
@@ -120,16 +140,16 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "ring":{
|
|
|
+ "ring": {
|
|
|
"type": "ring",
|
|
|
- "color": color,
|
|
|
- "padding": [5,5,5,5],
|
|
|
+ "color": color,
|
|
|
+ "padding": [5, 5, 5, 5],
|
|
|
"rotate": false,
|
|
|
"dataLabel": true,
|
|
|
"legend": {
|
|
|
"show": true,
|
|
|
"position": "right",
|
|
|
- "lineHeight": 25,
|
|
|
+ "lineHeight": 25,
|
|
|
},
|
|
|
"title": {
|
|
|
"name": "收益率",
|
|
@@ -143,7 +163,7 @@ const cfu = {
|
|
|
},
|
|
|
"extra": {
|
|
|
"ring": {
|
|
|
- "ringWidth":30,
|
|
|
+ "ringWidth": 30,
|
|
|
"activeOpacity": 0.5,
|
|
|
"activeRadius": 10,
|
|
|
"offsetAngle": 0,
|
|
@@ -154,14 +174,14 @@ const cfu = {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
- "rose":{
|
|
|
+ "rose": {
|
|
|
"type": "rose",
|
|
|
- "color": color,
|
|
|
- "padding": [5,5,5,5],
|
|
|
+ "color": color,
|
|
|
+ "padding": [5, 5, 5, 5],
|
|
|
"legend": {
|
|
|
"show": true,
|
|
|
"position": "left",
|
|
|
- "lineHeight": 25,
|
|
|
+ "lineHeight": 25,
|
|
|
},
|
|
|
"extra": {
|
|
|
"rose": {
|
|
@@ -177,9 +197,9 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "word":{
|
|
|
+ "word": {
|
|
|
"type": "word",
|
|
|
- "color": color,
|
|
|
+ "color": color,
|
|
|
"extra": {
|
|
|
"word": {
|
|
|
"type": "normal",
|
|
@@ -187,10 +207,10 @@ const cfu = {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- "funnel":{
|
|
|
+ "funnel": {
|
|
|
"type": "funnel",
|
|
|
- "color": color,
|
|
|
- "padding": [15,15,0,15],
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 15, 0, 15],
|
|
|
"extra": {
|
|
|
"funnel": {
|
|
|
"activeOpacity": 0.3,
|
|
@@ -203,11 +223,11 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "map":{
|
|
|
+ "map": {
|
|
|
"type": "map",
|
|
|
- "color": color,
|
|
|
- "padding": [0,0,0,0],
|
|
|
- "dataLabel": true,
|
|
|
+ "color": color,
|
|
|
+ "padding": [0, 0, 0, 0],
|
|
|
+ "dataLabel": true,
|
|
|
"extra": {
|
|
|
"map": {
|
|
|
"border": true,
|
|
@@ -220,9 +240,9 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "arcbar":{
|
|
|
+ "arcbar": {
|
|
|
"type": "arcbar",
|
|
|
- "color": color,
|
|
|
+ "color": color,
|
|
|
"title": {
|
|
|
"name": "百分比",
|
|
|
"fontSize": 25,
|
|
@@ -244,19 +264,18 @@ const cfu = {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- "line":{
|
|
|
+ "line": {
|
|
|
"type": "line",
|
|
|
- "color": color,
|
|
|
- "padding": [15,10,0,15],
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 10, 0, 15],
|
|
|
"xAxis": {
|
|
|
- "disableGrid": true,
|
|
|
+ "disableGrid": true,
|
|
|
},
|
|
|
"yAxis": {
|
|
|
- "gridType": "dash",
|
|
|
- "dashLength": 2,
|
|
|
- },
|
|
|
- "legend": {
|
|
|
+ "gridType": "dash",
|
|
|
+ "dashLength": 2,
|
|
|
},
|
|
|
+ "legend": {},
|
|
|
"extra": {
|
|
|
"line": {
|
|
|
"type": "straight",
|
|
@@ -264,79 +283,115 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "tline":{
|
|
|
- "type": "line",
|
|
|
- "color": color,
|
|
|
- "padding": [15,10,0,15],
|
|
|
- "xAxis": {
|
|
|
- "disableGrid": false,
|
|
|
- "boundaryGap":"justify",
|
|
|
- },
|
|
|
- "yAxis": {
|
|
|
- "gridType": "dash",
|
|
|
- "dashLength": 2,
|
|
|
- "data":[
|
|
|
- {
|
|
|
- "min":0,
|
|
|
- "max":80
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
- "extra": {
|
|
|
- "line": {
|
|
|
- "type": "curve",
|
|
|
- "width": 2
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- "tarea":{
|
|
|
- "type": "area",
|
|
|
- "color": color,
|
|
|
- "padding": [15,10,0,15],
|
|
|
- "xAxis": {
|
|
|
- "disableGrid": true,
|
|
|
- "boundaryGap":"justify",
|
|
|
- },
|
|
|
- "yAxis": {
|
|
|
- "gridType": "dash",
|
|
|
- "dashLength": 2,
|
|
|
- "data":[
|
|
|
- {
|
|
|
- "min":0,
|
|
|
- "max":80
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
- "extra": {
|
|
|
- "area": {
|
|
|
- "type": "curve",
|
|
|
- "opacity": 0.2,
|
|
|
- "addLine": true,
|
|
|
- "width": 2,
|
|
|
- "gradient": true
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- "column":{
|
|
|
- "type": "column",
|
|
|
- "color": color,
|
|
|
- "padding": [15,15,0,5],
|
|
|
+ "tline": {
|
|
|
+ "type": "line",
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 10, 0, 15],
|
|
|
"xAxis": {
|
|
|
- "disableGrid": true,
|
|
|
+ "disableGrid": false,
|
|
|
+ "boundaryGap": "justify",
|
|
|
},
|
|
|
"yAxis": {
|
|
|
- "data":[{"min":0}]
|
|
|
+ "gridType": "dash",
|
|
|
+ "dashLength": 2,
|
|
|
+ "data": [{
|
|
|
+ "min": 0,
|
|
|
+ "max": 80
|
|
|
+ }]
|
|
|
},
|
|
|
- "legend": {
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "line": {
|
|
|
+ "type": "curve",
|
|
|
+ "width": 2
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "tarea": {
|
|
|
+ "type": "area",
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 10, 0, 15],
|
|
|
+ "xAxis": {
|
|
|
+ "disableGrid": true,
|
|
|
+ "boundaryGap": "justify",
|
|
|
+ },
|
|
|
+ "yAxis": {
|
|
|
+ "gridType": "dash",
|
|
|
+ "dashLength": 2,
|
|
|
+ "data": [{
|
|
|
+ "min": 0,
|
|
|
+ "max": 80
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "area": {
|
|
|
+ "type": "curve",
|
|
|
+ "opacity": 0.2,
|
|
|
+ "addLine": true,
|
|
|
+ "width": 2,
|
|
|
+ "gradient": true
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "column": {
|
|
|
+ "type": "column",
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 15, 0, 5],
|
|
|
+ "xAxis": {
|
|
|
+ "disableGrid": true,
|
|
|
},
|
|
|
+ "yAxis": {
|
|
|
+ "data": [{
|
|
|
+ "min": 0
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ "legend": {},
|
|
|
"extra": {
|
|
|
"column": {
|
|
|
"type": "group",
|
|
|
"width": 30,
|
|
|
+ "activeBgColor": "#000000",
|
|
|
+ "activeBgOpacity": 0.08
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "mount": {
|
|
|
+ "type": "mount",
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 15, 0, 5],
|
|
|
+ "xAxis": {
|
|
|
+ "disableGrid": true,
|
|
|
+ },
|
|
|
+ "yAxis": {
|
|
|
+ "data": [{
|
|
|
+ "min": 0
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "mount": {
|
|
|
+ "type": "mount",
|
|
|
+ "widthRatio": 1.5,
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "bar": {
|
|
|
+ "type": "bar",
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 30, 0, 5],
|
|
|
+ "xAxis": {
|
|
|
+ "boundaryGap": "justify",
|
|
|
+ "disableGrid": false,
|
|
|
+ "min": 0,
|
|
|
+ "axisLine": false
|
|
|
+ },
|
|
|
+ "yAxis": {},
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "bar": {
|
|
|
+ "type": "group",
|
|
|
+ "width": 30,
|
|
|
"meterBorde": 1,
|
|
|
"meterFillColor": "#FFFFFF",
|
|
|
"activeBgColor": "#000000",
|
|
@@ -344,44 +399,18 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "bar":{
|
|
|
- "type": "bar",
|
|
|
- "color": color,
|
|
|
- "padding": [15,30,0,5],
|
|
|
- "xAxis": {
|
|
|
- "boundaryGap":"justify",
|
|
|
- "disableGrid":false,
|
|
|
- "min":0,
|
|
|
- "axisLine":false
|
|
|
- },
|
|
|
- "yAxis": {
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
- "extra": {
|
|
|
- "bar": {
|
|
|
- "type": "group",
|
|
|
- "width": 30,
|
|
|
- "meterBorde": 1,
|
|
|
- "meterFillColor": "#FFFFFF",
|
|
|
- "activeBgColor": "#000000",
|
|
|
- "activeBgOpacity": 0.08
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- "area":{
|
|
|
+ "area": {
|
|
|
"type": "area",
|
|
|
"color": color,
|
|
|
- "padding": [15,15,0,15],
|
|
|
+ "padding": [15, 15, 0, 15],
|
|
|
"xAxis": {
|
|
|
- "disableGrid": true,
|
|
|
+ "disableGrid": true,
|
|
|
},
|
|
|
"yAxis": {
|
|
|
- "gridType": "dash",
|
|
|
- "dashLength": 2,
|
|
|
- },
|
|
|
- "legend": {
|
|
|
+ "gridType": "dash",
|
|
|
+ "dashLength": 2,
|
|
|
},
|
|
|
+ "legend": {},
|
|
|
"extra": {
|
|
|
"area": {
|
|
|
"type": "straight",
|
|
@@ -392,15 +421,15 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "radar":{
|
|
|
+ "radar": {
|
|
|
"type": "radar",
|
|
|
"color": color,
|
|
|
- "padding": [5,5,5,5],
|
|
|
- "dataLabel": false,
|
|
|
+ "padding": [5, 5, 5, 5],
|
|
|
+ "dataLabel": false,
|
|
|
"legend": {
|
|
|
"show": true,
|
|
|
"position": "right",
|
|
|
- "lineHeight": 25,
|
|
|
+ "lineHeight": 25,
|
|
|
},
|
|
|
"extra": {
|
|
|
"radar": {
|
|
@@ -412,7 +441,7 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "gauge":{
|
|
|
+ "gauge": {
|
|
|
"type": "gauge",
|
|
|
"color": color,
|
|
|
"title": {
|
|
@@ -452,10 +481,10 @@ const cfu = {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- "candle":{
|
|
|
+ "candle": {
|
|
|
"type": "candle",
|
|
|
"color": color,
|
|
|
- "padding": [15,15,0,15],
|
|
|
+ "padding": [15, 15, 0, 15],
|
|
|
"enableScroll": true,
|
|
|
"enableMarkLine": true,
|
|
|
"dataLabel": false,
|
|
@@ -471,10 +500,8 @@ const cfu = {
|
|
|
"scrollColor": "#A6A6A6",
|
|
|
"scrollBackgroundColor": "#EFEBEF"
|
|
|
},
|
|
|
- "yAxis": {
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
+ "yAxis": {},
|
|
|
+ "legend": {},
|
|
|
"extra": {
|
|
|
"candle": {
|
|
|
"color": {
|
|
@@ -485,16 +512,15 @@ const cfu = {
|
|
|
},
|
|
|
"average": {
|
|
|
"show": true,
|
|
|
- "name": ["MA5","MA10","MA30"],
|
|
|
- "day": [5,10,20],
|
|
|
- "color": ["#1890ff","#2fc25b","#facc14"]
|
|
|
+ "name": ["MA5", "MA10", "MA30"],
|
|
|
+ "day": [5, 10, 20],
|
|
|
+ "color": ["#1890ff", "#2fc25b", "#facc14"]
|
|
|
}
|
|
|
},
|
|
|
"markLine": {
|
|
|
"type": "dash",
|
|
|
"dashLength": 5,
|
|
|
- "data": [
|
|
|
- {
|
|
|
+ "data": [{
|
|
|
"value": 2150,
|
|
|
"lineColor": "#f04864",
|
|
|
"showLabel": true
|
|
@@ -508,12 +534,12 @@ const cfu = {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- "mix":{
|
|
|
+ "mix": {
|
|
|
"type": "mix",
|
|
|
"color": color,
|
|
|
- "padding": [15,15,0,15],
|
|
|
+ "padding": [15, 15, 0, 15],
|
|
|
"xAxis": {
|
|
|
- "disableGrid": true,
|
|
|
+ "disableGrid": true,
|
|
|
},
|
|
|
"yAxis": {
|
|
|
"disabled": false,
|
|
@@ -526,8 +552,7 @@ const cfu = {
|
|
|
"showTitle": true,
|
|
|
"data": []
|
|
|
},
|
|
|
- "legend": {
|
|
|
- },
|
|
|
+ "legend": {},
|
|
|
"extra": {
|
|
|
"mix": {
|
|
|
"column": {
|
|
@@ -536,58 +561,55 @@ const cfu = {
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- "scatter":{
|
|
|
+ "scatter": {
|
|
|
"type": "scatter",
|
|
|
- "color":color,
|
|
|
- "padding":[15,15,0,15],
|
|
|
- "dataLabel":false,
|
|
|
- "xAxis": {
|
|
|
- "disableGrid": false,
|
|
|
- "gridType":"dash",
|
|
|
- "splitNumber":5,
|
|
|
- "boundaryGap":"justify",
|
|
|
- "min":0
|
|
|
- },
|
|
|
- "yAxis": {
|
|
|
- "disableGrid": false,
|
|
|
- "gridType":"dash",
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
- "extra": {
|
|
|
- "scatter": {
|
|
|
- },
|
|
|
- }
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 15, 0, 15],
|
|
|
+ "dataLabel": false,
|
|
|
+ "xAxis": {
|
|
|
+ "disableGrid": false,
|
|
|
+ "gridType": "dash",
|
|
|
+ "splitNumber": 5,
|
|
|
+ "boundaryGap": "justify",
|
|
|
+ "min": 0
|
|
|
+ },
|
|
|
+ "yAxis": {
|
|
|
+ "disableGrid": false,
|
|
|
+ "gridType": "dash",
|
|
|
+ },
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "scatter": {},
|
|
|
+ }
|
|
|
},
|
|
|
- "bubble":{
|
|
|
+ "bubble": {
|
|
|
"type": "bubble",
|
|
|
- "color":color,
|
|
|
- "padding":[15,15,0,15],
|
|
|
- "xAxis": {
|
|
|
- "disableGrid": false,
|
|
|
- "gridType":"dash",
|
|
|
- "splitNumber":5,
|
|
|
- "boundaryGap":"justify",
|
|
|
- "min":0,
|
|
|
- "max":250
|
|
|
- },
|
|
|
- "yAxis": {
|
|
|
- "disableGrid": false,
|
|
|
- "gridType":"dash",
|
|
|
- "data":[{
|
|
|
- "min":0,
|
|
|
- "max":150
|
|
|
- }]
|
|
|
- },
|
|
|
- "legend": {
|
|
|
- },
|
|
|
- "extra": {
|
|
|
- "bubble": {
|
|
|
- "border":2,
|
|
|
- "opacity": 0.5,
|
|
|
- },
|
|
|
- }
|
|
|
+ "color": color,
|
|
|
+ "padding": [15, 15, 0, 15],
|
|
|
+ "xAxis": {
|
|
|
+ "disableGrid": false,
|
|
|
+ "gridType": "dash",
|
|
|
+ "splitNumber": 5,
|
|
|
+ "boundaryGap": "justify",
|
|
|
+ "min": 0,
|
|
|
+ "max": 250
|
|
|
+ },
|
|
|
+ "yAxis": {
|
|
|
+ "disableGrid": false,
|
|
|
+ "gridType": "dash",
|
|
|
+ "data": [{
|
|
|
+ "min": 0,
|
|
|
+ "max": 150
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ "legend": {},
|
|
|
+ "extra": {
|
|
|
+ "bubble": {
|
|
|
+ "border": 2,
|
|
|
+ "opacity": 0.5,
|
|
|
+ },
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-export default cfu;
|
|
|
+export default cfu;
|