From dc056d66291ec1151e728488f7c51466938621e1 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 21 七月 2021 18:36:44 +0800 Subject: [PATCH] 2021-07-21 --- src/tabviews/custom/components/chart/antv-bar-line/index.jsx | 196 ++++++++++++++++++++++++++++++++++-------------- 1 files changed, 138 insertions(+), 58 deletions(-) diff --git a/src/tabviews/custom/components/chart/antv-bar-line/index.jsx b/src/tabviews/custom/components/chart/antv-bar-line/index.jsx index b39593c..f279ed3 100644 --- a/src/tabviews/custom/components/chart/antv-bar-line/index.jsx +++ b/src/tabviews/custom/components/chart/antv-bar-line/index.jsx @@ -94,11 +94,19 @@ }) } + let padding = 0 + if (_config.style.paddingTop && !isNaN(parseInt(_config.style.paddingTop))) { + padding += parseInt(_config.style.paddingTop) + } + if (_config.style.paddingBottom && !isNaN(parseInt(_config.style.paddingBottom))) { + padding += parseInt(_config.style.paddingBottom) + } + let height = config.plot.height || 400 if (config.plot.title || config.search.length > 0) { - _config.plot.height = height - 70 + _config.plot.height = height - 70 - padding } else { - _config.plot.height = height - 25 + _config.plot.height = height - 25 - padding } _config.style.height = height @@ -202,6 +210,39 @@ _config.plot.$colors = colors } + let xc = {label: { + formatter: (val) => { + if (!val || /^\s*$/.test(val)) return val + let _val = `${val}` + if (_val.length <= 11) return val + return _val.substring(0, 8) + '...' + }, + style: { fill: _config.plot.color } + }} + let yc = {label: { style: { fill: _config.plot.color } }} + if (_config.plot.grid === 'hidden') { + yc.grid = null + } + if (_config.plot.y_line === 'show') { + yc.line = {style: { stroke: '#D1D2CE' }} + } + if (_config.plot.lineColor) { + xc.tickLine = {style: { stroke: _config.plot.lineColor }} + xc.line = { style: { stroke: _config.plot.lineColor } } + if (yc.grid !== null) { + yc.grid = { line: { style: { stroke: _config.plot.lineColor } }} + } + if (yc.line) { + yc.line = { style: { stroke: _config.plot.lineColor } } + } + } + + _config.plot.$xc = xc + _config.plot.$yc = yc + + _config.plot.$paddingLeft = 30 + _config.plot.$paddingRight = 30 + if (_config.plot.enabled === 'true') { let colorIndex = 0 let limit = chartColors.length @@ -219,10 +260,38 @@ if (item.axis === 'true' && axisIndex < 2) { if (axisIndex === 0) { - item.axis = { title: { style: { fill: _config.plot.color } }, label: {style: { fill: _config.plot.color }} } + item.axis = { label: {style: { fill: _config.plot.color }} } + if (item.title !== 'false') { + item.axis.title = { style: { fill: _config.plot.color } } + _config.plot.$paddingLeft = 50 + } + if (_config.plot.grid === 'hidden') { + item.axis.grid = null + } + if (_config.plot.y_line === 'show') { + item.axis.line = {style: { stroke: '#D1D2CE' }} + } + if (_config.plot.lineColor) { + if (item.axis.grid !== null) { + item.axis.grid = { line: { style: { stroke: _config.plot.lineColor } }} + } + if (item.axis.line) { + item.axis.line = { style: { stroke: _config.plot.lineColor } } + } + } fields.unshift(item) } else { - item.axis = { grid: null, title: {style: { fill: _config.plot.color }}, label: {style: { fill: _config.plot.color }} } + item.axis = { grid: null, label: {style: { fill: _config.plot.color }} } + if (item.title !== 'false') { + item.axis.title = { style: { fill: _config.plot.color } } + _config.plot.$paddingRight = 60 + } + if (_config.plot.y_line === 'show') { + item.axis.line = {style: { stroke: '#D1D2CE' }} + } + if (_config.plot.lineColor && item.axis.line) { + item.axis.line = { style: { stroke: _config.plot.lineColor } } + } fields.splice(1, 0, item) } axisIndex++ @@ -851,24 +920,22 @@ range: [0, 1] }) } - chart.scale(_valfield, { + + let c = { nice: true, range: [0, 0.9] - }) - - // 鍧愭爣杞存牸寮忓寲 - chart.axis(plot.Xaxis, { - label: { - formatter: (val) => { - if (!val || /^\s*$/.test(val)) return val - let _val = `${val}` - if (_val.length <= 11) return val - return _val.substring(0, 8) + '...' - }, - style: { fill: plot.color } - }, - }) - chart.axis(_valfield, { label: { style: { fill: plot.color } } }) + } + + if (plot.min || plot.min === 0) { + c.min = plot.min + } + if (plot.max || plot.max === 0) { + c.max = plot.max + } + chart.scale(_valfield, c) + + chart.axis(plot.Xaxis, plot.$xc) + chart.axis(_valfield, plot.$yc) if (!plot.legend || plot.legend === 'hidden') { chart.legend(false) @@ -964,10 +1031,13 @@ if (plot.area === 'true') { let area = chart .area() - .shape(plot.shape || 'smooth') + // .shape(plot.shape || 'smooth') .position(`${plot.Xaxis}*${_valfield}`) .tooltip(false) + if (plot.shape === 'smooth') { + area.shape('smooth') + } if (plot.$colors) { let limit = chartColors.length area.color(_typefield, (key) => { @@ -1013,11 +1083,7 @@ let padding = [10, 30, 30, 30] if (!plot.Bar_axis) { - if (plot.axisIndex === 2) { - padding = [10, 50, 30, 50] - } else if (plot.axisIndex === 1) { - padding = [10, 30, 30, 50] - } + padding = [10, plot.$paddingRight, 30, plot.$paddingLeft] } const chart = new Chart({ @@ -1027,17 +1093,7 @@ }) // 鍧愭爣杞存牸寮忓寲 - chart.axis(plot.Xaxis, { - label: { - formatter: (val) => { - if (!val || /^\s*$/.test(val)) return val - let _val = `${val}` - if (_val.length <= 11) return val - return _val.substring(0, 8) + '...' - }, - style: { fill: plot.color } - }, - }) + chart.axis(plot.Xaxis, plot.$xc) if (!plot.hasBar) { chart.scale(plot.Xaxis, { @@ -1117,10 +1173,19 @@ view1.data(dvt.rows) - view1.scale('value', { + let c = { nice: true, range: [0, 0.9] - }) + } + + if (plot.min || plot.min === 0) { + c.min = plot.min + } + if (plot.max || plot.max === 0) { + c.max = plot.max + } + view1.scale('value', c) + view1.axis('value', plot.$yc) view1.legend(false) @@ -1250,10 +1315,19 @@ if (item.chartType === 'bar' && !plot.Bar_axis) { view2.axis(item.name, item.axis) - view2.scale(item.name, { + let c = { nice: true, range: [0, 0.9] - }) + } + + if (item.min || item.min === 0) { + c.min = item.min + } + if (item.max || item.max === 0) { + c.max = item.max + } + + view2.scale(item.name, c) let _chart = view2 .interval() .position(`${plot.Xaxis}*${item.name}`) @@ -1292,10 +1366,19 @@ } else { view2.axis(item.name, { grid: null, title: null, label: null }) } - view2.scale(item.name, { + let c = { nice: true, range: [0, 0.9] - }) + } + + if (item.min || item.min === 0) { + c.min = item.min + } + if (item.max || item.max === 0) { + c.max = item.max + } + + view2.scale(item.name, c) let _chart = view2 .line() .position(`${plot.Xaxis}*${item.name}`) @@ -1399,24 +1482,21 @@ chart.data(_data) - chart.scale(_valfield, { + let c = { nice: true, range: [0, 0.9] - }) + } - // 鍧愭爣杞存牸寮忓寲 - chart.axis(plot.Xaxis, { - label: { - formatter: (val) => { - if (!val || /^\s*$/.test(val)) return val - let _val = `${val}` - if (_val.length <= 11) return val - return _val.substring(0, 8) + '...' - }, - style: { fill: plot.color } - }, - }) - chart.axis(_valfield, { label: { style: { fill: plot.color } } }) + if (plot.min || plot.min === 0) { + c.min = plot.min + } + if (plot.max || plot.max === 0) { + c.max = plot.max + } + chart.scale(_valfield, c) + + chart.axis(plot.Xaxis, plot.$xc) + chart.axis(_valfield, plot.$yc) if (!plot.legend || plot.legend === 'hidden') { chart.legend(false) -- Gitblit v1.8.0