From 67b4d5a2605ba8a71df7582225f1bde60acf0493 Mon Sep 17 00:00:00 2001 From: see2ever Date: Wed, 20 Jul 2022 01:38:07 +0800 Subject: [PATCH 1/3] feat: add dashed highlight set --- .../wuxudong/rncharts/utils/ChartDataSetConfigUtils.java | 4 ++++ docs.md | 4 ++++ ios/ReactNativeCharts/utils/ChartDataSetConfigUtils.swift | 4 ++++ lib/ChartDataSetConfig.js | 6 +++++- 4 files changed, 17 insertions(+), 1 deletion(-) diff --git a/android/src/main/java/com/github/wuxudong/rncharts/utils/ChartDataSetConfigUtils.java b/android/src/main/java/com/github/wuxudong/rncharts/utils/ChartDataSetConfigUtils.java index 0a9bc4ca8..de32870b8 100644 --- a/android/src/main/java/com/github/wuxudong/rncharts/utils/ChartDataSetConfigUtils.java +++ b/android/src/main/java/com/github/wuxudong/rncharts/utils/ChartDataSetConfigUtils.java @@ -134,6 +134,10 @@ public static void commonLineScatterCandleRadarConfig(LineScatterCandleRadarData if (BridgeUtils.validate(config, ReadableType.Number, "highlightLineWidth")) { dataSet.setHighlightLineWidth((float) config.getDouble("highlightLineWidth")); } + if (BridgeUtils.validate(config, ReadableType.Array, "dashedHighlightLine")) { + float[] args = BridgeUtils.convertToFloatArray(config.getArray("dashedHighlightLine")); + dataSet.enableDashedHighlightLine(args[0], args[1], args[2]); + } } public static void commonLineRadarConfig(LineRadarDataSet dataSet, ReadableMap config) { diff --git a/docs.md b/docs.md index 084705494..e6a5f60d5 100644 --- a/docs.md +++ b/docs.md @@ -272,6 +272,10 @@ type lineScatterCandleRadar { drawVerticalHighlightIndicator: bool, drawHorizontalHighlightIndicator: bool, highlightLineWidth: number + // draw Charts(ios) dashed highlight + highlightLineDashLengths: [number], + // draw MPAndroidChart(android) dashed highlight + dashedHighlightLine: [number] } ``` diff --git a/ios/ReactNativeCharts/utils/ChartDataSetConfigUtils.swift b/ios/ReactNativeCharts/utils/ChartDataSetConfigUtils.swift index dcb7845dd..a8d695e19 100644 --- a/ios/ReactNativeCharts/utils/ChartDataSetConfigUtils.swift +++ b/ios/ReactNativeCharts/utils/ChartDataSetConfigUtils.swift @@ -109,6 +109,10 @@ class ChartDataSetConfigUtils: NSObject { if config["highlightLineWidth"].float != nil { dataSet.highlightLineWidth = CGFloat(config["highlightLineWidth"].floatValue); } + + if config["highlightLineDashLengths"].arrayObject != nil { + dataSet.highlightLineDashLengths = config["highlightLineDashLengths"].arrayObject as? [CGFloat]; + } } static func commonLineRadarConfig( _ dataSet:LineRadarChartDataSet, config:JSON) { diff --git a/lib/ChartDataSetConfig.js b/lib/ChartDataSetConfig.js index 304399cb2..3638184f4 100644 --- a/lib/ChartDataSetConfig.js +++ b/lib/ChartDataSetConfig.js @@ -34,7 +34,11 @@ const chartDataSetConfig = { lineScatterCandleRadar: { drawVerticalHighlightIndicator: PropTypes.bool, drawHorizontalHighlightIndicator: PropTypes.bool, - highlightLineWidth: PropTypes.number + highlightLineWidth: PropTypes.number, + // draw Charts(ios) dashed highlight + highlightLineDashLengths: PropTypes.arrayOf(PropTypes.number), + // draw MPAndroidChart(android) dashed highlight + dashedHighlightLine: PropTypes.arrayOf(PropTypes.number) }, lineRadar: { From d02122845a0df168787ae92b66bd2fd5deed40d2 Mon Sep 17 00:00:00 2001 From: see2ever Date: Fri, 22 Jul 2022 16:28:35 +0800 Subject: [PATCH 2/3] feat(marker): enable android circle marker color/size change --- .../rncharts/charts/ChartBaseManager.java | 18 +++++++-- .../rncharts/markers/RNCircleMarkerView.java | 38 ++++++++++++++++++- android/src/main/res/layout/circle_marker.xml | 1 + lib/ChartBase.js | 5 ++- 4 files changed, 57 insertions(+), 5 deletions(-) diff --git a/android/src/main/java/com/github/wuxudong/rncharts/charts/ChartBaseManager.java b/android/src/main/java/com/github/wuxudong/rncharts/charts/ChartBaseManager.java index 4be3c5a08..282242ec3 100644 --- a/android/src/main/java/com/github/wuxudong/rncharts/charts/ChartBaseManager.java +++ b/android/src/main/java/com/github/wuxudong/rncharts/charts/ChartBaseManager.java @@ -278,7 +278,7 @@ public void setMarker(Chart chart, ReadableMap propMap) { MarkerView markerView = null; switch(markerType) { case "circle": - markerView = circleMarker(chart); + markerView = circleMarker(chart, propMap); break; default: @@ -295,8 +295,20 @@ private RNRectangleMarkerView rectangleMarker(Chart chart, ReadableMap propMap) return marker; } - private RNCircleMarkerView circleMarker(Chart chart) { - return new RNCircleMarkerView(chart.getContext()); + private RNCircleMarkerView circleMarker(Chart chart, ReadableMap propMap) { + RNCircleMarkerView marker = new RNCircleMarkerView(chart.getContext()); + if (BridgeUtils.validate(propMap, ReadableType.Number, "markerSize")) { + marker.setSize(propMap.getInt("markerSize")); + } + + if (BridgeUtils.validate(propMap, ReadableType.Number, "markerStrokeSize")) { + marker.setStroke(propMap.getInt("markerStrokeSize"), propMap.getInt("markerStrokeColor")); + } + + if (BridgeUtils.validate(propMap, ReadableType.Number, "markerColor")) { + marker.setColor(propMap.getInt("markerColor")); + } + return marker; } private void setMarkerParams(RNRectangleMarkerView marker, ReadableMap propMap) { diff --git a/android/src/main/java/com/github/wuxudong/rncharts/markers/RNCircleMarkerView.java b/android/src/main/java/com/github/wuxudong/rncharts/markers/RNCircleMarkerView.java index 24bf33296..a1b5b4e95 100644 --- a/android/src/main/java/com/github/wuxudong/rncharts/markers/RNCircleMarkerView.java +++ b/android/src/main/java/com/github/wuxudong/rncharts/markers/RNCircleMarkerView.java @@ -2,14 +2,50 @@ import com.github.mikephil.charting.components.MarkerView; import android.content.Context; +import android.graphics.drawable.Drawable; +import android.graphics.drawable.GradientDrawable; +import android.graphics.drawable.ShapeDrawable; +import android.graphics.drawable.shapes.OvalShape; +import android.text.TextUtils; +import android.widget.ImageView; +import android.widget.LinearLayout; +import android.util.TypedValue; +import com.github.mikephil.charting.data.CandleEntry; +import com.github.mikephil.charting.data.Entry; +import com.github.mikephil.charting.highlight.Highlight; import com.github.mikephil.charting.utils.MPPointF; +import com.github.mikephil.charting.utils.Utils; import com.github.wuxudong.rncharts.R; +import java.util.List; +import java.util.Map; + public class RNCircleMarkerView extends MarkerView { + private ImageView ivContent; + + public void setSize(int size) { + int dpSize = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, size, getResources().getDisplayMetrics()); + ivContent.setLayoutParams(new LinearLayout.LayoutParams(dpSize, dpSize)); + } + + public void setStroke(int strokeSize, int strokeColor) { + GradientDrawable background = (GradientDrawable) ivContent.getBackground(); + background.mutate(); // only change this instance of the xml, not all components using this xml + int dpSize = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, strokeSize, getResources().getDisplayMetrics()); + background.setStroke(dpSize, strokeColor); // set stroke width and stroke color + } + + public void setColor(int markerColor) { + GradientDrawable background = (GradientDrawable) ivContent.getBackground(); + background.setColor(markerColor); + } + public RNCircleMarkerView(Context context) { - //the super will take care of displaying the layout + // the super will take care of displaying the layout super(context, R.layout.circle_marker); + + ivContent = (ImageView) findViewById(R.id.circle_ivContent); } @Override diff --git a/android/src/main/res/layout/circle_marker.xml b/android/src/main/res/layout/circle_marker.xml index 3ccb4c4ac..932bae4f1 100644 --- a/android/src/main/res/layout/circle_marker.xml +++ b/android/src/main/res/layout/circle_marker.xml @@ -6,6 +6,7 @@ android:layout_height="wrap_content"> diff --git a/lib/ChartBase.js b/lib/ChartBase.js index bcd57dff5..66cd5abd9 100644 --- a/lib/ChartBase.js +++ b/lib/ChartBase.js @@ -113,7 +113,10 @@ const chartIface = { markerColor: PropTypes.number, textColor: PropTypes.number, textSize: PropTypes.number, - + markerType: PropTypes.oneOf(['circle']), + markerSize: PropTypes.number, + markerStrokeSize: PropTypes.number, + markerStrokeColor: PropTypes.number, }), // stackIndex for StackBarChart From 3eb23e69b62b4fea9b21fc265844df0542da428e Mon Sep 17 00:00:00 2001 From: see2ever Date: Thu, 2 Nov 2023 19:31:13 +0800 Subject: [PATCH 3/3] feat: support dragYEnabled --- .../wuxudong/rncharts/charts/BarLineChartBaseManager.java | 5 +++++ ios/ReactNativeCharts/RNBarLineChartViewBase.swift | 4 ++++ lib/BarLineChartBase.js | 1 + 3 files changed, 10 insertions(+) diff --git a/android/src/main/java/com/github/wuxudong/rncharts/charts/BarLineChartBaseManager.java b/android/src/main/java/com/github/wuxudong/rncharts/charts/BarLineChartBaseManager.java index fc7b6edac..a59018f4c 100644 --- a/android/src/main/java/com/github/wuxudong/rncharts/charts/BarLineChartBaseManager.java +++ b/android/src/main/java/com/github/wuxudong/rncharts/charts/BarLineChartBaseManager.java @@ -169,6 +169,11 @@ public void setDragEnabled(BarLineChartBase chart, boolean enabled) { chart.setDragEnabled(enabled); } + @ReactProp(name = "dragYEnabled") + public void setDragYEnabled(BarLineChartBase chart, boolean enabled) { + chart.setDragYEnabled(enabled); + } + @ReactProp(name = "highlightPerDragEnabled") public void setHighlightPerDragEnabled(BarLineChartBase chart, boolean enabled) { chart.setHighlightPerDragEnabled(enabled); diff --git a/ios/ReactNativeCharts/RNBarLineChartViewBase.swift b/ios/ReactNativeCharts/RNBarLineChartViewBase.swift index a1fd7d5dd..69b0af847 100644 --- a/ios/ReactNativeCharts/RNBarLineChartViewBase.swift +++ b/ios/ReactNativeCharts/RNBarLineChartViewBase.swift @@ -168,6 +168,10 @@ class RNBarLineChartViewBase: RNYAxisChartViewBase { barLineChart.dragEnabled = enabled } + func setDragYEnabled(_ enabled: Bool) { + barLineChart.dragYEnabled = enabled + } + func setScaleXEnabled(_ enabled: Bool) { barLineChart.scaleXEnabled = enabled diff --git a/lib/BarLineChartBase.js b/lib/BarLineChartBase.js index 561a3fa32..7eb784ca6 100644 --- a/lib/BarLineChartBase.js +++ b/lib/BarLineChartBase.js @@ -48,6 +48,7 @@ const iface = { scaleXEnabled: PropTypes.bool, scaleYEnabled: PropTypes.bool, dragEnabled: PropTypes.bool, + dragYEnabled: PropTypes.bool, pinchZoom: PropTypes.bool, doubleTapToZoomEnabled: PropTypes.bool,