react-native-gifted-charts 1.4.18 → 1.4.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-gifted-charts",
-  "version": "1.4.18",
+  "version": "1.4.19",
   "description": "The most complete library for Bar, Line, Area, Pie, Donut, Stacked Bar and Population Pyramid charts in React Native. Allows 2D, 3D, gradient, animations and live data updates.",
   "main": "src/index.tsx",
   "files": [
@@ -25,7 +25,7 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "gifted-charts-core": "^0.1.16"
+    "gifted-charts-core": "^0.1.18"
   },
   "devDependencies": {
     "@babel/core": "^7.22.5",

package/src/Components/BarAndLineChartsWrapper/renderHorizSections.tsx

@@ -139,6 +139,7 @@ export const renderHorizSections = (props: horizSectionPropTypes) => {
         {showYAxisIndices && index !== noOfSections ? (
           <View
             style={{
+              position: 'absolute',
               height: yAxisIndicesHeight,
               width: yAxisIndicesWidth,
               left:

package/src/LineChart/index.tsx

@@ -299,6 +299,7 @@ export const LineChart = (props: LineChartPropsType) => {
     stripWidth,
     stripColor,
     stripOpacity,
+    stripStrokeDashArray,
     unFocusOnPressOut,
     delayBeforeUnFocus,
     containerHeightIncludingBelowXAxis,
@@ -661,9 +662,22 @@ export const LineChart = (props: LineChartPropsType) => {
       const currentStripHeight = item.stripHeight ?? stripHeight;
       const currentStripWidth = item.stripWidth ?? stripWidth;
       const currentStripOpacity = item.stripOpacity ?? stripOpacity;
+      const currentStripStrokeDashArray =
+        item.stripStrokeDashArray ?? stripStrokeDashArray ?? '';
       const currentStripColor = item.stripColor || stripColor;
       const position = I18nManager.isRTL ? 'right' : 'left';
 
+      const y1 = currentStripHeight
+        ? containerHeight - currentStripHeight + 8
+        : containerHeight -
+          dataPointsHeight / 2 +
+          14 -
+          (item.value * containerHeight) / maxValue;
+
+      const actualStripHeight =
+        currentStripHeight ||
+        (item.value * containerHeight) / maxValue - 2 + overflowTop;
+
       return (
         <Fragment key={index}>
           {focusEnabled ? (
@@ -694,23 +708,15 @@ export const LineChart = (props: LineChartPropsType) => {
           ) : null}
           {item.showStrip ||
           (focusEnabled && index === selectedIndex && showStripOnFocus) ? (
-            <Rect
-              x={initialSpacing + spacing * index - currentStripWidth / 2 - 1}
-              y={
-                currentStripHeight
-                  ? containerHeight - currentStripHeight + 8
-                  : containerHeight -
-                    dataPointsHeight / 2 +
-                    14 -
-                    (item.value * containerHeight) / maxValue
-              }
-              width={currentStripWidth}
-              height={
-                currentStripHeight ||
-                (item.value * containerHeight) / maxValue - 2 + overflowTop
-              }
+            <Line
+              x1={initialSpacing + spacing * index - currentStripWidth / 2 - 1}
+              y1={y1}
+              x2={initialSpacing + spacing * index - currentStripWidth / 2 - 1}
+              y2={y1 + actualStripHeight}
+              strokeWidth={currentStripWidth}
+              stroke={currentStripColor}
+              strokeDasharray={currentStripStrokeDashArray}
               opacity={currentStripOpacity}
-              fill={currentStripColor}
             />
           ) : null}
           {hideDataPoints ? null : (