多柱线图静态数据调整

qianming 3 years ago
parent 690258ccab
commit 418cd5f5fa

@ -48,7 +48,7 @@ export const widgetMoreBarLine = {
name: 'pointSize', name: 'pointSize',
required: false, required: false,
placeholder: '', placeholder: '',
value: 5, value: 3,
}, },
{ {
type: 'el-switch', type: 'el-switch',
@ -56,7 +56,7 @@ export const widgetMoreBarLine = {
name: 'smoothCurve', name: 'smoothCurve',
required: false, required: false,
placeholder: '', placeholder: '',
value: true, value: false,
}, },
{ {
type: 'el-switch', type: 'el-switch',
@ -103,14 +103,6 @@ export const widgetMoreBarLine = {
placeholder: '', placeholder: '',
value: 5, value: 5,
}, },
{
type: 'el-slider',
label: '最小高度',
name: 'minHeight',
require: false,
placeholder: '',
value: 0,
},
], ],
}, },
{ {
@ -265,10 +257,11 @@ export const widgetMoreBarLine = {
required: false, required: false,
placeholder: '', placeholder: '',
selectOptions: [ selectOptions: [
{code: 'center', name: '居中'},
{code: 'left', name: '左对齐'}, {code: 'left', name: '左对齐'},
{code: 'right', name: '右对齐'}, {code: 'right', name: '右对齐'},
], ],
value: 'left' value: 'center'
}, },
{ {
type: 'el-select', type: 'el-select',

@ -114,7 +114,7 @@ export default {
barBorderRadius: 6, barBorderRadius: 6,
}, },
}, },
data: [400, 400, 300, 300, 300, 400, 400, 400, 300] data: []
}, },
{ {
name: '调解失败', name: '调解失败',
@ -133,7 +133,7 @@ export default {
} }
}, },
data: [400, 500, 500, 500, 500, 400, 400, 500, 500] data: []
}, },
{ {
name: '调解终止', name: '调解终止',
@ -151,14 +151,13 @@ export default {
barBorderRadius: 6, barBorderRadius: 6,
} }
}, },
data: [400, 600, 700, 700, 1000, 400, 400, 600, 700] data: []
}, },
{ {
name: "调解成功率", name: "调解成功率",
type: "line", type: "line",
yAxisIndex: 1, //使 y index y yAxisIndex: 1, //使 y index y
smooth: false, //线 smooth: false, //线
symbol: "circle", // symbol: "circle", //
symbolSize: 8, // symbolSize: 8, //
itemStyle: { itemStyle: {
@ -172,7 +171,7 @@ export default {
lineStyle: { lineStyle: {
color: "#ffa43a" color: "#ffa43a"
}, },
data: [4.2, 3.8, 4.8, 3.5, 2.9, 2.8, 3, 5, 2] data: []
} }
] ]
} }
@ -221,9 +220,7 @@ export default {
this.setOptionsTooltip(); this.setOptionsTooltip();
this.setOptionsMargin(); this.setOptionsMargin();
this.setOptionsColor(); this.setOptionsColor();
/*
this.setOptionsData(); this.setOptionsData();
*/
}, },
// //
setOptionsTitle() { setOptionsTitle() {
@ -390,8 +387,7 @@ export default {
fontWeight: optionsSetup.fontWeightBar fontWeight: optionsSetup.fontWeightBar
}; };
series[key].barWidth = optionsSetup.maxWidth; series[key].barWidth = optionsSetup.maxWidth;
series[key].barMinHeight = optionsSetup.minHeight; series[key].itemStyle.normal['barBorderRadius'] = optionsSetup.radius;
series[key].itemStyle.barBorderRadius = optionsSetup.radius;
} }
} }
this.options.series = series; this.options.series = series;
@ -423,9 +419,13 @@ export default {
}, },
setOptionsLegend() { setOptionsLegend() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const series = this.options.series;
const legend = this.options.legend; const legend = this.options.legend;
let legendName = optionsSetup.legendName; let legendName = optionsSetup.legendName;
let arr = legendName.split(",") let arr = legendName.split(",")
for (const i in series) {
series[i].name = arr[i];
}
legend.data = arr; legend.data = arr;
legend.show = optionsSetup.isShowLegend; legend.show = optionsSetup.isShowLegend;
legend.left = optionsSetup.lateralPosition; legend.left = optionsSetup.lateralPosition;
@ -443,13 +443,19 @@ export default {
setOptionsColor() { setOptionsColor() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const customColor = optionsSetup.customColor; const customColor = optionsSetup.customColor;
const series = this.options.series;
if (!customColor) return; if (!customColor) return;
const arrColor = []; const arrColor = [];
for (let i = 0; i < customColor.length; i++) { for (let i = 0; i < customColor.length; i++) {
arrColor.push(customColor[i].color); arrColor.push(customColor[i].color);
} }
this.options.color = arrColor; for (const i in series) {
this.options = Object.assign({}, this.options); if (series[i].type == "bar") {
series[i].itemStyle.normal['color'] = arrColor[i];
}else {
series[i].lineStyle["color"] = arrColor[i];
}
}
}, },
// //
setOptionsData() { setOptionsData() {
@ -461,23 +467,24 @@ export default {
staticDataFn(val) { staticDataFn(val) {
const series = this.options.series; const series = this.options.series;
let axis = []; let axis = [];
let bar = []; let bar1 = [];
let bar2 = [];
let bar3 = [];
let line = []; let line = [];
for (const i in val) { for (const i in val) {
axis[i] = val[i].axis; axis[i] = val[i].date;
bar[i] = val[i].bar; bar1[i] = val[i].unsales;
line[i] = val[i].line; bar2[i] = val[i].manus;
bar3[i] = val[i].rework;
line[i] = val[i].sales;
} }
// x // x
this.options.xAxis.data = axis; this.options.xAxis.data = axis;
// series // series
for (const i in series) { series[0].data = bar1;
if (series[i].type == "bar") { series[1].data = bar2;
series[i].data = bar; series[2].data = bar3;
} else { series[3].data = line;
series[i].data = line;
}
}
}, },
dynamicDataFn(val, refreshTime) { dynamicDataFn(val, refreshTime) {
if (!val) return; if (!val) return;

Loading…
Cancel
Save