Skip to content

D
dataease
Unverified 提交 bd361131 authored 作者: XiaJunjie2020's avatar XiaJunjie2020 提交者： GitHub
浏览文件
操作

Merge pull request #736 from dataease/pr@dev@feat_chart_mix

feat: 视图增加组合图
上级 3d118a71 5b83a779
隐藏空白字符变更
内嵌 并排
正在显示 包含 287 行增加 和 21 行删除
backend/src/main/java/io/dataease/dto/chart/ChartViewFieldDTO.java
浏览文件 @ bd361131
......@@ -44,4 +44,6 @@ public class ChartViewFieldDTO implements Serializable {
private String datePattern;
private Integer extField;
private String chartType;
}
backend/src/main/java/io/dataease/service/chart/ChartViewService.java
浏览文件 @ bd361131
......@@ -427,6 +427,8 @@ public class ChartViewService {
} else if (StringUtils.containsIgnoreCase(view.getType(), "text")
|| StringUtils.containsIgnoreCase(view.getType(), "gauge")) {
mapChart = transNormalChartData(xAxis, yAxis, view, data, isDrill);
} else if (StringUtils.containsIgnoreCase(view.getType(), "chart-mix")) {
mapChart = transMixChartData(xAxis, yAxis, view, data, isDrill);
} else {
mapChart = transChartData(xAxis, yAxis, view, data, isDrill);
}
......@@ -561,6 +563,67 @@ public class ChartViewService {
return map;
}
// 组合图形
private Map<String, Object> transMixChartData(List<ChartViewFieldDTO> xAxis, List<ChartViewFieldDTO> yAxis, ChartViewWithBLOBs view, List<String[]> data, boolean isDrill) {
Map<String, Object> map = new HashMap<>();
List<String> x = new ArrayList<>();
List<Series> series = new ArrayList<>();
for (ChartViewFieldDTO y : yAxis) {
Series series1 = new Series();
series1.setName(y.getName());
series1.setType(y.getChartType());
series1.setData(new ArrayList<>());
series.add(series1);
}
for (int i1 = 0; i1 < data.size(); i1++) {
String[] d = data.get(i1);
StringBuilder a = new StringBuilder();
for (int i = xAxis.size(); i < xAxis.size() + yAxis.size(); i++) {
List<ChartDimensionDTO> dimensionList = new ArrayList<>();
List<ChartQuotaDTO> quotaList = new ArrayList<>();
AxisChartDataDTO axisChartDataDTO = new AxisChartDataDTO();
for (int j = 0; j < xAxis.size(); j++) {
ChartDimensionDTO chartDimensionDTO = new ChartDimensionDTO();
chartDimensionDTO.setId(xAxis.get(j).getId());
chartDimensionDTO.setValue(d[j]);
dimensionList.add(chartDimensionDTO);
}
axisChartDataDTO.setDimensionList(dimensionList);
int j = i - xAxis.size();
ChartQuotaDTO chartQuotaDTO = new ChartQuotaDTO();
chartQuotaDTO.setId(yAxis.get(j).getId());
quotaList.add(chartQuotaDTO);
axisChartDataDTO.setQuotaList(quotaList);
try {
axisChartDataDTO.setValue(new BigDecimal(StringUtils.isEmpty(d[i]) ? "0" : d[i]));
} catch (Exception e) {
axisChartDataDTO.setValue(new BigDecimal(0));
}
series.get(j).getData().add(axisChartDataDTO);
}
if (isDrill) {
a.append(d[xAxis.size() - 1]);
} else {
for (int i = 0; i < xAxis.size(); i++) {
if (i == xAxis.size() - 1) {
a.append(d[i]);
} else {
a.append(d[i]).append("\n");
}
}
}
x.add(a.toString());
}
map.put("x", x);
map.put("series", series);
return map;
}
// 常规图形
private Map<String, Object> transNormalChartData(List<ChartViewFieldDTO> xAxis, List<ChartViewFieldDTO> yAxis, ChartViewWithBLOBs view, List<String[]> data, boolean isDrill) {
Map<String, Object> map = new HashMap<>();
......
frontend/src/icons/svg/chart-mix.svg 0 → 100644
浏览文件 @ bd361131
<svg t="1630391478183" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="839" width="200" height="200"><path d="M64 104.1c0-1.3 0.5-2.6 1.5-3.6s2.3-1.5 3.6-1.5H101c1.3 0 2.6 0.5 3.6 1.5s1.5 2.3 1.5 3.6V883H955c1.3 0 2.6 0.5 3.6 1.5s1.5 2.3 1.5 3.6V920c0 1.3-0.5 2.6-1.5 3.6s-2.3 1.5-3.6 1.5H64v-821z" p-id="840"></path><path d="M792 454.2c0-3.9 1.5-7.7 4.4-10.7s6.8-4.4 10.7-4.4h137.7c3.9 0 7.7 1.5 10.7 4.4 3 3 4.4 6.8 4.4 10.7V827H792V454.2zM601.5 577.6L374.8 378.1 223.9 567.5 162 518.3l203.3-254.5 227.9 201.4L900.1 99l60 50.5-358.6 428.1zM162 648.1c0-3.9 1.5-7.7 4.4-10.7s6.8-4.4 10.7-4.4h137.7c3.9 0 7.7 1.5 10.7 4.4 3 3 4.4 6.8 4.4 10.7V827H162V648.1z" p-id="841"></path><path d="M372 586.8c0-3.9 1.5-7.7 4.4-10.7s6.8-4.4 10.7-4.4h137.7c3.9 0 7.7 1.5 10.7 4.4 3 3 4.4 6.8 4.4 10.7V827H372V586.8zM582 714.4c0-3.9 1.5-7.7 4.4-10.7s6.8-4.4 10.7-4.4h137.7c3.9 0 7.7 1.5 10.7 4.4 3 3 4.4 6.8 4.4 10.7V827H582V714.4z" p-id="842"></path></svg>
frontend/src/lang/en.js
浏览文件 @ bd361131
......@@ -848,7 +848,8 @@ export default {
system_case: 'System',
custom_case: 'Custom',
last_layer: 'This Is The Last Layer',
radar_size: 'Size'
radar_size: 'Size',
chart_mix: 'Mix'
},
dataset: {
sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',
......
frontend/src/lang/tw.js
浏览文件 @ bd361131
......@@ -847,7 +847,8 @@ export default {
system_case: '系統方案',
custom_case: '自定義',
last_layer: '當前已經是最後一級',
radar_size: '大小'
radar_size: '大小',
chart_mix: '組合圖'
},
dataset: {
sheet_warn: '有多個sheet頁面，默認抽取第一個',
......
frontend/src/lang/zh.js
浏览文件 @ bd361131
......@@ -847,7 +847,8 @@ export default {
system_case: '系统方案',
custom_case: '自定义',
last_layer: '当前已经是最后一级',
radar_size: '大小'
radar_size: '大小',
chart_mix: '组合图'
},
dataset: {
sheet_warn: '有多个 Sheet 页，默认抽取第一个',
......
frontend/src/views/chart/chart/common/common.js
浏览文件 @ bd361131
......@@ -51,7 +51,7 @@ export function componentStyle(chart_option, chart) {
chart_option.legend.icon = customStyle.legend.icon
chart_option.legend.textStyle = customStyle.legend.textStyle
}
if (customStyle.xAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter'))) {
if (customStyle.xAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter') || chart.type === 'chart-mix')) {
chart_option.xAxis.show = customStyle.xAxis.show
chart_option.xAxis.position = customStyle.xAxis.position
chart_option.xAxis.name = customStyle.xAxis.name
......@@ -61,8 +61,12 @@ export function componentStyle(chart_option, chart) {
chart_option.xAxis.axisLabel.showMaxLabel = true
chart_option.xAxis.axisLabel.showMinLabel = true
if (!customStyle.xAxis.show) {
chart_option.xAxis.axisLabel.show = false
}
}
if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter'))) {
if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter') || chart.type === 'chart-mix')) {
chart_option.yAxis.show = customStyle.yAxis.show
chart_option.yAxis.position = customStyle.yAxis.position
chart_option.yAxis.name = customStyle.yAxis.name
......@@ -70,8 +74,12 @@ export function componentStyle(chart_option, chart) {
chart_option.yAxis.splitLine = customStyle.yAxis.splitLine
chart_option.yAxis.nameTextStyle = customStyle.yAxis.nameTextStyle
chart_option.xAxis.axisLabel.showMaxLabel = true
chart_option.xAxis.axisLabel.showMinLabel = true
chart_option.yAxis.axisLabel.showMaxLabel = true
chart_option.yAxis.axisLabel.showMinLabel = true
if (!customStyle.yAxis.show) {
chart_option.yAxis.axisLabel.show = false
}
}
if (customStyle.split && chart.type.includes('radar')) {
chart_option.radar.name = customStyle.split.name
......
frontend/src/views/chart/chart/mix/mix.js 0 → 100644
浏览文件 @ bd361131
import { hexColorToRGBA } from '@/views/chart/chart/util'
import { componentStyle } from '../common/common'
export function baseMixOption(chart_option, chart) {
// 处理shape attr
let customAttr = {}
if (chart.customAttr) {
customAttr = JSON.parse(chart.customAttr)
if (customAttr.color) {
chart_option.color = customAttr.color.colors
}
// tooltip
if (customAttr.tooltip) {
const tooltip = JSON.parse(JSON.stringify(customAttr.tooltip))
const reg = new RegExp('\n', 'g')
tooltip.formatter = tooltip.formatter.replace(reg, '<br/>')
chart_option.tooltip = tooltip
}
}
// 处理data
if (chart.data) {
chart_option.title.text = chart.title
chart_option.xAxis.data = chart.data.x
for (let i = 0; i < chart.data.series.length; i++) {
const y = chart.data.series[i]
y.type = y.type ? y.type : 'bar'
// color
y.itemStyle = {
color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
}
// size
if (customAttr.size) {
// bar
if (y.type === 'bar') {
if (customAttr.size.barDefault) {
y.barWidth = null
y.barGap = null
} else {
y.barWidth = customAttr.size.barWidth
y.barGap = customAttr.size.barGap
}
}
// line
if (y.type === 'line') {
y.symbol = customAttr.size.lineSymbol
y.symbolSize = customAttr.size.lineSymbolSize
y.lineStyle = {
width: customAttr.size.lineWidth,
type: customAttr.size.lineType
}
y.smooth = customAttr.size.lineSmooth
y.areaStyle = {
opacity: customAttr.size.lineArea ? 0.6 : 0
}
}
// scatter
if (y.type === 'scatter') {
y.symbol = customAttr.size.scatterSymbol ? customAttr.size.scatterSymbol : 'circle'
y.symbolSize = customAttr.size.scatterSymbolSize ? customAttr.size.scatterSymbolSize : 20
}
}
// label
if (customAttr.label) {
y.label = customAttr.label
}
chart_option.legend.data.push(y.name)
chart_option.series.push(y)
}
}
// console.log(chart_option);
componentStyle(chart_option, chart)
return chart_option
}
frontend/src/views/chart/components/ChartComponent.vue
浏览文件 @ bd361131
......@@ -6,7 +6,18 @@
</template>
<script>
import { BASE_BAR, BASE_LINE, HORIZONTAL_BAR, BASE_PIE, BASE_FUNNEL, BASE_RADAR, BASE_GAUGE, BASE_MAP, BASE_SCATTER, BASE_TREEMAP } from '../chart/chart'
import {
BASE_BAR,
BASE_LINE,
HORIZONTAL_BAR,
BASE_PIE,
BASE_FUNNEL,
BASE_RADAR,
BASE_GAUGE,
BASE_MAP,
BASE_SCATTER,
BASE_TREEMAP
} from '../chart/chart'
import { baseBarOption, stackBarOption, horizontalBarOption, horizontalStackBarOption } from '../chart/bar/bar'
import { baseLineOption, stackLineOption } from '../chart/line/line'
import { basePieOption, rosePieOption } from '../chart/pie/pie'
......@@ -16,6 +27,7 @@ import { baseRadarOption } from '../chart/radar/radar'
import { baseGaugeOption } from '../chart/gauge/gauge'
import { baseScatterOption } from '../chart/scatter/scatter'
import { baseTreemapOption } from '../chart/treemap/treemap'
import { baseMixOption } from '@/views/chart/chart/mix/mix'
// import eventBus from '@/components/canvas/utils/eventBus'
import { uuid } from 'vue-uuid'
import { geoJson } from '@/api/map/map'
......@@ -139,6 +151,8 @@ export default {
chart_option = baseScatterOption(JSON.parse(JSON.stringify(BASE_SCATTER)), chart)
} else if (chart.type === 'treemap') {
chart_option = baseTreemapOption(JSON.parse(JSON.stringify(BASE_TREEMAP)), chart)
} else if (chart.type === 'chart-mix') {
chart_option = baseMixOption(JSON.parse(JSON.stringify(BASE_BAR)), chart)
}
if (chart.type === 'map') {
......
frontend/src/views/chart/components/drag-item/QuotaItem.vue
浏览文件 @ bd361131
......@@ -6,6 +6,9 @@
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
<svg-icon v-if="item.deType === 2 || item.deType === 3" icon-class="field_value" class="field-icon-value" />
<svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
<svg-icon v-if="item.chartType === 'bar'" icon-class="bar" class-name="field-icon-sort" />
<svg-icon v-if="item.chartType === 'line'" icon-class="line" class-name="field-icon-sort" />
<svg-icon v-if="item.chartType === 'scatter'" icon-class="scatter" class-name="field-icon-sort" />
<svg-icon v-if="item.sort === 'asc'" icon-class="sort-asc" class-name="field-icon-sort" />
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span>
......@@ -20,6 +23,9 @@
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
<svg-icon v-if="item.deType === 2 || item.deType === 3" icon-class="field_value" class="field-icon-value" />
<svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
<svg-icon v-if="item.chartType === 'bar'" icon-class="bar" class-name="field-icon-sort" />
<svg-icon v-if="item.chartType === 'line'" icon-class="line" class-name="field-icon-sort" />
<svg-icon v-if="item.chartType === 'scatter'" icon-class="scatter" class-name="field-icon-sort" />
<svg-icon v-if="item.sort === 'asc'" icon-class="sort-asc" class-name="field-icon-sort" />
<svg-icon v-if="item.sort === 'desc'" icon-class="sort-desc" class-name="field-icon-sort" />
</span>
......@@ -28,7 +34,23 @@
<i class="el-icon-arrow-down el-icon--right" style="position: absolute;top: 6px;right: 10px;" />
</el-tag>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>
<el-dropdown-item v-show="chart.type ==='chart-mix'">
<el-dropdown placement="right-start" size="mini" style="width: 100%" @command="switchChartType">
<span class="el-dropdown-link inner-dropdown-menu">
<span>
<i class="el-icon-s-data" />
<span>{{ $t('chart.chart_type') }}</span>
</span>
<i class="el-icon-arrow-right el-icon--right" />
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="beforeSwitch('bar')">{{ $t('chart.chart_bar') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSwitch('line')">{{ $t('chart.chart_line') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSwitch('scatter')">{{ $t('chart.chart_scatter') }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-dropdown-item>
<el-dropdown-item divided>
<el-dropdown placement="right-start" size="mini" style="width: 100%" @command="summary">
<span class="el-dropdown-link inner-dropdown-menu">
<span>
......@@ -112,6 +134,10 @@ export default {
index: {
type: Number,
required: true
},
chart: {
type: Object,
required: true
}
},
data() {
......@@ -157,6 +183,17 @@ export default {
}
},
switchChartType(param) {
// console.log(param)
this.item.chartType = param.type
this.$emit('onQuotaItemChange', this.item)
},
beforeSwitch(type) {
return {
type: type
}
},
quickCalc(param) {
},
......@@ -237,7 +274,7 @@ export default {
.item-span-style{
display: inline-block;
width: 80px;
width: 70px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
......
frontend/src/views/chart/components/shape-attr/SizeSelector.vue
浏览文件 @ bd361131
......@@ -151,7 +151,7 @@
</el-select>
</el-form-item>
<el-form-item :label="$t('chart.bubble_size')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.scatterSymbolSize" show-input :show-input-controls="false" input-size="mini" :min="1" :max="20" @change="changeBarSizeCase" />
<el-slider v-model="sizeForm.scatterSymbolSize" show-input :show-input-controls="false" input-size="mini" :min="1" :max="40" @change="changeBarSizeCase" />
</el-form-item>
</el-form>
......@@ -163,6 +163,61 @@
<el-slider v-model="sizeForm.treemapHeight" show-input :show-input-controls="false" input-size="mini" :min="0" :max="100" @change="changeBarSizeCase" />
</el-form-item>
</el-form>
<el-form v-show="chart.type && chart.type === 'chart-mix'" ref="sizeFormBar" :disabled="param && !hasDataPermission('manage',param.privileges)" :model="sizeForm" label-width="80px" size="mini">
<el-form-item :label="$t('chart.adapt')" class="form-item">
<el-checkbox v-model="sizeForm.barDefault" @change="changeBarSizeCase">{{ $t('chart.adapt') }}</el-checkbox>
</el-form-item>
<el-form-item :label="$t('chart.bar_width')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.barWidth" :disabled="sizeForm.barDefault" show-input :show-input-controls="false" input-size="mini" :min="1" :max="80" @change="changeBarSizeCase" />
</el-form-item>
<el-form-item :label="$t('chart.bar_gap')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.barGap" :disabled="sizeForm.barDefault" show-input :show-input-controls="false" input-size="mini" :min="0" :max="5" :step="0.1" @change="changeBarSizeCase" />
</el-form-item>
<el-divider />
<el-form-item :label="$t('chart.line_width')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.lineWidth" show-input :show-input-controls="false" input-size="mini" :min="0" :max="10" @change="changeBarSizeCase" />
</el-form-item>
<el-form-item :label="$t('chart.line_type')" class="form-item">
<el-radio-group v-model="sizeForm.lineType" @change="changeBarSizeCase">
<el-radio-button label="solid">{{ $t('chart.line_type_solid') }}</el-radio-button>
<el-radio-button label="dashed">{{ $t('chart.line_type_dashed') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item :label="$t('chart.line_symbol')" class="form-item">
<el-select v-model="sizeForm.lineSymbol" :placeholder="$t('chart.line_symbol')" @change="changeBarSizeCase">
<el-option
v-for="item in lineSymbolOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('chart.line_symbol_size')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.lineSymbolSize" show-input :show-input-controls="false" input-size="mini" :min="0" :max="20" @change="changeBarSizeCase" />
</el-form-item>
<el-form-item :label="$t('chart.line_smooth')" class="form-item">
<el-checkbox v-model="sizeForm.lineSmooth" @change="changeBarSizeCase">{{ $t('chart.line_smooth') }}</el-checkbox>
</el-form-item>
<el-form-item :label="$t('chart.line_area')" class="form-item">
<el-checkbox v-model="sizeForm.lineArea" @change="changeBarSizeCase">{{ $t('chart.show') }}</el-checkbox>
</el-form-item>
<el-divider />
<el-form-item :label="$t('chart.bubble_symbol')" class="form-item">
<el-select v-model="sizeForm.scatterSymbol" :placeholder="$t('chart.line_symbol')" @change="changeBarSizeCase">
<el-option
v-for="item in lineSymbolOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('chart.bubble_size')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.scatterSymbolSize" show-input :show-input-controls="false" input-size="mini" :min="1" :max="40" @change="changeBarSizeCase" />
</el-form-item>
</el-form>
</el-col>
</div>
</template>
......@@ -268,4 +323,7 @@ export default {
.el-form-item{
margin-bottom: 6px;
}
.el-divider--horizontal {
margin: 10px 0
}
</style>
frontend/src/views/chart/view/ChartEdit.vue
浏览文件 @ bd361131
......@@ -168,13 +168,18 @@
<svg-icon icon-class="scatter" class="chart-icon" />
</span>
</el-radio>
<el-radio value="chart-mix" label="chart-mix">
<span :title="$t('chart.chart_mix')">
<svg-icon icon-class="chart-mix" class="chart-icon" />
</span>
</el-radio>
</div>
<div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
<el-radio value="map" label="map">
<span :title="$t('chart.chart_map')">
<svg-icon icon-class="map" class="chart-icon" />
</span>
</el-radio>
</div>
<div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
<el-radio value="radar" label="radar">
<span :title="$t('chart.chart_radar')">
<svg-icon icon-class="radar" class="chart-icon" />
......@@ -195,13 +200,13 @@
<svg-icon icon-class="pie-rose" class="chart-icon" />
</span>
</el-radio>
</div>
<div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
<el-radio value="funnel" label="funnel">
<span :title="$t('chart.chart_funnel')">
<svg-icon icon-class="funnel" class="chart-icon" />
</span>
</el-radio>
</div>
<div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
<el-radio value="treemap" label="treemap">
<span :title="$t('chart.chart_treemap')">
<svg-icon icon-class="treemap" class="chart-icon" />
......@@ -210,7 +215,6 @@
<el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
<el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
<el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
<el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
</div>
</el-radio-group>
</div>
......@@ -250,7 +254,7 @@
<el-row v-if="view.type !=='text' && view.type !== 'gauge'" class="padding-lr">
<span style="width: 80px;text-align: right;">
<span v-if="view.type && view.type.includes('table')">{{ $t('chart.drag_block_table_data_column') }}</span>
<span v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter'))">{{ $t('chart.drag_block_type_axis') }}</span>
<span v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix')">{{ $t('chart.drag_block_type_axis') }}</span>
<span v-else-if="view.type && view.type.includes('pie')">{{ $t('chart.drag_block_pie_label') }}</span>
<span v-else-if="view.type && view.type.includes('funnel')">{{ $t('chart.drag_block_funnel_split') }}</span>
<span v-else-if="view.type && view.type.includes('radar')">{{ $t('chart.drag_block_radar_label') }}</span>
......@@ -280,7 +284,7 @@
<el-row class="padding-lr" style="margin-top: 6px;">
<span style="width: 80px;text-align: right;">
<span v-if="view.type && view.type.includes('table')">{{ $t('chart.drag_block_table_data_column') }}</span>
<span v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter'))">{{ $t('chart.drag_block_value_axis') }}</span>
<span v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix')">{{ $t('chart.drag_block_value_axis') }}</span>
<span v-else-if="view.type && view.type.includes('pie')">{{ $t('chart.drag_block_pie_angel') }}</span>
<span v-else-if="view.type && view.type.includes('funnel')">{{ $t('chart.drag_block_funnel_width') }}</span>
<span v-else-if="view.type && view.type.includes('radar')">{{ $t('chart.drag_block_radar_length') }}</span>
......@@ -302,7 +306,7 @@
@update="save(true)"
>
<transition-group class="draggable-group">
<quota-item v-for="(item,index) in view.yaxis" :key="item.id" :param="param" :index="index" :item="item" @onQuotaItemChange="quotaItemChange" @onQuotaItemRemove="quotaItemRemove" @editItemFilter="showQuotaEditFilter" @onNameEdit="showRename" />
<quota-item v-for="(item,index) in view.yaxis" :key="item.id" :param="param" :index="index" :item="item" :chart="chart" @onQuotaItemChange="quotaItemChange" @onQuotaItemRemove="quotaItemRemove" @editItemFilter="showQuotaEditFilter" @onNameEdit="showRename" />
</transition-group>
</draggable>
<div v-if="!view.yaxis || view.yaxis.length === 0" class="drag-placeholder-style">
......@@ -453,10 +457,10 @@
<el-row>
<span class="padding-lr">{{ $t('chart.module_style') }}</span>
<el-collapse v-model="styleActiveNames" class="style-collapse">
<el-collapse-item v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter'))" name="xAxis" :title="$t('chart.xAxis')">
<el-collapse-item v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix')" name="xAxis" :title="$t('chart.xAxis')">
<x-axis-selector :param="param" class="attr-selector" :chart="chart" @onChangeXAxisForm="onChangeXAxisForm" />
</el-collapse-item>
<el-collapse-item v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter'))" name="yAxis" :title="$t('chart.yAxis')">
<el-collapse-item v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix')" name="yAxis" :title="$t('chart.yAxis')">
<y-axis-selector :param="param" class="attr-selector" :chart="chart" @onChangeYAxisForm="onChangeYAxisForm" />
</el-collapse-item>
<el-collapse-item v-show="view.type && view.type.includes('radar')" name="split" :title="$t('chart.split')">
......@@ -860,6 +864,9 @@ export default {
view.yaxis = [view.yaxis[0]]
}
view.yaxis.forEach(function(ele) {
if (!ele.chartType) {
ele.chartType = 'bar'
}
if (!ele.summary || ele.summary === '') {
if (ele.id === 'count' || ele.deType === 0 || ele.deType === 1) {
ele.summary = 'count'
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论