forked from opentiny/tiny-vue
fix(chart): fix chart extend bugs (#1638)
* fix: 修复chart图表的extend未生效问题 * fix: 优化图表extend逻辑 * fix: 优化图表extend逻辑
This commit is contained in:
parent
4461225179
commit
6618d3bab8
|
@ -23,8 +23,8 @@ function removeNullKeys(obj) {
|
|||
}
|
||||
|
||||
export default ({ option, extend }) => {
|
||||
const obj = cloneDeep(option)
|
||||
const options = removeNullKeys(obj)
|
||||
const cloneOption = cloneDeep(option)
|
||||
const mergeOption = removeNullKeys(cloneOption)
|
||||
if (!extend) {
|
||||
return
|
||||
}
|
||||
|
@ -34,11 +34,11 @@ export default ({ option, extend }) => {
|
|||
|
||||
if (~key.indexOf('.')) {
|
||||
// (其他类型)属性名中带. 为true
|
||||
set(options, key, value)
|
||||
set(mergeOption, key, value)
|
||||
} else if (typeof value === 'function') {
|
||||
// 当属性为函数时,设置的是函数的返回值
|
||||
options[key] = value(options[key])
|
||||
} else if (isArr(options[key]) && isArr(value)) {
|
||||
mergeOption[key] = value(mergeOption[key])
|
||||
} else if (isArr(mergeOption[key]) && isArr(value)) {
|
||||
// 当被修改值和替换值都为数组时,key符合attrList就合并
|
||||
const attrList = [
|
||||
'series',
|
||||
|
@ -56,28 +56,28 @@ export default ({ option, extend }) => {
|
|||
]
|
||||
if (~attrList.indexOf(key)) {
|
||||
// attrList,指定的key才能合并处理
|
||||
options[key] = merge(options[key], value)
|
||||
mergeOption[key] = merge(mergeOption[key], value)
|
||||
}
|
||||
} else {
|
||||
// 属性为对象(eg: tooltip)或包含对象的数组(eg: series)
|
||||
if (isArr(options[key]) && isObject(options[key][0])) {
|
||||
if (isArr(mergeOption[key]) && isObject(mergeOption[key][0])) {
|
||||
// 属性值是包含对象数组
|
||||
options[key].forEach((option, i) => (options[key][i] = { ...option, ...value }))
|
||||
} else if (isObject(options[key])) {
|
||||
mergeOption[key].forEach((option, i) => (mergeOption[key][i] = { ...option, ...value }))
|
||||
} else if (isObject(mergeOption[key])) {
|
||||
// 被替换属性值是对象
|
||||
let optionBase = options[key]
|
||||
let optionBase = mergeOption[key]
|
||||
|
||||
options[key] = { ...optionBase, ...value } // 两者合并,后者覆盖前者
|
||||
mergeOption[key] = { ...optionBase, ...value } // 两者合并,后者覆盖前者
|
||||
} else {
|
||||
// 直接覆盖替换
|
||||
options[key] = value
|
||||
mergeOption[key] = value
|
||||
}
|
||||
}
|
||||
})
|
||||
const { series } = option
|
||||
const { series } = mergeOption
|
||||
if (series) {
|
||||
if (Array.isArray(series)) {
|
||||
options.series = series.map((item) => {
|
||||
mergeOption.series = series.map((item) => {
|
||||
if (get(item, 'type') === 'line' && get(item, 'label.show')) {
|
||||
item.showSymbol = true
|
||||
}
|
||||
|
@ -85,8 +85,8 @@ export default ({ option, extend }) => {
|
|||
return item
|
||||
})
|
||||
} else {
|
||||
options.series.label = { show: false, ...option.series.label }
|
||||
mergeOption.series.label = { show: false, ...mergeOption.series.label }
|
||||
}
|
||||
}
|
||||
return options
|
||||
return mergeOption
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@opentiny/vue-chart-core",
|
||||
"version": "3.16.0",
|
||||
"version": "3.16.1",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "index.ts",
|
||||
|
|
|
@ -353,8 +353,7 @@ export default {
|
|||
this.setAnimation(option)
|
||||
this.applyMarks(this.integrateChart.eChartOption)
|
||||
this.integrateChart.refresh(option)
|
||||
this.applyExtend(this.integrateChart.eChartOption)
|
||||
option.extend = this.integrateChart.eChartOption
|
||||
option.extend = this.applyExtend(this.integrateChart.eChartOption)
|
||||
if (this.colorMode !== 'default') {
|
||||
option.color = this.computedChartColor()
|
||||
}
|
||||
|
@ -387,7 +386,7 @@ export default {
|
|||
this.integrateChart.setSimpleOption(this.iChartName, option, plugins)
|
||||
this.$emit('handle-color', option.color)
|
||||
this.applyMarks(this.integrateChart.eChartOption)
|
||||
option = this.applyExtend(this.integrateChart.eChartOption)
|
||||
option.extend = this.applyExtend(this.integrateChart.eChartOption)
|
||||
|
||||
this.integrateChart.render(this.renderOption)
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue