Merge pull request #3342 from dataease/pr@dev@feat_donut_chart

Merge branch 'dev' into pr@dev@feat_donut_chart
This commit is contained in:
xuwei-fit2cloud 2022-10-12 17:28:58 +08:00 committed by GitHub
commit 25347c0b00
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 286 additions and 8 deletions

View File

@ -0,0 +1 @@
<svg t="1665397084381" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3560" data-darkreader-inline-fill="" width="200" height="200"><path d="M300.4928 595.6096a161.92 161.92 0 0 1 2.2016-176.3072L187.136 303.3088A285.3376 285.3376 0 0 0 102.4 505.8048a285.5936 285.5936 0 0 0 83.8912 202.8032l114.2016-112.9984z" p-id="3561" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#4a5a75;"></path><path d="M116.8128 827.5968A404.5568 404.5568 0 0 0 405.4016 947.2V668.2112a163.9168 163.9168 0 0 1-82.0992-45.312l-206.4896 204.6976z" p-id="3562" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#0954b8;"></path><path d="M443.392 671.104v192.512a278.3232 278.3232 0 0 0 197.7088-81.7152l-128.512-128.512a159.232 159.232 0 0 1-69.1968 17.7152z" p-id="3563" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#62daaa;"></path><path d="M547.2 628.8128l153.4976 154.1888a367.9744 367.9744 0 0 0 110.4128-262.784h-211.712a161.536 161.536 0 0 1-52.1984 108.5952zM596.8896 479.3088h306.6112a429.0048 429.0048 0 0 0-124.8-303.0016A426.9568 426.9568 0 0 0 475.392 51.2v300.416a162.1248 162.1248 0 0 1 121.4976 127.6928z" p-id="3564" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#4a5a75;"></path><path d="M327.0144 391.0144a160.1792 160.1792 0 0 1 106.7776-45.312V130.304a368.2048 368.2048 0 0 0-259.8912 107.52l153.088 153.1904z" p-id="3565" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#0954b8;"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1665372916044" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1445" data-darkreader-inline-fill="" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M847.872 789.248A438.1184 438.1184 0 0 0 947.2 528.5888l-201.0624 5.632a233.1392 233.1392 0 0 1-44.4416 116.864l146.176 138.1632z" p-id="1446" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#218c6c;"></path><path d="M744.2944 476.416l201.0624-5.632a412.7488 412.7488 0 0 0-5.9136-41.0112 433.7152 433.7152 0 0 0-119.6032-226.0736 436.224 436.224 0 0 0-279.0144-126.7968v201.6a235.3152 235.3152 0 0 1 203.4688 197.888z" p-id="1447" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#0954b8;"></path><path d="M276.9664 511.9744a235.2384 235.2384 0 0 1 206.1824-233.5744V76.8A434.176 434.176 0 0 0 204.0576 203.4944c-169.7024 169.8304-169.7024 446.4384 0.1024 616.3712 161.6384 161.7664 422.656 170.496 594.2272 19.9168 3.3024-2.7136 6.5024-5.632 9.8048-8.6528l-146.304-138.0608a234.0864 234.0864 0 0 1-150.0928 54.016c-129.5872 0.1024-234.8288-105.1136-234.8288-235.1104z" p-id="1448" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#4a5a75;"></path></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -1 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1617857636853" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="859" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M172.860952 769.462857c55.832381 66.072381 132.291048 92.769524 208.725334 88.064l4.412952-251.562667c-10.288762-4.705524-24.990476-4.705524-35.279238-15.725714L172.860952 769.487238z m239.616-404.041143l-5.90019-169.813333c-55.832381 0-97.01181 15.725714-142.57981 59.733333l76.434286 136.801524c24.990476-15.725714 45.592381-26.721524 72.045714-26.721524z m122.002286 125.781334h357.229714c0-273.554286-199.92381-490.544762-449.828571-490.544762v371.053714c47.030857 4.705524 92.598857 59.733333 92.598857 119.466667z m-5.875809 22.016c-4.412952 26.721524-24.990476 55.02781-45.592381 77.043809l361.642666 386.755048C951.978667 862.232381 1024 698.733714 1024 517.924571H528.579048v-4.705523z m-111.713524 97.475047h-4.412953V997.424762c111.713524-4.705524 219.014095-55.02781 301.348572-125.781333L463.920762 604.40381c-16.164571 6.290286-30.866286 6.290286-47.055238 6.290285z m-224.914286-92.769524c0 55.02781 20.577524 92.769524 51.44381 130.486858l91.136-77.04381c-14.701714-15.701333-24.990476-33.01181-30.866286-59.733333l-111.713524 6.290285z m113.176381-33.011809c0-33.01181 14.701714-55.02781 30.866286-77.04381L172.860952 186.197333C90.526476 245.930667 39.082667 338.70019 24.380952 447.146667l280.771048 37.741714c0 6.290286 0 0 0 0z" p-id="860"></path></svg>
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1665371243997" class="icon" viewBox="0 0 1059 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3181" data-darkreader-inline-fill="" xmlns:xlink="http://www.w3.org/1999/xlink" width="206.8359375" height="200"><path d="M562.95611883 904.32134819c-3.18646431-3.18646431-3.18646431-3.18646431-3.18646431-6.37292862V765.08251381l-3.1864643-249.99260902c0-3.18646431 3.18646431-6.37292861 6.37292861-9.46283341 3.18646431 0 9.4628334 0 9.46283341 3.18646431l272.10474013 272.10474014c3.18646431 3.18646431 3.18646431 9.4628334 1e-8 12.64929771-72.8058815 72.8058815-174.00026321 113.94023896-278.47766877 113.94023896l-3.08990478-3.18646431M793.92650152 214.59666443c0 3.18646431 0 3.18646431-3.18646431 6.37292862L714.74769141 296.86537933 575.60541656 439.1941185c-3.18646431 3.18646431-6.37292861 3.18646431-9.46283342 3.18646431-3.18646431 0-6.27636909-3.18646431-6.2763691-6.37292861V125.9550209c0-3.18646431 3.18646431-9.4628334 9.46283342-9.4628334 82.26871491 0 161.3509655 31.67152404 221.50754927 91.73154832 3.08990479 3.18646431 3.08990479 3.18646431 3.08990479 6.37292861" p-id="3182" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#1c2081;"></path><path d="M812.85216833 717.67178726c-3.18646431 0-3.18646431 0-6.37292861-3.18646431l-75.89578629-75.89578628-145.51520348-142.42529869c-3.18646431-3.18646431-3.18646431-6.37292861-3.1864643-9.46283341 0-3.18646431 3.18646431-6.37292861 6.37292861-6.37292861h313.2390976c3.18646431 0 9.4628334 3.18646431 9.46283341 9.4628334 0 85.45517922-34.76142883 164.53742981-94.91801264 224.69401359 0 3.18646431-3.18646431 3.18646431-3.1864643 3.18646431M781.2772038 464.49271393H588.25471426c-3.18646431 0-3.18646431 0-3.1864643-3.18646431v-6.37292862l136.05237005-136.05237007c3.18646431-3.18646431 6.37292861-3.18646431 6.37292863 0 37.94789314 37.94789314 56.97011948 85.45517922 56.97011948 139.23883437l-3.18646431 6.37292863" p-id="3183" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#795706;"></path><path d="M540.7474282 182.92514038l3.1864643 3.18646431V436.10421372c0 3.18646431 0 6.37292861-3.1864643 6.37292862h-6.37292863L357.28433157 265.19385528c-3.18646431-3.18646431-3.18646431-6.37292861 0-9.4628334C404.69505811 208.22373582 467.94154669 179.73867607 537.56096388 179.73867607l3.18646431 3.18646431M354.09786726 689.18672752c0-3.18646431 0-3.18646431 3.18646432-3.18646431l63.24648856-63.24648857 113.94023894-117.03014373c3.18646431-3.18646431 3.18646431-3.18646431 6.37292864 0 3.18646431 0 3.18646431 3.18646431 3.18646431 6.37292862v249.99260902c0 3.18646431-3.18646431 6.37292861-6.37292862 6.37292862-66.43295288 0-132.86590576-25.29859543-180.37319184-75.89578629-3.18646431-0.19311905-3.18646431-3.37958335-3.1864643-3.37958336" p-id="3184" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#368565;"></path><path d="M199.02327085 486.70140457s3.18646431-3.18646431 6.37292863-3.18646431H312.96350982l202.48532295-3.1864643c3.18646431 0 6.37292861 3.18646431 6.37292861 6.37292861s0 6.27636909-3.18646431 9.4628334L297.12774777 717.67178726c-3.18646431 3.18646431-9.4628334 3.18646431-12.64929769 0-60.15658379-60.15658379-91.73154832-139.23883438-91.73154833-224.6940136 3.08990479-3.08990479 3.08990479-6.27636909 6.2763691-6.27636909M240.1576283 179.73867607c3.18646431 0 6.37292861 0 6.37292863 3.18646431l94.91801262 94.91801262 174.00026321 174.00026321c3.18646431 3.18646431 3.18646431 6.37292861 3.18646431 9.46283341 0 3.18646431-6.37292861 6.37292861-9.4628334 6.37292862H129.40385366c-6.37292861 0-9.4628334-3.18646431-9.46283339-9.46283341C119.94102026 356.9254036 161.07537771 258.91748619 233.88125921 186.11160469c3.08990479-3.18646431 3.08990479-6.37292861 6.2763691-6.37292862" p-id="3185" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#1c2081;"></path></svg>

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

View File

@ -1124,7 +1124,9 @@ export default {
chart_line: 'Base Line',
chart_line_stack: 'Stack Line',
chart_pie: 'Pie',
chart_pie_donut: 'Donut Pie',
chart_pie_rose: 'Rose Pie',
chart_pie_donut_rose: 'Rose Donut Pie',
chart_funnel: 'Funnel',
chart_radar: 'Radar',
chart_gauge: 'Gauge',

View File

@ -1124,7 +1124,9 @@ export default {
chart_line: '基礎摺線圖',
chart_line_stack: '堆疊摺線圖',
chart_pie: '餅圖',
chart_pie_donut: '環形圖',
chart_pie_rose: '南丁格爾玫瑰圖',
chart_pie_donut_rose: '南丁格爾玫瑰環形圖',
chart_funnel: '漏鬥圖',
chart_radar: '雷達圖',
chart_gauge: '儀表盤',

View File

@ -1123,7 +1123,9 @@ export default {
chart_line: '基础折线图',
chart_line_stack: '堆叠折线图',
chart_pie: '饼图',
chart_pie_donut: '环形图',
chart_pie_rose: '南丁格尔玫瑰图',
chart_pie_donut_rose: '南丁格尔玫瑰环形图',
chart_funnel: '漏斗图',
chart_radar: '雷达图',
chart_gauge: '仪表盘',

View File

@ -16,3 +16,12 @@ export function randomRange(min, max) {
}
return returnStr
}
export function equalsAny(target,...sources) {
for (let i = 0; i < sources.length; i++) {
if (target === sources[i]){
return true
}
}
return false
}

View File

@ -1066,6 +1066,63 @@ export const TYPE_CONFIGS = [
'title-selector-ant-v',
'legend-selector-ant-v'
],
propertyInner: {
'color-selector': [
'value',
'colorPanel',
'customColor',
'alpha'
],
'size-selector-ant-v': [
'pieOuterRadius'
],
'label-selector-ant-v': [
'show',
'fontSize',
'color',
'position-pie'
],
'tooltip-selector-ant-v': [
'show',
'textStyle'
],
'title-selector-ant-v': [
'show',
'title',
'fontSize',
'color',
'hPosition',
'isItalic',
'isBolder',
'remarkShow',
'fontFamily',
'letterSpace',
'fontShadow'
],
'legend-selector-ant-v': [
'show',
'icon',
'orient',
'textStyle',
'hPosition',
'vPosition'
]
}
},
{
render: 'antv',
category: 'chart.chart_type_distribute',
value: 'pie-donut',
title: 'chart.chart_pie_donut',
icon: 'pie-donut',
properties: [
'color-selector',
'size-selector-ant-v',
'label-selector-ant-v',
'tooltip-selector-ant-v',
'title-selector-ant-v',
'legend-selector-ant-v'
],
propertyInner: {
'color-selector': [
'value',
@ -1124,6 +1181,63 @@ export const TYPE_CONFIGS = [
'title-selector-ant-v',
'legend-selector-ant-v'
],
propertyInner: {
'color-selector': [
'value',
'colorPanel',
'customColor',
'alpha'
],
'size-selector-ant-v': [
'pieOuterRadius'
],
'label-selector-ant-v': [
'show',
'fontSize',
'color',
'position-pie'
],
'tooltip-selector-ant-v': [
'show',
'textStyle'
],
'title-selector-ant-v': [
'show',
'title',
'fontSize',
'color',
'hPosition',
'isItalic',
'isBolder',
'remarkShow',
'fontFamily',
'letterSpace',
'fontShadow'
],
'legend-selector-ant-v': [
'show',
'icon',
'orient',
'textStyle',
'hPosition',
'vPosition'
]
}
},
{
render: 'antv',
category: 'chart.chart_type_distribute',
value: 'pie-donut-rose',
title: 'chart.chart_pie_donut_rose',
icon: 'pie-donut-rose',
properties: [
'color-selector',
'size-selector-ant-v',
'label-selector-ant-v',
'tooltip-selector-ant-v',
'title-selector-ant-v',
'legend-selector-ant-v'
],
propertyInner: {
'color-selector': [
'value',
@ -2378,6 +2492,64 @@ export const TYPE_CONFIGS = [
'title-selector',
'legend-selector'
],
propertyInner: {
'color-selector': [
'value',
'custom',
'alpha'
],
'size-selector': [
'pieOuterRadius'
],
'label-selector': [
'show',
'labelLine',
'fontSize',
'color',
'position-pie',
'formatter'
],
'tooltip-selector': [
'show',
'trigger',
'textStyle',
'formatter'
],
'title-selector': [
'show',
'title',
'fontSize',
'color',
'hPosition',
'vPosition',
'isItalic',
'isBolder'
],
'legend-selector': [
'show',
'icon',
'orient',
'textStyle',
'hPosition',
'vPosition'
]
}
},
{
render: 'echarts',
category: 'chart.chart_type_distribute',
value: 'pie-donut',
title: 'chart.chart_pie_donut',
icon: 'pie-donut',
properties: [
'color-selector',
'size-selector',
'label-selector',
'tooltip-selector',
'title-selector',
'legend-selector'
],
propertyInner: {
'color-selector': [
@ -2437,6 +2609,65 @@ export const TYPE_CONFIGS = [
'title-selector',
'legend-selector'
],
propertyInner: {
'color-selector': [
'value',
'custom',
'alpha'
],
'size-selector': [
'pieOuterRadius',
'pieRoseType',
'pieRoseRadius'
],
'label-selector': [
'show',
'fontSize',
'color',
'position-pie',
'formatter'
],
'tooltip-selector': [
'show',
'trigger',
'textStyle',
'formatter'
],
'title-selector': [
'show',
'title',
'fontSize',
'color',
'hPosition',
'vPosition',
'isItalic',
'isBolder'
],
'legend-selector': [
'show',
'icon',
'orient',
'textStyle',
'hPosition',
'vPosition'
]
}
},
{
render: 'echarts',
category: 'chart.chart_type_distribute',
value: 'pie-donut-rose',
title: 'chart.chart_pie_donut_rose',
icon: 'pie-donut-rose',
properties: [
'color-selector',
'size-selector',
'label-selector',
'tooltip-selector',
'title-selector',
'legend-selector'
],
propertyInner: {
'color-selector': [

View File

@ -297,9 +297,9 @@ export default {
chart_option = baseLineOption(JSON.parse(JSON.stringify(BASE_LINE)), chart)
} else if (chart.type === 'line-stack') {
chart_option = stackLineOption(JSON.parse(JSON.stringify(BASE_LINE)), chart)
} else if (chart.type === 'pie') {
} else if (chart.type === 'pie' || chart.type === 'pie-donut') {
chart_option = basePieOption(JSON.parse(JSON.stringify(BASE_PIE)), chart)
} else if (chart.type === 'pie-rose') {
} else if (chart.type === 'pie-rose' || chart.type === 'pie-donut-rose') {
chart_option = rosePieOption(JSON.parse(JSON.stringify(BASE_PIE)), chart)
} else if (chart.type === 'funnel') {
chart_option = baseFunnelOption(JSON.parse(JSON.stringify(BASE_FUNNEL)), chart)

View File

@ -219,9 +219,7 @@ export default {
this.myChart = baseBarOptionAntV(this.myChart, this.chartId, chart, this.antVAction, true, false)
} else if (chart.type === 'bar-group') {
this.myChart = baseBarOptionAntV(this.myChart, this.chartId, chart, this.antVAction, true, false)
} else if (chart.type === 'bar-stack') {
this.myChart = baseBarOptionAntV(this.myChart, this.chartId, chart, this.antVAction, false, true)
} else if (chart.type === 'percentage-bar-stack') {
} else if (chart.type === 'bar-stack' || chart.type === 'percentage-bar-stack') {
this.myChart = baseBarOptionAntV(this.myChart, this.chartId, chart, this.antVAction, false, true)
} else if (chart.type === 'bar-horizontal') {
this.myChart = hBaseBarOptionAntV(this.myChart, this.chartId, chart, this.antVAction, true, false)
@ -239,9 +237,9 @@ export default {
this.myChart = baseRadarOptionAntV(this.myChart, this.chartId, chart, this.antVAction)
} else if (chart.type === 'gauge') {
this.myChart = baseGaugeOptionAntV(this.myChart, this.chartId, chart, this.antVAction, this.scale)
} else if (chart.type === 'pie') {
} else if (chart.type === 'pie' || chart.type === 'pie-donut') {
this.myChart = basePieOptionAntV(this.myChart, this.chartId, chart, this.antVAction)
} else if (chart.type === 'pie-rose') {
} else if (chart.type === 'pie-rose' || chart.type === 'pie-donut-rose') {
this.myChart = basePieRoseOptionAntV(this.myChart, this.chartId, chart, this.antVAction)
} else if (chart.type === 'funnel') {
this.myChart = baseFunnelOptionAntV(this.myChart, this.chartId, chart, this.antVAction)

View File

@ -1038,6 +1038,13 @@ export default {
} else {
attr.label.position = 'inner'
}
// * 0.5 * 0.7
if (type === 'pie-donut') {
attr.size.pieInnerRadius = Math.round(attr.size.pieOuterRadius * 0.7)
}
if (type === 'pie-donut-rose') {
attr.size.pieInnerRadius = Math.round(attr.size.pieOuterRadius * 0.5)
}
} else if (type.includes('line')) {
attr.label.position = 'top'
} else if (type.includes('treemap')) {

View File

@ -1588,6 +1588,7 @@ import CustomSortEdit from '@/views/chart/components/compare/CustomSortEdit'
import ScrollCfg from '@/views/chart/components/senior/ScrollCfg'
import ChartFieldEdit from '@/views/chart/view/ChartFieldEdit'
import CalcChartFieldEdit from '@/views/chart/view/CalcChartFieldEdit'
import { equalsAny } from "@/utils/StringUtils";
export default {
name: 'ChartEdit',
@ -1876,6 +1877,24 @@ export default {
initFromPanel() {
this.hasEdit = (this.panelViewEditInfo[this.param.id] || false)
},
// v1.16.0
convertChart(chart) {
// v1.16.0
if (equalsAny(chart.type,'pie','pie-rose')) {
let customAttr = chart.customAttr;
if (typeof chart.customAttr === 'string'){
customAttr = JSON.parse(customAttr)
}
if (customAttr.size.pieInnerRadius > 0) {
if (chart.type === 'pie') {
chart.type = 'pie-donut'
}
if (chart.type === 'pie-rose') {
chart.type = 'pie-donut-rose'
}
}
}
},
chartInit() {
this.fieldShow = false
this.resetDrill()
@ -2334,6 +2353,12 @@ export default {
this.httpRequest.status = err.response.data.success
this.httpRequest.msg = err.response.data.message
return true
}).then(() => {
//
if (this.editStatue) {
this.convertChart(this.chart);
this.convertChart(this.view)
}
})
} else {
this.view = {}