From 0fd92c496b1b8b82364bbe8b39c2d5e895f958e3 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Thu, 24 Apr 2025 22:37:24 +0500 Subject: [PATCH 01/21] Improve Bar Chart --- .../src/comps/barChartComp/barChartComp.tsx | 10 ++--- .../comps/barChartComp/barChartConstants.tsx | 40 +++++++++++++++++-- .../chartConfigs/barChartConfig.tsx | 6 +-- 3 files changed, 45 insertions(+), 11 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/barChartComp/barChartComp.tsx b/client/packages/lowcoder-comps/src/comps/barChartComp/barChartComp.tsx index e13818586..d915dc534 100644 --- a/client/packages/lowcoder-comps/src/comps/barChartComp/barChartComp.tsx +++ b/client/packages/lowcoder-comps/src/comps/barChartComp/barChartComp.tsx @@ -304,17 +304,17 @@ let BarChartComp = withExposingConfigs(BarChartTmpComp, [ export const BarChartCompWithDefault = withDefault(BarChartComp, { - xAxisKey: "date", + xAxisKey: "month", series: [ { dataIndex: genRandomKey(), - seriesName: trans("chart.spending"), - columnName: "spending", + seriesName: "Sales", + columnName: "sales", }, { dataIndex: genRandomKey(), - seriesName: trans("chart.budget"), - columnName: "budget", + seriesName: "Target", + columnName: "target", }, ], }); diff --git a/client/packages/lowcoder-comps/src/comps/barChartComp/barChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/barChartComp/barChartConstants.tsx index 668b569be..98c419184 100644 --- a/client/packages/lowcoder-comps/src/comps/barChartComp/barChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/barChartComp/barChartConstants.tsx @@ -37,6 +37,40 @@ import { FunnelChartConfig } from "../basicChartComp/chartConfigs/funnelChartCon import {EchartsTitleVerticalConfig} from "../chartComp/chartConfigs/echartsTitleVerticalConfig"; import {EchartsTitleConfig} from "../basicChartComp/chartConfigs/echartsTitleConfig"; +// Enhanced default data for bar charts +export const barChartDefaultData = [ + { + month: "Jan", + sales: 1200, + target: 1000 + }, + { + month: "Feb", + sales: 1500, + target: 1200 + }, + { + month: "Mar", + sales: 1300, + target: 1400 + }, + { + month: "Apr", + sales: 1800, + target: 1500 + }, + { + month: "May", + sales: 1600, + target: 1700 + }, + { + month: "Jun", + sales: 2100, + target: 1900 + } +]; + export const ChartTypeOptions = [ { label: trans("chart.bar"), @@ -241,9 +275,9 @@ const EchartsOptionComp = withType(EchartsOptionMap, "funnel"); export type CharOptionCompType = keyof typeof ChartOptionMap; export const chartUiModeChildren = { - title: withDefault(StringControl, trans("echarts.defaultTitle")), - data: jsonControl(toJSONObjectArray, i18nObjs.defaultDataSource), - xAxisKey: valueComp(""), // x-axis, key from data + title: withDefault(StringControl, trans("barChart.defaultTitle")), + data: jsonControl(toJSONObjectArray, barChartDefaultData), + xAxisKey: valueComp("month"), // x-axis, key from data xAxisDirection: dropdownControl(XAxisDirectionOptions, "horizontal"), xAxisData: jsonControl(toArray, []), series: SeriesListComp, diff --git a/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConfigs/barChartConfig.tsx b/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConfigs/barChartConfig.tsx index ee1188335..dd7a36993 100644 --- a/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConfigs/barChartConfig.tsx +++ b/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConfigs/barChartConfig.tsx @@ -33,10 +33,10 @@ const BarTypeOptions = [ export const BarChartConfig = (function () { return new MultiCompBuilder( { - showLabel: BoolControl, + showLabel: withDefault(BoolControl, true), type: dropdownControl(BarTypeOptions, "basicBar"), - barWidth: withDefault(NumberControl, i18nObjs.defaultBarChartOption.barWidth), - showBackground: BoolControl, + barWidth: withDefault(NumberControl, 40), + showBackground: withDefault(BoolControl, false), backgroundColor: withDefault(ColorControl, i18nObjs.defaultBarChartOption.barBg), radiusAxisMax: NumberControl, polarRadiusStart: withDefault(StringControl, '30'), From ffcef3c07f79c9dafe0558f41ad4e6abc4fd346e Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Thu, 24 Apr 2025 23:37:51 +0500 Subject: [PATCH 02/21] Improve Line Chart --- .../src/comps/lineChartComp/lineChartComp.tsx | 8 ++++---- .../src/comps/lineChartComp/lineChartConstants.tsx | 14 +++++++++++--- .../lowcoder-comps/src/i18n/comps/locales/en.ts | 2 ++ 3 files changed, 17 insertions(+), 7 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartComp.tsx b/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartComp.tsx index be3e5bf65..1f1dfa150 100644 --- a/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartComp.tsx +++ b/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartComp.tsx @@ -302,13 +302,13 @@ export const LineChartCompWithDefault = withDefault(LineChartComp, { series: [ { dataIndex: genRandomKey(), - seriesName: trans("chart.spending"), - columnName: "spending", + seriesName: "Sales", + columnName: "sales", }, { dataIndex: genRandomKey(), - seriesName: trans("chart.budget"), - columnName: "budget", + seriesName: "Growth", + columnName: "growth", }, ], }); diff --git a/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartConstants.tsx index 2685f1972..5b0554dda 100644 --- a/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartConstants.tsx @@ -83,11 +83,19 @@ export const XAxisDirectionOptions = [ export type XAxisDirectionType = ValueFromOption; +export const defaultChartData = [ + { date: "Jan", sales: 320, growth: 250 }, + { date: "Feb", sales: 450, growth: 300 }, + { date: "Mar", sales: 380, growth: 340 }, + { date: "Apr", sales: 520, growth: 400 }, + { date: "May", sales: 480, growth: 450 }, + { date: "Jun", sales: 600, growth: 500 } +]; export const noDataAxisConfig = { animation: false, xAxis: { type: "category", - name: trans("chart.noData"), + name: "No Data Available", nameLocation: "middle", data: [], axisLine: { @@ -243,8 +251,8 @@ const EchartsOptionComp = withType(EchartsOptionMap, "funnel"); export type CharOptionCompType = keyof typeof ChartOptionMap; export const chartUiModeChildren = { - title: withDefault(StringControl, trans("echarts.defaultTitle")), - data: jsonControl(toJSONObjectArray, i18nObjs.defaultDataSource), + title: withDefault(StringControl, trans("lineChart.defaultTitle")), + data: jsonControl(toJSONObjectArray, defaultChartData), xAxisKey: valueComp(""), // x-axis, key from data xAxisDirection: dropdownControl(XAxisDirectionOptions, "horizontal"), xAxisData: jsonControl(toArray, []), diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts index 73c3d7d21..35a47a0aa 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts @@ -317,6 +317,8 @@ export const en = { }, lineChart: { + title: 'Title', + defaultTitle: 'Line Chart', cellSize: "Cell Size", range: "Range", markLines: "Mark Lines", From 6ee9d15d5912650e53bd8749cde7c05d859119f6 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 00:24:40 +0500 Subject: [PATCH 03/21] Improve Sankey Chart component data --- .../src/i18n/comps/locales/enObj.tsx | 24 +++++++++++-------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index b9d17e3c2..2194125a9 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -309,18 +309,22 @@ export const enObj: I18nObjects = { }, defaultSankeyChartOption: { data: [ - {name: "Category A", color: '#67F9D8'}, - {name: "Category B", color: '#FFE434'}, - {name: "Category C", color: '#56A3F1'}, - {name: "Category D", color: '#FF917C'}, - {name: "Category E", color: '#FF6347'} + {name: "Website Visits", color: '#3498db'}, + {name: "Product Page", color: '#2ecc71'}, + {name: "Cart", color: '#f39c12'}, + {name: "Checkout", color: '#e74c3c'}, + {name: "Purchase", color: '#9b59b6'}, + {name: "Abandoned", color: '#95a5a6'} ], links: [ - { source: 'Category A', target: 'Category B', value: 10 }, - { source: 'Category A', target: 'Category C', value: 15 }, - { source: 'Category B', target: 'Category D', value: 25 }, - { source: 'Category C', target: 'Category D', value: 20 }, - { source: 'Category D', target: 'Category E', value: 30 } + { source: 'Website Visits', target: 'Product Page', value: 1000 }, + { source: 'Website Visits', target: 'Abandoned', value: 300 }, + { source: 'Product Page', target: 'Cart', value: 700 }, + { source: 'Product Page', target: 'Abandoned', value: 300 }, + { source: 'Cart', target: 'Checkout', value: 400 }, + { source: 'Cart', target: 'Abandoned', value: 300 }, + { source: 'Checkout', target: 'Purchase', value: 350 }, + { source: 'Checkout', target: 'Abandoned', value: 50 } ] }, defaultCandleStickChartOption: { From d37822b68e5cc43c30d6a7292ad3b9a2d36494ba Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 00:45:04 +0500 Subject: [PATCH 04/21] Improve Tree Chart --- .../src/i18n/comps/locales/en.ts | 4 +- .../src/i18n/comps/locales/enObj.tsx | 65 +++++++++++++------ 2 files changed, 47 insertions(+), 22 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts index 35a47a0aa..14d8df31f 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts @@ -63,9 +63,9 @@ export const en = { title: 'Title', defaultTitle: 'Tree Chart', tooltip: 'Tooltip', - defaultLeft: "10", + defaultLeft: "20", left: "Left", - defaultRight: "10", + defaultRight: "20", right: "Right", defaultTop: "20", top: "Top", diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index 2194125a9..1b490fc9d 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -421,26 +421,51 @@ export const enObj: I18nObjects = { }, defaultTreeChartOption: { data: [{ - name: "Parent", - children: [ - { - name: "Child 1", - children: [ - { name: "Child 1-1" }, - { name: "Child 1-2" } - ] - }, - { - name: "Child 2", - children: [ - { name: "Child 2-1" }, - { name: "Child 2-2" } - ] - } - ] - }], - pointColor: "#380e81", - lineColor: "#1a93b8", + name: "Company Structure", + children: [ + { + name: "Executive", + children: [ + { name: "CEO", value: 1 }, + { name: "CFO", value: 1 }, + { name: "COO", value: 1 } + ] + }, + { + name: "Product", + children: [ + { name: "Engineering", value: 25 }, + { name: "Design", value: 10 }, + { name: "Product Management", value: 8 } + ] + }, + { + name: "Marketing", + children: [ + { name: "Social Media", value: 5 }, + { name: "Content", value: 7 }, + { name: "Analytics", value: 3 } + ] + } + ] + }], + pointColor: "#3498db", + lineColor: "#95a5a6", + label: { + show: true, + position: "right", + distance: 5, + fontSize: 12, + color: "#333" + }, + emphasis: { + focus: "descendant" + }, + expandAndCollapse: true, + initialTreeDepth: 2, + layout: "orthogonal", + orient: "horizontal", + symbolSize: 10 }, defaultTreemapChartOption: { data: [ From 672d40d870e6310191e931baf97da49ecd04eabd Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 01:13:49 +0500 Subject: [PATCH 05/21] Improve TreeMapChart Data --- .../src/i18n/comps/locales/enObj.tsx | 72 +++++++++++++------ 1 file changed, 51 insertions(+), 21 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index 1b490fc9d..e863a18dd 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -470,38 +470,68 @@ export const enObj: I18nObjects = { defaultTreemapChartOption: { data: [ { - name: 'Category A', - value: 100, + name: 'Company Budget', + value: 1000, children: [ { - name: 'Subcategory A1', - value: 70, + name: 'Product Development', + value: 400, + itemStyle: { color: '#3498db' }, children: [ - { name: 'Item A1-1', value: 10 }, - { name: 'Item A1-2', value: 20 }, - { name: 'Item A1-3', value: 10 }, - { name: 'Item A1-4', value: 30 } + { name: 'Engineering', value: 250, itemStyle: { color: '#3498db' } }, + { name: 'Design', value: 80, itemStyle: { color: '#5dade2' } }, + { name: 'Research', value: 70, itemStyle: { color: '#85c1e9' } } ] - } - ] - }, - { - name: 'Category B', - value: 80, - children: [ + }, + { + name: 'Marketing', + value: 300, + itemStyle: { color: '#2ecc71' }, + children: [ + { name: 'Digital Advertising', value: 150, itemStyle: { color: '#2ecc71' } }, + { name: 'Content Creation', value: 80, itemStyle: { color: '#58d68d' } }, + { name: 'Events', value: 70, itemStyle: { color: '#80e5a8' } } + ] + }, { - name: 'Subcategory B1', - value: 50, + name: 'Operations', + value: 200, + itemStyle: { color: '#e74c3c' }, children: [ - { name: 'Item B1-1', value: 20 }, - { name: 'Item B1-2', value: 15 }, - { name: 'Item B1-3', value: 15 } + { name: 'Office Space', value: 100, itemStyle: { color: '#e74c3c' } }, + { name: 'Equipment', value: 50, itemStyle: { color: '#ec7063' } }, + { name: 'Utilities', value: 50, itemStyle: { color: '#f1948a' } } ] }, + { + name: 'HR', + value: 100, + itemStyle: { color: '#9b59b6' }, + children: [ + { name: 'Recruiting', value: 30, itemStyle: { color: '#9b59b6' } }, + { name: 'Training', value: 40, itemStyle: { color: '#af7ac5' } }, + { name: 'Benefits', value: 30, itemStyle: { color: '#c39bd3' } } + ] + } ] } ], - color: ['#5470C6', '#91CC75', '#FAC858', '#6b51a1'] + label: { + show: true, + formatter: '{b}', + fontSize: 12, + color: '#333', + position: 'inside' + }, + itemStyle: { + borderColor: '#fff', + borderWidth: 1, + gapWidth: 1 + }, + breadcrumb: { + show: true + }, + roam: false }, defaultSunburstChartOption: { data: [ From 71a498e83e128f7f8c39b6b8fba222951372e568 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 01:21:36 +0500 Subject: [PATCH 06/21] Improve Sunburst Chart Data --- .../src/i18n/comps/locales/enObj.tsx | 81 ++++++++++++------- 1 file changed, 50 insertions(+), 31 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index e863a18dd..9b8c7afc8 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -535,48 +535,67 @@ export const enObj: I18nObjects = { }, defaultSunburstChartOption: { data: [ - { - name: "Grandparent", - children: [ - { - name: "Parent A", - children: [ - {name: "Child A1", value: 10}, - {name: "Child A2", value: 20} - ] - }, - { - name: "Parent B", - children: [ - {name: "Child B1", value: 15}, - {name: "Child B2", value: 25} - ] - } - ] - } + { + name: "Traffic", + children: [ + { + name: "Direct", + value: 350, + children: [ + {name: "New", value: 200}, + {name: "Return", value: 150} + ] + }, + { + name: "Social", + value: 300, + children: [ + {name: "FB", value: 120}, + {name: "IG", value: 100}, + {name: "TW", value: 80} + ] + }, + { + name: "Search", + value: 400, + children: [ + {name: "Google", value: 300}, + {name: "Bing", value: 100} + ] + } + ] + } ], levels: [ { itemStyle: { - color: '#f6e58d' - }, - }, - { - itemStyle: { - color: '#12e192' - }, + color: '#3498db', + borderWidth: 2, + borderColor: 'white' + } }, { itemStyle: { - color: '#ffbe76' - }, + color: '#2ecc71', + borderWidth: 1, + borderColor: 'white' + } }, { itemStyle: { - color: '#007979' - }, + color: '#e74c3c', + borderWidth: 1, + borderColor: 'white' + } } - ] + ], + label: { + show: true, + formatter: '{b}', + fontSize: 12, + color: 'white' + }, + radius: ['20%', '90%'] }, defaultCalendarChartOption: { data:[ From 55e43b280cffe6f3fb61664afc355851306e3bd4 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 18:56:13 +0500 Subject: [PATCH 07/21] Add label toggle in the TreeChart --- .../src/comps/treeChartComp/treeChartConstants.tsx | 1 + .../src/comps/treeChartComp/treeChartPropertyView.tsx | 4 ++++ .../lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts | 1 + client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts | 4 +++- 4 files changed, 9 insertions(+), 1 deletion(-) diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx index df9b573fc..7484f7ecf 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx @@ -273,6 +273,7 @@ let chartJsonModeChildren: any = { edgeShape: withDefault(BoolControl, true), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), + labelVisibility: withDefault(BoolControl, true), } if (RadarLabelStyle && EchartDefaultChartStyle && EchartDefaultTextStyle) { diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx index 56d851028..f4cc5ca43 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx @@ -29,6 +29,10 @@ export function treeChartPropertyView( {children.lineWidth.propertyView({ label: trans("treeChart.lineWidth"), tooltip: trans("treeChart.lineWidthTooltip") })} {children.tooltip.propertyView({label: trans("treeChart.tooltip")})} + {children.labelVisibility.propertyView({ + label: trans("treeChart.labelVisibility"), + tooltip: trans("echarts.labelVisibilityTooltip") + })}
diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts index 083b18103..821f5e682 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts @@ -163,6 +163,7 @@ export function getEchartsConfig( symbolSize: props?.pointSize || 20, // Control the size of the nodes data: props?.echartsData.length !== 0 && props?.echartsData || props.echartsOption.data, label: { + show: props?.labelVisibility, position: "top", verticalAlign: "middle", align: "right", diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts index 14d8df31f..e21154bbc 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts @@ -76,7 +76,9 @@ export const en = { pointSizeTooltip: "Set the Point Size of the Chart.", defaultlineWidth: '2', lineWidth: "Line Width", - lineWidthTooltip: "Set the Line Width of the Chart." + lineWidthTooltip: "Set the Line Width of the Chart.", + labelVisibility: "Label", + labelVisibilityTooltip: "Show or hide the Label of the Chart." }, graphChart: { categories: 'Categories', From 6f26f02a47d1fd54149446c3b7ab2761547258a1 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 19:03:01 +0500 Subject: [PATCH 08/21] Add label toggle functionality for TreeMap Chart --- .../src/comps/treemapChartComp/treemapChartUtils.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts index f07d91852..d1406d242 100644 --- a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts @@ -171,6 +171,7 @@ export function getEchartsConfig( ...chartStyleWrapper(props?.chartStyle, theme?.chartStyle) }, label: { + show: props?.labelVisibility, ...styleWrapper(props?.detailStyle, theme?.detailStyle, 12), } } From 5a6a55f434e4de2ce54ee592383e850792b65397 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 19:10:22 +0500 Subject: [PATCH 09/21] Improve CandleChart Data --- .../src/i18n/comps/locales/enObj.tsx | 35 ++++++++++++------- 1 file changed, 22 insertions(+), 13 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index 9b8c7afc8..228ffdee4 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -329,21 +329,30 @@ export const enObj: I18nObjects = { }, defaultCandleStickChartOption: { xAxis: { - data: ["Day 1", "Day 2", "Day 3", "Day 4", "Day 5"], - }, - axisColor: ['#f0f0f0', '#ffffff'], - data:[ - [22, 25, 18, 26], - [25, 23, 22, 27], - [23, 24, 21, 25], - [24, 26, 23, 27], - [23, 21, 20, 25] + data: [ + "2024-03-01", "2024-03-04", "2024-03-05", "2024-03-06", "2024-03-07", + "2024-03-08", "2024-03-11", "2024-03-12", "2024-03-13", "2024-03-14" ], + }, + axisColor: ['#E9EBF1', '#ffffff'], + data: [ + // Format: [open, close, lowest, highest] + [185.43, 188.52, 184.74, 189.12], // Bullish day + [188.32, 186.85, 186.21, 189.95], // Bearish day + [186.90, 187.65, 185.83, 188.12], // Small bullish day + [187.75, 185.20, 184.90, 187.85], // Bearish day + [185.35, 189.20, 185.15, 189.45], // Strong bullish day + [189.10, 187.50, 186.80, 189.30], // Bearish day + [187.60, 190.25, 187.40, 190.50], // Strong bullish day + [190.15, 189.75, 188.90, 191.20], // Small bearish day + [189.80, 192.35, 189.60, 192.50], // Strong bullish day + [192.40, 191.85, 191.20, 193.15] // Small bearish day + ], itemStyle: { - color: '#ec0000', // Body color (rising) - color0: '#00da3c', // Body color (falling) - borderColor: '#ec0000', // Border color (rising) - borderColor0: '#00da3c', // Border color (falling) + color: '#26A69A', // Bullish candle color (green) + color0: '#EF5350', // Bearish candle color (red) + borderColor: '#26A69A', // Bullish border color + borderColor0: '#EF5350' // Bearish border color } }, defaultRadarChartOption: { From ce78c151a064e45672603d363dc83fbf857d1119 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 19:29:10 +0500 Subject: [PATCH 10/21] Improve Pie Chart Data --- .../comps/pieChartComp/pieChartConstants.tsx | 39 ++++++++++++++++++- 1 file changed, 37 insertions(+), 2 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartConstants.tsx index 62e5be971..f8212e74c 100644 --- a/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartConstants.tsx @@ -82,6 +82,41 @@ export const XAxisDirectionOptions = [ export type XAxisDirectionType = ValueFromOption; +// Add this new code block: +// Realistic pie chart demo data with proper categories and values +export const defaultPieChartData = [ + { + category: "Market Share", + name: "Samsung", + value: 21.8 + }, + { + category: "Market Share", + name: "Apple", + value: 20.5 + }, + { + category: "Market Share", + name: "Xiaomi", + value: 13.4 + }, + { + category: "Market Share", + name: "Oppo", + value: 8.8 + }, + { + category: "Market Share", + name: "Vivo", + value: 8.1 + }, + { + category: "Market Share", + name: "Others", + value: 27.4 + } +]; + export const noDataAxisConfig = { animation: false, xAxis: { @@ -241,8 +276,8 @@ export type CharOptionCompType = keyof typeof ChartOptionMap; export const chartUiModeChildren = { title: withDefault(StringControl, trans("echarts.defaultTitle")), - data: jsonControl(toJSONObjectArray, i18nObjs.defaultDataSource), - xAxisKey: valueComp(""), // x-axis, key from data + data: jsonControl(toJSONObjectArray, defaultPieChartData), + xAxisKey: valueComp("name"), xAxisDirection: dropdownControl(XAxisDirectionOptions, "horizontal"), xAxisData: jsonControl(toArray, []), series: SeriesListComp, From f81f755faf826fd8cb45d75942180aa74a3c41eb Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 19:46:45 +0500 Subject: [PATCH 11/21] Improve Mermaid Chart Data --- .../src/comps/mermaidComp/index.tsx | 91 ++++++++++++++++++- 1 file changed, 89 insertions(+), 2 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/mermaidComp/index.tsx b/client/packages/lowcoder-comps/src/comps/mermaidComp/index.tsx index 09ea5cba8..ea143725c 100644 --- a/client/packages/lowcoder-comps/src/comps/mermaidComp/index.tsx +++ b/client/packages/lowcoder-comps/src/comps/mermaidComp/index.tsx @@ -10,11 +10,98 @@ import { import Mermaid from "./mermaid"; +// Collection of example mermaid diagrams that showcase different diagram types +const mermaidExamples = { + flowchart: +`flowchart TD + A[Start] --> B{Is it working?} + B -->|Yes| C[Great!] + B -->|No| D[Debug] + D --> E[Check Documentation] + E --> B + C --> F[Deploy]`, + + sequence: +`sequenceDiagram + participant User + participant App + participant API + participant DB + + User->>App: Submit Form + App->>API: Send Request + API->>DB: Query Data + DB->>API: Return Result + API->>App: Send Response + App->>User: Show Result`, + + classDiagram: +`classDiagram + class User { + +String name + +String email + +authenticate() + +updateProfile() + } + class Product { + +String name + +Number price + +getDetails() + } + class Order { + +Date date + +Number total + +process() + } + User "1" --> "*" Order + Order "*" --> "*" Product`, + + gantt: +`gantt + title Project Timeline + dateFormat YYYY-MM-DD + + section Planning + Research :done, a1, 2023-01-01, 10d + Requirements :active, a2, after a1, 7d + + section Development + Design :a3, after a2, 8d + Implementation :a4, after a3, 14d + Testing :a5, after a4, 7d + + section Deployment + Release :milestone, after a5, 0d`, + + entityRelationship: +`erDiagram + CUSTOMER }|--o{ ORDER : places + ORDER ||--|{ ORDER_ITEM : contains + CUSTOMER ||--o{ PAYMENT : makes + PRODUCT ||--|{ ORDER_ITEM : "ordered in"`, + + journey: +`journey + title User Purchase Journey + section Visit Website + Homepage: 5: User + Product listing: 4: User + Product detail: 3: User + section Purchase + Add to cart: 4: User + Checkout: 3: User, Admin + Payment: 3: User, Admin + section Post-Purchase + Order confirmation: 5: User, Admin + Shipping: 4: Admin + Delivery: 5: User, Admin` +}; + +// Using the flowchart example as default const childrenMap = { code: stringExposingStateControl( "code", - `graph LR - Start --> Stop` + mermaidExamples.flowchart ), onEvent: eventHandlerControl([ { From 88a3454d5450e5902398a5a34a907f097859950f Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 20:36:28 +0500 Subject: [PATCH 12/21] Improve ThemeRiver Component --- .../src/i18n/comps/locales/enObj.tsx | 45 ++++++++++--------- 1 file changed, 24 insertions(+), 21 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index 228ffdee4..e014a85f4 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -623,28 +623,31 @@ export const enObj: I18nObjects = { }, defaultThemeriverChartOption: { data: [ - ['2025-01-01', 12, 'Product A'], - ['2025-01-01', 10, 'Product B'], - ['2025-01-01', 15, 'Product C'], - ['2025-01-01', 8, 'Product D'], - ['2025-01-02', 14, 'Product A'], - ['2025-01-02', 9, 'Product B'], - ['2025-01-02', 16, 'Product C'], - ['2025-01-02', 7, 'Product D'], - ['2025-01-03', 16, 'Product A'], - ['2025-01-03', 12, 'Product B'], - ['2025-01-03', 18, 'Product C'], - ['2025-01-03', 10, 'Product D'], - ['2025-01-04', 20, 'Product A'], - ['2025-01-04', 15, 'Product B'], - ['2025-01-04', 22, 'Product C'], - ['2025-01-04', 12, 'Product D'], - ['2025-01-05', 18, 'Product A'], - ['2025-01-05', 13, 'Product B'], - ['2025-01-05', 20, 'Product C'], - ['2025-01-05', 11, 'Product D'] + // Technology sector data - January to December + ['2024-01', 125, 'Smartphones'], + ['2024-02', 138, 'Smartphones'], + ['2024-03', 152, 'Smartphones'], + ['2024-04', 167, 'Smartphones'], + + ['2024-01', 95, 'Laptops'], + ['2024-02', 110, 'Laptops'], + ['2024-03', 125, 'Laptops'], + ['2024-04', 120, 'Laptops'], + + ['2024-01', 55, 'Tablets'], + ['2024-02', 60, 'Tablets'], + ['2024-03', 65, 'Tablets'], + ['2024-04', 72, 'Tablets'], + + ['2024-01', 30, 'Wearables'], + ['2024-02', 42, 'Wearables'], + ['2024-03', 55, 'Wearables'], + ['2024-04', 68, 'Wearables'], + + + ], - color: ['#5470C6', '#91CC75', '#FAC858', '#6b51a1'] + color: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4'] }, defaultMapJsonOption: defaultMapData, From 6e62f3dcbbd5c24638c4d6e99b48df60ac3a0354 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 20:53:58 +0500 Subject: [PATCH 13/21] Improve Radar Chart Data --- .../src/i18n/comps/locales/enObj.tsx | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index e014a85f4..f0bdb4ca7 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -358,21 +358,21 @@ export const enObj: I18nObjects = { defaultRadarChartOption: { color: ['#6ee1d5', '#a7dd85'], indicator: [ - { name: "Indicator 1", max: 100 }, - { name: "Indicator 2", max: 100 }, - { name: "Indicator 3", max: 100 }, - { name: "Indicator 4", max: 100 }, - { name: "Indicator 5", max: 100 }, - { name: "Indicator 6", max: 100 } + { name: "Performance", max: 100 }, + { name: "Reliability", max: 100 }, + { name: "Efficiency", max: 100 }, + { name: "User Satisfaction", max: 100 }, + { name: "Cost Effectiveness", max: 100 }, + { name: "Scalability", max: 100 } ], series: [ { - "name": "Data A", - "value": [90, 80, 70, 70, 80, 70], + "name": "Current System", + "value": [85, 72, 78, 65, 82, 68], }, { - name: "Data B", - value: [60, 60, 40, 50, 50, 40], + name: "Competitor System", + value: [67, 82, 58, 73, 45, 79], areaColor: '#ff00ff77', lineColor: '#ff00ff77', lineWidth: 2, From 4e4280fad13a3b4f41c63301663c2e3b23f7a359 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 22:08:05 +0500 Subject: [PATCH 14/21] Improve ScatterChart Data --- .../scatterChartConstants.tsx | 27 ++++++++++++++++++- 1 file changed, 26 insertions(+), 1 deletion(-) diff --git a/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartConstants.tsx index 02c8f803f..c846eeaab 100644 --- a/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartConstants.tsx @@ -217,9 +217,34 @@ const ChartOptionComp = withType(ChartOptionMap, "scatter"); const EchartsOptionComp = withType(EchartsOptionMap, "funnel"); export type CharOptionCompType = keyof typeof ChartOptionMap; +export const SCATTER_CHART_DEMO_DATA = [ + + { hours: 1.5, score: 62, student: "Alex M." }, + { hours: 2.0, score: 65, student: "Sarah P." }, + { hours: 2.5, score: 71, student: "James W." }, + { hours: 2.8, score: 69, student: "Emma L." }, + { hours: 3.0, score: 75, student: "Michael R." }, + { hours: 3.2, score: 73, student: "Lisa K." }, + { hours: 3.5, score: 78, student: "David H." }, + { hours: 3.8, score: 77, student: "Sophie T." }, + { hours: 4.0, score: 82, student: "Ryan B." }, + { hours: 4.2, score: 84, student: "Nina C." }, + { hours: 4.5, score: 86, student: "Thomas G." }, + { hours: 4.8, score: 88, student: "Maria S." }, + { hours: 5.0, score: 89, student: "Daniel F." }, + { hours: 5.2, score: 91, student: "Anna D." }, + { hours: 5.5, score: 90, student: "Kevin P." }, + { hours: 5.8, score: 93, student: "Rachel M." }, + { hours: 6.0, score: 95, student: "John L." }, + { hours: 6.2, score: 94, student: "Emily W." }, + { hours: 3.0, score: 68, student: "Chris B." }, // outlier - lower performance + { hours: 5.0, score: 96, student: "Jessica H." } // outlier - higher performance + +] + export const chartUiModeChildren = { title: withDefault(StringControl, trans("echarts.defaultTitle")), - data: jsonControl(toJSONObjectArray, i18nObjs.defaultDataSource), + data: jsonControl(toJSONObjectArray, SCATTER_CHART_DEMO_DATA), xAxisKey: valueComp(""), // x-axis, key from data xAxisDirection: dropdownControl(XAxisDirectionOptions, "horizontal"), xAxisData: jsonControl(toArray, []), From d071fc9d80494493d3c9eea5d5063b1aa6b197fa Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Fri, 25 Apr 2025 22:19:44 +0500 Subject: [PATCH 15/21] Improve GraphChart Data --- .../src/i18n/comps/locales/enObj.tsx | 38 ++++++++++--------- 1 file changed, 21 insertions(+), 17 deletions(-) diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx index f0bdb4ca7..df8517fbc 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/enObj.tsx @@ -410,23 +410,27 @@ export const enObj: I18nObjects = { ] }, defaultGraphChartOption: { - color:{ - pointColor: "#0000ff", - lineColor: "#00000033" - }, - categories: [ - {name: "Nodes"}, - {name: "Edges"} - ], - nodes: [ - {name: "Node 1", category: 0}, - {name: "Node 2", category: 0}, - {name: "Node 3", category: 0} - ], - links: [ - {source: "Node 1", target: "Node 2", category: 1}, - {source: "Node 2", target: "Node 3", category: 1} - ] + color: { + pointColor: "#4285F4", + lineColor: "#00000045" + }, + categories: [ + {name: "Person", itemStyle: {color: "#4285F4"}}, + {name: "Company", itemStyle: {color: "#34A853"}}, + {name: "Project", itemStyle: {color: "#EA4335"}} + ], + nodes: [ + {id: "1", name: "John Smith", value: 25, category: 0, symbolSize: 25}, + {id: "2", name: "Jane Doe", value: 20, category: 0, symbolSize: 20}, + {id: "3", name: "Acme Inc", value: 30, category: 1, symbolSize: 30}, + {id: "4", name: "Project X", value: 25, category: 2, symbolSize: 25} + ], + links: [ + {source: "1", target: "3", value: 8, lineStyle: {width: 2}}, + {source: "1", target: "4", value: 6, lineStyle: {width: 2}}, + {source: "2", target: "3", value: 5, lineStyle: {width: 1}}, + {source: "3", target: "4", value: 9, lineStyle: {width: 3}} + ] }, defaultTreeChartOption: { data: [{ From 81bd036327a44cb3304080e50c733872fbc0de1a Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Mon, 28 Apr 2025 18:16:43 +0500 Subject: [PATCH 16/21] add sankey chart labels --- .../src/comps/sankeyChartComp/sankeyChartConstants.tsx | 1 + .../src/comps/sankeyChartComp/sankeyChartPropertyView.tsx | 4 ++++ .../src/comps/sankeyChartComp/sankeyChartUtils.ts | 2 +- client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts | 2 ++ 4 files changed, 8 insertions(+), 1 deletion(-) diff --git a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx index e863c1b20..e38b5a131 100644 --- a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx @@ -277,6 +277,7 @@ let chartJsonModeChildren: any = { focus: withDefault(BoolControl, true), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), + labelVisibility: withDefault(BoolControl, true), } if (EchartDefaultChartStyle && EchartDefaultTextStyle && RadarLabelStyle && SankeyLineStyle) { diff --git a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx index 683f97c3f..396217531 100644 --- a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx @@ -36,6 +36,10 @@ export function sankeyChartPropertyView( {children.draggable.propertyView({label: trans("sankeyChart.draggable"), tooltip: trans("sankeyChart.draggableTooltip")})} {children.focus.propertyView({label: trans("sankeyChart.focus"), tooltip: trans("sankeyChart.focusTooltip")})} {children.tooltip.propertyView({label: trans("sankeyChart.tooltip"), tooltip: trans("echarts.tooltipTooltip")})} + {children.labelVisibility.propertyView({ + label: trans("treeChart.labelVisibility"), + tooltip: trans("echarts.labelVisibilityTooltip") + })}
diff --git a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts index 1cedb74c8..4a284bf08 100644 --- a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts @@ -162,7 +162,7 @@ export function getEchartsConfig( bottom: `${props?.bottom}%`, top: `${props?.top}%`, label: { - show: true, + show: props.labelVisibility, position: props.echartsLabelConfig.top, ...styleWrapper(props?.detailStyle, theme?.detailStyle,15) }, diff --git a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts index e21154bbc..66b62f7a1 100644 --- a/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts +++ b/client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts @@ -216,6 +216,8 @@ export const en = { defaultTop:'15', bottom: 'Bottom', defaultBottom:'10', + labelVisibility: "Label", + labelVisibilityTooltip: "Show or hide the Label of the Chart." }, funnelChart: { title: 'Title', From 4d378da63c64688c3624f5d8315936909a15a23a Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Tue, 29 Apr 2025 16:16:54 +0500 Subject: [PATCH 17/21] fix label issue for TreeChart --- .../lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts index 821f5e682..48a2063e4 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts @@ -167,13 +167,14 @@ export function getEchartsConfig( position: "top", verticalAlign: "middle", align: "right", - ...styleWrapper(props?.detailStyle, theme?.detailStyle, 11), + // ...styleWrapper(props?.detailStyle, theme?.detailStyle, 11), }, leaves: { label: { position: "bottom", verticalAlign: "middle", align: "left" + // ...styleWrapper(props?.detailStyle, theme?.detailStyle, 11), } }, itemStyle: { From c6f8f1db3e676e045d6a9d880e2b879f7bb5580f Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Tue, 29 Apr 2025 16:22:26 +0500 Subject: [PATCH 18/21] Fix labels issue with sunburst and Treemapchart --- .../src/comps/sunburstChartComp/sunburstChartUtils.ts | 1 - .../src/comps/treemapChartComp/treemapChartUtils.ts | 1 - 2 files changed, 2 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartUtils.ts b/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartUtils.ts index ab8aa17b5..52ca2aa4c 100644 --- a/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartUtils.ts @@ -168,7 +168,6 @@ export function getEchartsConfig( label: { show: props?.labelVisibility, rotate: 'tangential', - ...styleWrapper(props?.detailStyle, theme?.detailStyle,11) }, } ], diff --git a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts index d1406d242..02d63c853 100644 --- a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartUtils.ts @@ -172,7 +172,6 @@ export function getEchartsConfig( }, label: { show: props?.labelVisibility, - ...styleWrapper(props?.detailStyle, theme?.detailStyle, 12), } } ] From 4305b76865ac82c3aa868a0ae4b43a083d5f9829 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Tue, 29 Apr 2025 18:40:30 +0500 Subject: [PATCH 19/21] Fix labels for Sankey and Radar chart --- .../lowcoder-comps/src/comps/radarChartComp/radarChartUtils.ts | 1 - .../lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts | 1 - 2 files changed, 2 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartUtils.ts b/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartUtils.ts index 1982cf9b4..87cecc24c 100644 --- a/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartUtils.ts @@ -177,7 +177,6 @@ export function getEchartsConfig( radius: `${props.radius}%`, shape: props?.areaFlag ? 'circle' : 'line', axisName: { - ...styleWrapper(props?.detailStyle, theme?.detailStyle, 13), show: props?.indicatorVisibility, }, splitArea: { diff --git a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts index 4a284bf08..69ac87ee3 100644 --- a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartUtils.ts @@ -164,7 +164,6 @@ export function getEchartsConfig( label: { show: props.labelVisibility, position: props.echartsLabelConfig.top, - ...styleWrapper(props?.detailStyle, theme?.detailStyle,15) }, data: props?.echartsData.length !== 0 && props?.echartsData?.map(item => ({ name: item.name, From 35234ec12391f35795ec3ea4da60a8c7778e136f Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Tue, 29 Apr 2025 18:50:57 +0500 Subject: [PATCH 20/21] Make TreeChart Leaf nodes center aligned --- .../lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts index 48a2063e4..d6f545b06 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartUtils.ts @@ -167,14 +167,13 @@ export function getEchartsConfig( position: "top", verticalAlign: "middle", align: "right", - // ...styleWrapper(props?.detailStyle, theme?.detailStyle, 11), }, leaves: { label: { - position: "bottom", + show: props?.labelVisibility, + position: "right", verticalAlign: "middle", align: "left" - // ...styleWrapper(props?.detailStyle, theme?.detailStyle, 11), } }, itemStyle: { From 3533ef9bebadad97d5dbcac25996fee151b3b0c9 Mon Sep 17 00:00:00 2001 From: Faran Javed Date: Tue, 29 Apr 2025 22:41:41 +0500 Subject: [PATCH 21/21] remove console logs --- .../lowcoder-comps/src/comps/line3dChartComp/line3dChartUtils.ts | 1 - .../src/comps/parallelChartComp/parallelChartUtils.ts | 1 - .../lowcoder-comps/src/comps/pieChartComp/pieChartUtils.ts | 1 - .../src/comps/scatterChartComp/scatterChartUtils.ts | 1 - 4 files changed, 4 deletions(-) diff --git a/client/packages/lowcoder-comps/src/comps/line3dChartComp/line3dChartUtils.ts b/client/packages/lowcoder-comps/src/comps/line3dChartComp/line3dChartUtils.ts index d1be05edf..3ba5858a1 100644 --- a/client/packages/lowcoder-comps/src/comps/line3dChartComp/line3dChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/line3dChartComp/line3dChartUtils.ts @@ -178,7 +178,6 @@ export function getEchartsConfig( }, } }; - console.log(config); return config; } diff --git a/client/packages/lowcoder-comps/src/comps/parallelChartComp/parallelChartUtils.ts b/client/packages/lowcoder-comps/src/comps/parallelChartComp/parallelChartUtils.ts index 407a2df69..0f7835bb0 100644 --- a/client/packages/lowcoder-comps/src/comps/parallelChartComp/parallelChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/parallelChartComp/parallelChartUtils.ts @@ -180,7 +180,6 @@ export function getEchartsConfig( parallelAxis: props.data[0].map((c, i) => ({ dim: i, name: c, type: typeof props.data[1][i] === 'string'?'category':'value'})) }; - console.log("Echarts transformedData and config", transformedData, config); return config; } diff --git a/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartUtils.ts b/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartUtils.ts index cf3b6a664..545393339 100644 --- a/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartUtils.ts @@ -280,7 +280,6 @@ export function getEchartsConfig( ] } - console.log("Echarts transformedData and config", transformedData, config); return config; } diff --git a/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartUtils.ts b/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartUtils.ts index 67b2a4a53..f5e9bdd4b 100644 --- a/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartUtils.ts +++ b/client/packages/lowcoder-comps/src/comps/scatterChartComp/scatterChartUtils.ts @@ -293,7 +293,6 @@ export function getEchartsConfig( delete config.yAxis; } - console.log("Echarts transformedData and config", transformedData, config); return config; }