Merge pull request #1401 from FormidableLabs/bug/candlestick-colors

correct automatic candlestick colors with data accessors
FormidableLabs · Sep 20, 2019 · 64a4553 · 64a4553
2 parents 43550df + 7d24cfe
commit 64a4553
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 13 deletions.
diff --git a/packages/victory-candlestick/src/helper-methods.js b/packages/victory-candlestick/src/helper-methods.js
@@ -107,7 +107,7 @@ const isTransparent = (attr) => {
 const getDataStyles = (datum, style, props) => {
   style = style || {};
   const candleColor =
-    datum.open > datum.close ? props.candleColors.negative : props.candleColors.positive;
+    datum._open > datum._close ? props.candleColors.negative : props.candleColors.positive;
   const fill = style.fill || candleColor;
   const strokeColor = style.stroke;
   const stroke = isTransparent(strokeColor) ? fill : strokeColor || "black";

diff --git a/stories/victory-candlestick.js b/stories/victory-candlestick.js
@@ -92,27 +92,29 @@ storiesOf("VictoryCandlestick.data", module)
   .add("with data accessors", () => (
     <VictoryCandlestick
       data={[
-        { series: 1, open: 9, close: 30, big: 560, low: 7 },
-        { series: 2, open: 80, close: 40, big: 1200, low: 10 },
-        { series: 3, open: 50, close: 80, big: 900, low: 20 },
-        { series: 4, open: 70, close: 22, big: 700, low: 5 },
-        { series: 5, open: 20, close: 35, big: 500, low: 10 }
+        { series: 1, start: 9, close: 30, big: 560, low: 7 },
+        { series: 2, start: 80, close: 40, big: 1200, low: 10 },
+        { series: 3, start: 50, close: 80, big: 900, low: 20 },
+        { series: 4, start: 70, close: 22, big: 700, low: 5 },
+        { series: 5, start: 20, close: 35, big: 500, low: 10 }
       ]}
-      x={"series"}
+      x="series"
+      open="start"
       high={(data) => data.big / 10}
     />
   ))
   .add("with data accessors (horizontal)", () => (
     <VictoryCandlestick
       horizontal
       data={[
-        { series: 1, open: 9, close: 30, big: 560, low: 7 },
-        { series: 2, open: 80, close: 40, big: 1200, low: 10 },
-        { series: 3, open: 50, close: 80, big: 900, low: 20 },
-        { series: 4, open: 70, close: 22, big: 700, low: 5 },
-        { series: 5, open: 20, close: 35, big: 500, low: 10 }
+        { series: 1, start: 9, close: 30, big: 560, low: 7 },
+        { series: 2, start: 80, close: 40, big: 1200, low: 10 },
+        { series: 3, start: 50, close: 80, big: 900, low: 20 },
+        { series: 4, start: 70, close: 22, big: 700, low: 5 },
+        { series: 5, start: 20, close: 35, big: 500, low: 10 }
       ]}
-      x={"series"}
+      x="series"
+      open="start"
       high={(data) => data.big / 10}
     />
   ))