From 6859a6dd331e84f1c936f5115f50008dee8aa0a7 Mon Sep 17 00:00:00 2001 From: wisonic Date: Mon, 21 Oct 2024 17:22:01 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E5=9B=BE=E8=A1=A8):=20=E5=9C=A8=E7=BA=BF?= =?UTF-8?q?=E5=9C=B0=E5=9B=BE=E6=94=AF=E6=8C=81=E8=AE=BE=E7=BD=AE=E7=BC=A9?= =?UTF-8?q?=E6=94=BE=E5=92=8C=E4=B8=AD=E5=BF=83=E7=82=B9=20#10816?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- core/core-frontend/src/locales/zh-CN.ts | 4 +- .../src/models/chart/chart-attr.d.ts | 21 ++++++ .../components/BasicStyleSelector.vue | 68 +++++++++++++++++++ .../chart/components/editor/util/chart.ts | 8 ++- .../js/panel/charts/map/flow-map.ts | 23 ++++++- .../js/panel/charts/map/heat-map.ts | 22 +++++- .../js/panel/charts/map/symbolic-map.ts | 19 ++++-- 7 files changed, 153 insertions(+), 12 deletions(-) diff --git a/core/core-frontend/src/locales/zh-CN.ts b/core/core-frontend/src/locales/zh-CN.ts index 2b2965e464..3512c28a91 100644 --- a/core/core-frontend/src/locales/zh-CN.ts +++ b/core/core-frontend/src/locales/zh-CN.ts @@ -1540,7 +1540,9 @@ export default { tip: '提示', hide: '隐藏', show_label: '显示标签', - security_code: '安全密钥' + security_code: '安全密钥', + auto_fit: '自适应缩放', + zoom_level: '缩放等级' }, dataset: { scope_edit: '仅编辑时生效', diff --git a/core/core-frontend/src/models/chart/chart-attr.d.ts b/core/core-frontend/src/models/chart/chart-attr.d.ts index 9b488470c9..fbaa5b3c5b 100644 --- a/core/core-frontend/src/models/chart/chart-attr.d.ts +++ b/core/core-frontend/src/models/chart/chart-attr.d.ts @@ -297,6 +297,27 @@ declare interface ChartBasicStyle { * 显示标签 */ showLabel: boolean + /** + * 自适应缩放 + */ + autoFit: boolean + /** + * 地图中心点经纬度 + */ + mapCenter: { + /** + * 经度 + */ + longitude: number + /** + * 纬度 + */ + latitude: number + }, + /** + * 缩放等级 + */ + zoomLevel: number } /** * 表头属性 diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue index 6e44206cbe..2662019480 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue @@ -400,6 +400,7 @@ onMounted(() => { @@ -625,6 +626,73 @@ onMounted(() => { {{ t('chart.show_label') }} + + + {{ t('chart.auto_fit') }} + + +
+ + + + + + + + +
+ { ] propertyInner: EditorPropertyInner = { ...MAP_EDITOR_PROPERTY_INNER, - 'basic-style-selector': ['mapBaseStyle', 'mapLineStyle', 'zoom', 'showLabel'] + 'basic-style-selector': [ + 'mapBaseStyle', + 'mapLineStyle', + 'zoom', + 'showLabel', + 'autoFit', + 'mapCenter', + 'zoomLevel' + ] } axis: AxisType[] = ['xAxis', 'xAxisExt', 'filter', 'flowMapStartName', 'flowMapEndName', 'yAxis'] axisConfig: AxisConfig = { @@ -74,6 +83,13 @@ export class FlowMap extends L7ChartView { const xAxisExt = deepCopy(chart.xAxisExt) const { basicStyle, misc } = deepCopy(parseJson(chart.customAttr)) + let center: [number, number] = [ + DEFAULT_BASIC_STYLE.mapCenter.longitude, + DEFAULT_BASIC_STYLE.mapCenter.latitude + ] + if (basicStyle.autoFit === false) { + center = [basicStyle.mapCenter.longitude, basicStyle.mapCenter.latitude] + } let mapStyle = basicStyle.mapStyleUrl if (basicStyle.mapStyle !== 'custom') { mapStyle = `amap://styles/${basicStyle.mapStyle ? basicStyle.mapStyle : 'normal'}` @@ -87,7 +103,8 @@ export class FlowMap extends L7ChartView { token: mapKey?.key ?? undefined, style: mapStyle, pitch: misc.mapPitch, - zoom: 2.5, + center, + zoom: basicStyle.autoFit === false ? basicStyle.zoomLevel : 2.5, showLabel: !(basicStyle.showLabel === false) }) }) @@ -157,7 +174,7 @@ export class FlowMap extends L7ChartView { const config: L7Config = new LineLayer({ name: 'line', blend: 'normal', - autoFit: true + autoFit: !(basicStyle.autoFit === false) }) .source(data, { parser: { diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/map/heat-map.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/map/heat-map.ts index dcc656feeb..8f0b291e96 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/map/heat-map.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/map/heat-map.ts @@ -27,7 +27,15 @@ export class HeatMap extends L7ChartView { ] propertyInner: EditorPropertyInner = { ...MAP_EDITOR_PROPERTY_INNER, - 'basic-style-selector': ['colors', 'heatMapStyle', 'zoom', 'showLabel'] + 'basic-style-selector': [ + 'colors', + 'heatMapStyle', + 'zoom', + 'showLabel', + 'autoFit', + 'mapCenter', + 'zoomLevel' + ] } axis: AxisType[] = ['xAxis', 'yAxis', 'filter'] axisConfig: AxisConfig = { @@ -56,6 +64,13 @@ export class HeatMap extends L7ChartView { basicStyle = parseJson(chart.customAttr).basicStyle miscStyle = parseJson(chart.customAttr).misc } + let center: [number, number] = [ + DEFAULT_BASIC_STYLE.mapCenter.longitude, + DEFAULT_BASIC_STYLE.mapCenter.latitude + ] + if (basicStyle.autoFit === false) { + center = [basicStyle.mapCenter.longitude, basicStyle.mapCenter.latitude] + } let mapStyle = basicStyle.mapStyleUrl if (basicStyle.mapStyle !== 'custom') { mapStyle = `amap://styles/${basicStyle.mapStyle ? basicStyle.mapStyle : 'normal'}` @@ -69,7 +84,8 @@ export class HeatMap extends L7ChartView { token: mapKey?.key ?? undefined, style: mapStyle, pitch: miscStyle.mapPitch, - zoom: 2.5, + center, + zoom: basicStyle.autoFit === false ? basicStyle.zoomLevel : 2.5, showLabel: !(basicStyle.showLabel === false) }) }) @@ -83,7 +99,7 @@ export class HeatMap extends L7ChartView { const config: L7Config = new HeatmapLayer({ name: 'line', blend: 'normal', - autoFit: true + autoFit: !(basicStyle.autoFit === false) }) .source(chart.data?.data, { parser: { diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/map/symbolic-map.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/map/symbolic-map.ts index da3f993941..1387298d96 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/map/symbolic-map.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/map/symbolic-map.ts @@ -14,6 +14,7 @@ import { PointLayer } from '@antv/l7-layers' import { LayerPopup } from '@antv/l7' import { mapRendered, mapRendering } from '@/views/chart/components/js/panel/common/common_antv' import { configCarouselTooltip } from '@/views/chart/components/js/panel/charts/map/tooltip-carousel' +import { DEFAULT_BASIC_STYLE } from '@/views/chart/components/editor/util/chart' const { t } = useI18n() /** @@ -36,7 +37,10 @@ export class SymbolicMap extends L7ChartView { 'mapBaseStyle', 'symbolicMapStyle', 'zoom', - 'showLabel' + 'showLabel', + 'autoFit', + 'mapCenter', + 'zoomLevel' ], 'label-selector': ['color', 'fontSize', 'showFields', 'customContent'], 'tooltip-selector': [ @@ -90,6 +94,13 @@ export class SymbolicMap extends L7ChartView { mapStyle = `amap://styles/${basicStyle.mapStyle ? basicStyle.mapStyle : 'normal'}` } const mapKey = await this.getMapKey() + let center: [number, number] = [ + DEFAULT_BASIC_STYLE.mapCenter.longitude, + DEFAULT_BASIC_STYLE.mapCenter.latitude + ] + if (basicStyle.autoFit === false) { + center = [basicStyle.mapCenter.longitude, basicStyle.mapCenter.latitude] + } // 底层 const scene = new Scene({ id: container, @@ -98,8 +109,8 @@ export class SymbolicMap extends L7ChartView { token: mapKey?.key ?? undefined, style: mapStyle, pitch: miscStyle.mapPitch, - center: [104.434765, 38.256735], - zoom: 2.5, + center, + zoom: basicStyle.autoFit === false ? basicStyle.zoomLevel : 2.5, showLabel: !(basicStyle.showLabel === false) }) }) @@ -206,7 +217,7 @@ export class SymbolicMap extends L7ChartView { } }) : [] - const pointLayer = new PointLayer({ autoFit: true }) + const pointLayer = new PointLayer({ autoFit: !(basicStyle.autoFit === false) }) .source(data, { parser: { type: 'json',