Merge pull request #548 from FormidableLabs/voronoiBlacklist

add a voronoiBlacklist prop and ignore children with matching names
FormidableLabs · Jan 8, 2018 · e531fa3 · e531fa3
2 parents e2d1368 + ec50d82
commit e531fa3
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 9 deletions.
diff --git a/demo/components/victory-voronoi-container-demo.js b/demo/components/victory-voronoi-container-demo.js
@@ -57,6 +57,7 @@ class App extends React.Component {
             domainPadding={{ y: 2 }}
             containerComponent={
               <VictoryVoronoiContainer voronoiDimension="x"
+                voronoiBlacklist={["first"]}
                 labels={(d) => `y:${d.y}`}
                 labelComponent={
                   <VictoryTooltip
@@ -68,7 +69,7 @@ class App extends React.Component {
               />
             }
           >
-            <VictoryLine
+            <VictoryLine name="first"
               data={[
                 { x: 1, y: 5, l: "one" },
                 { x: 1.5, y: 5, l: "one point five" },
@@ -81,7 +82,7 @@ class App extends React.Component {
               }}
             />
 
-            <VictoryLine
+            <VictoryLine name="second"
               data={[
                 { x: 1, y: -3, l: "red" },
                 { x: 2, y: 5, l: "green" },
@@ -93,7 +94,7 @@ class App extends React.Component {
               }}
             />
 
-            <VictoryLine
+            <VictoryLine name="third"
               data={[
                 { x: 1, y: 5, l: "cat" },
                 { x: 2, y: -4, l: "dog" },
@@ -142,7 +143,8 @@ class App extends React.Component {
           <VictoryChart
             height={450}
             padding={{ top: 100, bottom: 20, left: 50, right: 50 }}
-            style={chartStyle} containerComponent={<VictoryVoronoiContainer/>}
+            style={chartStyle}
+            containerComponent={<VictoryVoronoiContainer voronoiBlacklist={["red"]}/>}
           >
             <VictoryLegend x={140} y={10}
               title="Legend"
@@ -157,7 +159,7 @@ class App extends React.Component {
               ]}
             />
             <VictoryGroup style={chartStyle}>
-              <VictoryScatter
+              <VictoryScatter name="red"
                 style={{
                   data: { fill: "tomato" }
                 }}

diff --git a/src/components/containers/victory-voronoi-container.js b/src/components/containers/victory-voronoi-container.js
@@ -13,6 +13,7 @@ export const voronoiContainerMixin = (base) => class VictoryVoronoiContainer ext
     onActivated: PropTypes.func,
     onDeactivated: PropTypes.func,
     radius: PropTypes.number,
+    voronoiBlacklist: PropTypes.arrayOf(PropTypes.string),
     voronoiDimension: PropTypes.oneOf(["x", "y"]),
     voronoiPadding: PropTypes.number
   };

diff --git a/src/components/containers/voronoi-helpers.js b/src/components/containers/voronoi-helpers.js
@@ -1,5 +1,5 @@
 import { Selection, Data, Helpers } from "victory-core";
-import { assign, throttle, isFunction, groupBy, keys, isEqual } from "lodash";
+import { assign, throttle, isFunction, groupBy, keys, isEqual, includes } from "lodash";
 import { voronoi as d3Voronoi } from "d3-voronoi";
 import React from "react";
 import { attachId } from "../../helpers/event-handlers";
@@ -43,15 +43,20 @@ const VoronoiHelpers = {
 
     const iteratee = (child, childName, parent) => {
       const role = child.type && child.type.role;
+      const childProps = child.props || {};
+      const blacklist = props.voronoiBlacklist || [];
       if (role === "axis" || role === "legend" || role === "label") {
         return null;
+      } else if (includes(blacklist, childName)) {
+        // ignore any children with names that match the blacklist
+        return null;
       } else if (child.type && isFunction(child.type.getData)) {
         child = parent ? React.cloneElement(child, parent.props) : child;
-        const childData = child.props
-          && child.type.getData({ ...child.props, domain: props.domain });
+        const childData = childProps
+          && child.type.getData({ ...childProps, domain: props.domain });
         return childData ? addMeta(childData, childName, child) : null;
       } else {
-        const childData = getData({ ...child.props, domain: props.domain });
+        const childData = getData({ ...childProps, domain: props.domain });
         return childData ? addMeta(childData, childName, child) : null;
       }
     };