step line

Author: Imiss-U1025

client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartPropertyView.tsx

@@ -27,7 +27,7 @@ export function lineChartPropertyView(
     <>
       <Section name={trans("chart.data")}>
         {children.chartConfig.getPropertyView()}
-        {children.animationDuration.propertyView({label: "lineChart.animationDuration"})}
+        {children.animationDuration.propertyView({label: trans("lineChart.animationDuration")})}
         <Dropdown
           value={children.xAxisKey.getView()}
           options={columnOptions}

client/packages/lowcoder-comps/src/comps/lineChartComp/lineChartUtils.ts

@@ -119,6 +119,7 @@ export function getSeriesConfig(props: EchartsConfigProps) {
             borderColor: "#000",
           },
         },
+        step: s.getView().step,
         encode: {
           x: encodeX,
           y: encodeY,

client/packages/lowcoder-comps/src/comps/lineChartComp/seriesComp.tsx

@@ -57,6 +57,25 @@ export const MarkLineTypeOptions = [
   },
 ] as const;
 
+export const StepOptions = [
+  {
+    label: trans("lineChart.none"),
+    value: "",
+  },
+  {
+    label: trans("lineChart.start"),
+    value: "start",
+  },
+  {
+    label: trans("lineChart.middle"),
+    value: "middle",
+  },
+  {
+    label: trans("lineChart.end"),
+    value: "end",
+  },
+] as const;
+
 const valToLabel = (val) => MarkLineTypeOptions.find(o => o.value === val)?.label || "";
 const markLinesChildrenMap = {
   type: dropdownControl(MarkLineTypeOptions, "max"),
@@ -104,6 +123,7 @@ const seriesChildrenMap = {
   hide: BoolControl,
   // unique key, for sort
   dataIndex: valueComp<string>(""),
+  step: dropdownControl(StepOptions, ""),
 };
 
 const SeriesTmpComp = new MultiCompBuilder(seriesChildrenMap, (props) => {
@@ -129,6 +149,9 @@ class SeriesComp extends SeriesTmpComp {
             this.children.columnName.dispatchChangeValueAction(value);
           }}
         />
+        {this.children.step.propertyView({
+          label: trans("lineChart.step"),
+        })}
         <Option
           items={this.children.markLines.getView()}
           title={trans("lineChart.markLines")}

client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts

@@ -331,6 +331,12 @@ export const en = {
     showEndLabel: "End Label",
     symbol: "Symbol",
     symbolSize: "Symbol Size",
+    animationDuration: "Animation Duration",
+    none: "None",
+    start: "Start",
+    middle: "Middle",
+    end: "End",
+    step: "Step",
   },
   barChart: {
     title: 'Title',