fix: correcting color rendering for SAR svg

The fill was set to green instead of using the fill object.
markmcdowell · Sep 6, 2019 · 660b9f4 · 660b9f4
1 parent afc8778
commit 660b9f4
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/packages/react-financial-charts/src/series/SARSeries.tsx b/packages/react-financial-charts/src/series/SARSeries.tsx
@@ -58,20 +58,25 @@ export class SARSeries extends React.Component<SARSeriesProps> {
     }
 
     private readonly renderSVG = (moreProps) => {
-        const { className, yAccessor } = this.props;
+        const { className, yAccessor, fill } = this.props;
         const { xAccessor, plotData, xScale, chartConfig: { yScale } } = moreProps;
 
         return <g className={className}>
             {plotData
                 .filter((each) => isDefined(yAccessor(each)))
                 .map((each, idx) => {
+
+                    const color = yAccessor(each) > each.close
+                        ? fill.falling
+                        : fill.rising;
+
                     return (
                         <circle
                             key={idx}
                             cx={xScale(xAccessor(each))}
                             cy={yScale(yAccessor(each))}
                             r={3}
-                            fill="green" />
+                            fill={color} />
                     );
                 })}
         </g>;