Format Data from Domain

packages/victory-box-plot/src/helper-methods.js

@@ -368,8 +368,20 @@ const getBaseProps = (props, fallbackProps) => {
     }
   };
   const boxScale = scale.y;
+  const [minDomainY, maxDomainY] = domain.y;
   return data.reduce((acc, datum, index) => {
     const eventKey = !isNil(datum.eventKey) ? datum.eventKey : index;
+
+    // if all y points are out of bound of the domain, filter out this datum
+    const { _min, _max } = datum;
+    const underMin = (val) => val < minDomainY;
+    const overMax = (val) => val > maxDomainY;
+    const exists = (val) => val !== undefined;
+    let yOutOfBounds;
+    if (exists(_min) && exists(_max) && underMin(_min) && underMin(_max)) yOutOfBounds = true;
+    if (exists(_min) && exists(_max) && overMax(_min) && overMax(_max)) yOutOfBounds = true;
+    if (yOutOfBounds) return acc;
+
     const positions = {
       x: horizontal ? scale.y(datum._y) : scale.x(datum._x),
       y: horizontal ? scale.x(datum._x) : scale.y(datum._y),

packages/victory-candlestick/src/helper-methods.js

@@ -102,6 +102,21 @@ const getStyles = (props, style, defaultStyles = {}) => {
   };
 };
 
+// This method will edit or remove candlestick data points that fall outside of the desired domain
+// eslint-disable-next-line complexity
+const formatDataFromDomain = (datum, domainY) => {
+  const [minDomainY, maxDomainY] = domainY;
+  let { _low, _open, _close, _high } = datum;
+
+  // if all values fall outside of domain, null the data point
+  if (_low < minDomainY && _open < minDomainY && _close < minDomainY && _high < minDomainY)
+    _low = _open = _close = _high = null;
+  if (_low > maxDomainY && _open > maxDomainY && _close > maxDomainY && _high > maxDomainY)
+    _low = _open = _close = _high = null;
+
+  return Object.assign({}, datum, { _low, _open, _close, _high });
+};
+
 const getCalculatedValues = (props) => {
   const { polar } = props;
   const defaultStyle = Helpers.getDefaultStyles(props, "candlestick");
@@ -321,13 +336,17 @@ const getBaseProps = (props, fallbackProps) => {
     }
   };
 
+  // eslint-disable-next-line complexity
   return data.reduce((childProps, datum, index) => {
     const eventKey = !isNil(datum.eventKey) ? datum.eventKey : index;
     const x = scale.x(datum._x1 !== undefined ? datum._x1 : datum._x);
-    const high = scale.y(datum._high);
-    const close = scale.y(datum._close);
-    const open = scale.y(datum._open);
-    const low = scale.y(datum._low);
+    datum = formatDataFromDomain(datum, domain.y);
+    const { _low, _open, _close, _high } = datum;
+    const high = scale.y(_high);
+    const close = scale.y(_close);
+    const open = scale.y(_open);
+    const low = scale.y(_low);
+
     const dataStyle = getDataStyles(datum, style.data, props);
     const dataProps = {
       x,

packages/victory-core/src/victory-util/data.js

@@ -15,6 +15,7 @@ import {
   includes
 } from "lodash";
 import Helpers from "./helpers";
+import Domain from "./domain";
 import Collection from "./collection";
 import Scale from "./scale";
 import Immutable from "./immutable";
@@ -91,6 +92,64 @@ function cleanData(dataset, props) {
   });
 }
 
+// This method will remove data points that fall outside of the desired domain (non-continuous charts only)
+function formatDataFromDomain(dataset, props) {
+  // domain for checking data points that are outside of the bounds
+  // symbol to determine chart types with a single y value point
+  // interpolation for determining chart types with continuous data points that shouldn't be altered
+  // errorX/Y for determining chart types with error whiskers that shouldn't be altered here
+  const { domain, symbol, interpolation, errorX, errorY } = props;
+
+  if (interpolation || errorX || errorY) return dataset;
+
+  const minDomainX =
+    !domain || !domain.x ? Domain.getMinFromProps(props, "x") : Collection.getMinValue(domain.x);
+  const maxDomainX =
+    !domain || !domain.x ? Domain.getMaxFromProps(props, "x") : Collection.getMaxValue(domain.x);
+  const minDomainY =
+    !domain || !domain.y ? Domain.getMinFromProps(props, "y") : Collection.getMinValue(domain.y);
+  const maxDomainY =
+    !domain || !domain.y ? Domain.getMaxFromProps(props, "y") : Collection.getMaxValue(domain.y);
+
+  const exists = (val) => val !== undefined;
+
+  // eslint-disable-next-line complexity
+  return dataset.map((datum) => {
+    let { _x, _y, _y0, _y1 } = datum;
+
+    // don't alter data points if _y is an array of values
+    if (Array.isArray(_y)) return datum;
+
+    // single x point less than min domain
+    if (exists(_x) && _x < minDomainX) _x = null;
+    // single x point greater than max domain
+    if (exists(_x) && _x > maxDomainX) _x = null;
+
+    // single y point less than min domain
+    if (exists(_y) && !exists(_y0) && _y < minDomainY) {
+      if (exists(symbol)) _y = null;
+      else _y = minDomainY;
+    }
+    // single y point greater than max domain
+    if (exists(_y) && !exists(_y0) && _y > maxDomainY) {
+      if (exists(symbol)) _y = null;
+      else _y = maxDomainY;
+    }
+
+    // multiple y points all less than min domain
+    if (exists(_y0) && exists(_y1) && _y0 < minDomainY && _y1 < minDomainY) _y = _y0 = _y1 = null;
+    // multiple y points all greather than max domain
+    if (exists(_y0) && exists(_y1) && _y0 > maxDomainY && _y1 > maxDomainY) _y = _y0 = _y1 = null;
+
+    // multiple y points with lower point only below min
+    if (exists(_y0) && exists(_y1) && _y0 < minDomainY && _y1 >= minDomainY) _y0 = minDomainY;
+    // multiple y points with upper point only above max
+    if (exists(_y0) && exists(_y1) && _y0 <= maxDomainY && _y1 > maxDomainY) _y1 = maxDomainY;
+
+    return assign({}, datum, { _x, _y, _y0, _y1 });
+  });
+}
+
 // Returns a data accessor given an eventKey prop
 function getEventKey(key) {
   // creates a data accessor function
@@ -236,7 +295,8 @@ function formatData(dataset, props, expectedKeys) {
 
   const sortedData = sortData(data, props.sortKey, props.sortOrder);
   const cleanedData = cleanData(sortedData, props);
-  return addEventKeys(props, cleanedData);
+  const domainFormattedData = formatDataFromDomain(cleanedData, props);
+  return addEventKeys(props, domainFormattedData);
 }
 
 /**

packages/victory-errorbar/src/helper-methods.js

@@ -66,6 +66,19 @@ const getDomain = (props, axis) => {
   return Domain.createDomainFunction(getDomainFromData)(props, axis);
 };
 
+// This method will edit or remove errorbar data points that fall outside of the desired domain
+const formatDataFromDomain = (datum, domain) => {
+  const [minDomainX, maxDomainX] = domain.x;
+  const [minDomainY, maxDomainY] = domain.y;
+
+  let { _x, _y } = datum;
+
+  // if either x or y center point is outside of the domain, null the entire data point
+  if (_x < minDomainX || _x > maxDomainX || _y < minDomainY || _y > maxDomainY) _x = _y = null;
+
+  return Object.assign({}, datum, { _x, _y });
+};
+
 const getCalculatedValues = (props) => {
   const defaultStyles = Helpers.getDefaultStyles(props, "errorbar");
   const style = Helpers.getStyles(props.style, defaultStyles) || {};
@@ -169,6 +182,7 @@ const getBaseProps = (props, fallbackProps) => {
   return data.reduce((childProps, datum, index) => {
     const eventKey = !isNil(datum.eventKey) ? datum.eventKey : index;
     const { x, y } = Helpers.scalePoint(assign({}, props, { scale }), datum);
+    datum = formatDataFromDomain(datum, domain);
     const errorX = getErrors(props, datum, "x");
     const errorY = getErrors(props, datum, "y");
     const dataProps = {

packages/victory-stack/src/helper-methods.js

@@ -102,7 +102,10 @@ function addLayoutData(props, datasets, index) {
 
 function stackData(props, childComponents) {
   const dataFromChildren = Wrapper.getDataFromChildren(props, childComponents);
-  const datasets = fillData(props, dataFromChildren);
+  const filterNullChildData = dataFromChildren.map((dataset) =>
+    dataset.filter((datum) => datum._x !== null && datum._y !== null)
+  );
+  const datasets = fillData(props, filterNullChildData);
   return datasets.map((d, i) => addLayoutData(props, datasets, i));
 }