diff --git a/core/frontend/src/lang/en.js b/core/frontend/src/lang/en.js
index cdf0413b00..8da910de76 100644
--- a/core/frontend/src/lang/en.js
+++ b/core/frontend/src/lang/en.js
@@ -1681,6 +1681,7 @@ export default {
map_line_color_target_color: 'End Color',
map_line_theta_offset: 'Radian',
gauge_axis_label: 'Axis Label',
+ gauge_percentage_tick: 'Percentage tick',
word_size_range: 'Word Size Range',
word_spacing: 'Word Spacing',
axis_multi_select_tip: 'Hold down the Ctrl/Cmd or Shift key and click to select more than one',
diff --git a/core/frontend/src/lang/tw.js b/core/frontend/src/lang/tw.js
index 0fcf394508..4d431ed5ef 100644
--- a/core/frontend/src/lang/tw.js
+++ b/core/frontend/src/lang/tw.js
@@ -1673,6 +1673,7 @@ export default {
map_line_color_target_color: '結束顏色',
map_line_theta_offset: '弧度',
gauge_axis_label: '刻度標籤',
+ gauge_percentage_tick: '百分比刻度',
word_size_range: '字號區間',
word_spacing: '文字間隔',
axis_multi_select_tip: '按住 Ctrl/Cmd 鍵或者 Shift 鍵再點擊可多選',
diff --git a/core/frontend/src/lang/zh.js b/core/frontend/src/lang/zh.js
index 2e04769207..bce38bb4e7 100644
--- a/core/frontend/src/lang/zh.js
+++ b/core/frontend/src/lang/zh.js
@@ -1673,6 +1673,7 @@ export default {
map_line_color_target_color: '结束颜色',
map_line_theta_offset: '弧度',
gauge_axis_label: '刻度标签',
+ gauge_percentage_tick: '百分比刻度',
word_size_range: '字号区间',
word_spacing: '文字间隔',
axis_multi_select_tip: '按住 Ctrl/Cmd 键或者 Shift 键再点击可多选',
diff --git a/core/frontend/src/views/chart/chart/chart.js b/core/frontend/src/views/chart/chart/chart.js
index 799e5ebeda..81bc796cc7 100644
--- a/core/frontend/src/views/chart/chart/chart.js
+++ b/core/frontend/src/views/chart/chart/chart.js
@@ -124,6 +124,7 @@ export const DEFAULT_SIZE = {
gaugeEndAngle: -45,
gaugeAxisLine: true,
gaugeTickCount: 5,
+ gaugePercentLabel: true,
dimensionFontSize: 18,
quotaFontSize: 18,
spaceSplit: 10,
diff --git a/core/frontend/src/views/chart/chart/gauge/gauge_antv.js b/core/frontend/src/views/chart/chart/gauge/gauge_antv.js
index 802ccbcfd1..80a7fba93a 100644
--- a/core/frontend/src/views/chart/chart/gauge/gauge_antv.js
+++ b/core/frontend/src/views/chart/chart/gauge/gauge_antv.js
@@ -2,7 +2,8 @@ import { getPadding, getTheme, setGradientColor } from '@/views/chart/chart/comm
import { Gauge } from '@antv/g2plot'
import { DEFAULT_LABEL, DEFAULT_SIZE, DEFAULT_THRESHOLD } from '@/views/chart/chart/chart'
import { getScaleValue } from '@/components/canvas/utils/style'
-import { valueFormatter } from '@/views/chart/chart/formatter'
+import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
+import { parseJson } from '@/views/chart/chart/util'
let labelFormatter = null
@@ -14,14 +15,6 @@ export function baseGaugeOptionAntV(container, chart, action, scale = 1) {
const data = chart.data.series[0].data[0]
// size
let customAttr = {}
- let axisLabel = {
- style: {
- fontSize: getScaleValue(14, scale) // 刻度值字体大小
- },
- formatter: function(v) {
- return v === '0' ? v : (v * 100 + '%')
- }
- }
if (chart.customAttr) {
customAttr = JSON.parse(chart.customAttr)
if (customAttr.size) {
@@ -41,11 +34,25 @@ export function baseGaugeOptionAntV(container, chart, action, scale = 1) {
}
startAngel = parseInt(size.gaugeStartAngle) * Math.PI / 180
endAngel = parseInt(size.gaugeEndAngle) * Math.PI / 180
- if (customAttr.size.gaugeAxisLine === false) {
- axisLabel = false
- }
}
}
+ let axisLabel = {
+ style: {
+ fontSize: getScaleValue(14, scale) // 刻度值字体大小
+ },
+ formatter: function(v) {
+ const gaugePercentLabel = customAttr?.size?.gaugePercentLabel
+ if (gaugePercentLabel === false) {
+ const yAxis = parseJson(chart.yaxis)?.[0]
+ const formatter = yAxis?.formatterCfg ?? formatterItem
+ return valueFormatter(v * max, formatter)
+ }
+ return v === '0' ? v : (v * 100 + '%')
+ }
+ }
+ if (customAttr.size.gaugeAxisLine === false) {
+ axisLabel = false
+ }
const per = (parseFloat(data) - parseFloat(min)) / (parseFloat(max) - parseFloat(min))
// label
if (customAttr.label) {
diff --git a/core/frontend/src/views/chart/chart/util.js b/core/frontend/src/views/chart/chart/util.js
index 274bb1c0b9..53a765b3f8 100644
--- a/core/frontend/src/views/chart/chart/util.js
+++ b/core/frontend/src/views/chart/chart/util.js
@@ -323,7 +323,8 @@ export const TYPE_CONFIGS = [
'gaugeStartAngle',
'gaugeEndAngle',
'gaugeTickCount',
- 'gaugeAxisLine'
+ 'gaugeAxisLine',
+ 'gaugePercentLabel'
],
'label-selector-ant-v': [
'labelGauge'
diff --git a/core/frontend/src/views/chart/components/dragItem/QuotaItem.vue b/core/frontend/src/views/chart/components/dragItem/QuotaItem.vue
index 0f4e27c35c..8109d24d35 100644
--- a/core/frontend/src/views/chart/components/dragItem/QuotaItem.vue
+++ b/core/frontend/src/views/chart/components/dragItem/QuotaItem.vue
@@ -216,7 +216,7 @@
{{ $t('chart.filter') }}...
+
+
+
@@ -1837,7 +1847,7 @@ export default {
}
this.sizeForm.wordSizeRange = this.sizeForm.wordSizeRange ?? DEFAULT_SIZE.wordSizeRange
this.sizeForm.wordSpacing = this.sizeForm.wordSpacing ?? DEFAULT_SIZE.wordSpacing
-
+ this.sizeForm.gaugePercentLabel = this.sizeForm.gaugePercentLabel === false ? false : DEFAULT_SIZE.gaugePercentLabel
if (this.chart.type !== 'table-pivot') {
let { xaxis, yaxis } = this.chart
if (!(xaxis instanceof Object)) {