柱状对比图功能更新

qianming 3 years ago
parent e269ddca85
commit 9363626bcb

@ -7151,6 +7151,14 @@ const widgetTools = [
placeholder: '',
value: 14,
},
{
type: 'el-switch',
label: 'X轴线',
name: 'xLineLeft',
require: false,
placeholder: '',
value: false,
},
{
type: 'vue-color',
label: '轴颜色',
@ -7161,24 +7169,32 @@ const widgetTools = [
},
{
type: 'el-switch',
label: 'X轴线',
name: 'downSplitLineXLeft',
label: '竖分割线',
name: 'SplitLineLeft',
require: false,
placeholder: '',
value: false,
},
{
type: 'el-switch',
label: '分割线',
name: 'SplitLineXLeft',
require: false,
type: 'vue-color',
label: '分割线颜色',
name: 'SplitLineColorLeft',
required: false,
placeholder: '',
value: false,
value: '#fff',
},
{
type: 'el-input-number',
label: '分割线宽度',
name: 'SplitLinefontSizeLeft',
required: false,
placeholder: '',
value: 1,
},
{
type: 'el-switch',
label: '边框线',
name: 'upSplitLineXLeft',
name: 'frameLineLeft',
require: false,
placeholder: '',
value: false,
@ -7191,100 +7207,83 @@ const widgetTools = [
{
type: 'el-switch',
label: '显示',
name: 'hideX',
name: 'hideXRight',
required: false,
placeholder: '',
value: true,
},
{
type: 'el-input-text',
label: 'X轴别名',
name: 'xName',
type: 'el-input-number',
label: '数值间隔',
name: 'splitNumberRight',
required: false,
placeholder: '',
value: ''
},
{
type: 'vue-color',
label: '别名颜色',
name: 'xNameColor',
label: '数值颜色',
name: 'XcolorRight',
required: false,
placeholder: '',
value: '#fff'
value: '#fff',
},
{
type: 'el-input-number',
label: '别名字号',
name: 'xNameFontSize',
label: '数值字号',
name: 'fontSizeXRight',
required: false,
placeholder: '',
value: 14
value: 14,
},
{
type: 'el-switch',
label: '轴反转',
name: 'reversalX',
required: false,
label: 'X轴线',
name: 'xLineRight',
require: false,
placeholder: '',
value: false
value: false,
},
{
type: 'el-slider',
label: '文字角度',
name: 'textAngleX',
type: 'vue-color',
label: '轴颜色',
name: 'lineColorXRight',
required: false,
placeholder: '',
value: 0
value: '#fff',
},
{
type: 'el-input-number',
label: '文字间隔',
name: 'textInterval',
required: false,
type: 'el-switch',
label: '竖分割线',
name: 'SplitLineRight',
require: false,
placeholder: '',
value: ''
value: false,
},
{
type: 'vue-color',
label: '文字颜色',
name: 'Xcolor',
label: '分割线颜色',
name: 'SplitLineColorRight',
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-input-number',
label: '文字字号',
name: 'fontSizeX',
label: '分割线宽度',
name: 'SplitLinefontSizeRight',
required: false,
placeholder: '',
value: 14,
},
{
type: 'vue-color',
label: '轴颜色',
name: 'lineColorX',
required: false,
placeholder: '',
value: '#fff',
value: 1,
},
{
type: 'el-switch',
label: '分割线显示',
name: 'isShowSplitLineX',
label: '边框线',
name: 'frameLineRight',
require: false,
placeholder: '',
value: false,
},
{
type: 'vue-color',
label: '分割线颜色',
name: 'splitLineColorX',
required: false,
placeholder: '',
value: '#fff',
}
],
},
{

@ -276,6 +276,7 @@ export default {
editorOptions() {
this.setOptionsTitle();
this.setOptionsXLeft();
this.setOptionsXRight();
this.setOptionsTop();
this.setOptionsTooltip();
this.setOptionsGrid();
@ -305,7 +306,10 @@ export default {
type: 'value',
inverse: true,
axisLine: {//X线
show: false,
show: optionsSetup.xLineLeft,
lineStyle: {
color: optionsSetup.lineColorXLeft,
},
},
axisTick: {
show: false,
@ -314,21 +318,56 @@ export default {
axisLabel: { // x
show: optionsSetup.hideXLeft,
textStyle: {
color : optionsSetup.lineColorXLeft,
color : optionsSetup.XcolorLeft,
fontSize: optionsSetup.fontSizeXLeft
}
},
splitLine: { // 线
show: false,
show: optionsSetup.SplitLineLeft,
lineStyle: {
color: '#57617f',
width: 1,
color: optionsSetup.SplitLineColorLeft,
width: optionsSetup.SplitLinefontSizeLeft,
type: 'solid'
}
}
}
this.options.xAxis[0] = xAxisLeft;
},
// X
setOptionsXRight() {
const optionsSetup = this.optionsSetup;
const xAxisRight = {
gridIndex: 2,
splitNumber: optionsSetup.splitNumberRight,
type: 'value',
axisLine: {//X线
show: optionsSetup.xLineRight,
lineStyle: {
color: optionsSetup.lineColorXRight,
},
},
axisTick: {
show: false,
},
position: 'bottom',
axisLabel: { // x
show: optionsSetup.hideXRight,
textStyle: {
color : optionsSetup.XcolorRight,
fontSize: optionsSetup.fontSizeXRight
}
},
splitLine: { // 线
show: optionsSetup.SplitLineRight,
lineStyle: {
color: optionsSetup.SplitLineColorRight,
width: optionsSetup.SplitLinefontSizeRight,
type: 'solid'
}
}
}
this.options.xAxis[2] = xAxisRight;
},
//
setOptionsTop() {
const optionsSetup = this.optionsSetup;
@ -388,7 +427,7 @@ export default {
const optionsSetup = this.optionsSetup;
const grid = [
{//
show: false,
show: optionsSetup.frameLineLeft,
left: optionsSetup.marginLeftRight,
top: optionsSetup.marginTop,
bottom: optionsSetup.marginBottom,
@ -403,7 +442,7 @@ export default {
width: '0%'
},
{//
show: false,
show: optionsSetup.frameLineRight,
right: optionsSetup.marginLeftRight,
top: optionsSetup.marginTop,
bottom: optionsSetup.marginBottom,

Loading…
Cancel
Save