center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

Merge pull request #9694 from dataease/pr@dev-v2@chart-quadrant-baseline-input

Browse Source 
feat(图表-象限图): 恒线支持设置小数以及负数
This commit is contained in:
jianneng-fit2cloud 2024-05-17 11:12:52 +08:00 committed by GitHub
commit 0f97bc6f94
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 22 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
core/core-frontend/src/views/chart/components/editor/editor-style/components/QuadrantSelector.vue
View File

@ -33,14 +33,14 @@ const labels = []
const isDashboard = dvMainStore.dvInfo.type === 'dashboard'
for (let i = 0; i < 4; i++) {
regionStyle.push({
fill: isDashboard ? '#fdfcfc' : 'rgb(2,4,8,1)',
fillOpacity: 1
fill: isDashboard ? '#ffffff' : 'rgb(2,4,8,1,1)',
fillOpacity: '1.0'
})
labels.push({
content: '',
style: {
fill: isDashboard ? 'rgb(2,4,8,1)' : '#fdfcfc',
fillOpacity: 0.5,
fill: isDashboard ? 'rgb(2,4,8,1,1)' : '#ffffff',
fillOpacity: '0.5',
fontSize: 14
}
})
@ -108,6 +108,14 @@ const init = () => {
if (customAttr.quadrant) {
state.quadrantForm = customAttr.quadrant
} else {
// 新增图表
state.quadrantForm = {
...JSON.parse(JSON.stringify(DEFAULT_QUADRANT_STYLE)),
regionStyle,
labels
}
state.quadrantForm.xBaseline = undefined
state.quadrantForm.yBaseline = undefined
changeStyle()
}
}
@ -188,8 +196,8 @@ onMounted(() => {
style="width: 100%"
:effect="props.themes"
v-model="state.quadrantForm.xBaseline"
:precision="0"
:min="0"
:precision="2"
:step="0.01"
size="small"
@change="changeStyle()"
/>
@ -205,8 +213,8 @@ onMounted(() => {
style="width: 100%"
:effect="props.themes"
v-model="state.quadrantForm.yBaseline"
:precision="0"
:min="0"
:precision="2"
:step="0.01"
size="small"
@change="changeStyle()"
/>

25
core/core-frontend/src/views/chart/components/js/panel/charts/others/quadrant.ts
View File

@ -167,30 +167,16 @@ export class Quadrant extends G2PlotChartView<ScatterOptions, G2Scatter> {
data.push(tmpData)
}
// x轴基准线 默认值
const xBaseline = (
(data.reduce((valueSoFar, currentItem) => {
return Math.max(valueSoFar, currentItem[xFieldObj.name])
}, 0) +
data.reduce((valueSoFar, currentItem) => {
return Math.min(valueSoFar, currentItem[xFieldObj.name])
}, Infinity)) /
2
).toFixed()
const xValues = data.map(item => item[xFieldObj.name])
const xBaseline = ((Math.max(...xValues) + Math.min(...xValues)) / 2).toFixed()
// y轴基准线 默认值
const yBaseline = (
(data.reduce((valueSoFar, currentItem) => {
return Math.max(valueSoFar, currentItem[yFieldObj.name])
}, 0) +
data.reduce((valueSoFar, currentItem) => {
return Math.min(valueSoFar, currentItem[yFieldObj.name])
}, Infinity)) /
2
).toFixed()
const yValues = data.map(item => item[yFieldObj.name])
const yBaseline = ((Math.max(...yValues) + Math.min(...yValues)) / 2).toFixed()
const defaultBaselineQuadrant = {
...chart.customAttr['quadrant']
}
// 新建图表
if (!defaultBaselineQuadrant.xBaseline) {
if (defaultBaselineQuadrant.xBaseline === undefined) {
// 默认基准线值
defaultBaselineQuadrant.xBaseline = xBaseline
defaultBaselineQuadrant.yBaseline = yBaseline
@ -215,6 +201,7 @@ export class Quadrant extends G2PlotChartView<ScatterOptions, G2Scatter> {
const newChart = new G2Scatter(container, options)
newChart.on('point:click', action)
newChart.on('click', () => quadrantDefaultBaseline(defaultBaselineQuadrant))
newChart.on('afterrender', () => quadrantDefaultBaseline(defaultBaselineQuadrant))
return newChart
}