victory-tree
Advanced tools
Comparing version 0.0.5 to 0.0.6
{ | ||
"name": "victory-tree", | ||
"version": "0.0.5", | ||
"version": "0.0.6", | ||
"description": "victory-tree", | ||
@@ -5,0 +5,0 @@ "main": "index.js", |
@@ -1,2 +0,2 @@ | ||
#VictoryTree | ||
#Tree | ||
@@ -10,6 +10,14 @@ [Victory](https://www.npmjs.com/package/victory) is a ReactJS based data visualization library. | ||
``` | ||
var React = require("react"); | ||
var Group = require("victory-group"); | ||
var Circle = require("victory-circle"); | ||
var Text = require("victory-text"); | ||
var Tree = require("victory-tree"); | ||
var Visualization = React.createClass({ | ||
getInitalState: function () { | ||
return { | ||
height: | ||
height: "2000px", | ||
width: "3000px" | ||
} | ||
@@ -19,6 +27,6 @@ }, | ||
return ( | ||
<VictoryGroup {...node}> | ||
<VictoryCircle/> | ||
<VictoryText/> | ||
</VictoryGroup> | ||
<Group {...node}> | ||
<Circle r={node.foo} /> | ||
<Text content={node.bar} /> | ||
</Group> | ||
) | ||
@@ -28,3 +36,3 @@ }, | ||
return ( | ||
<VictoryPath d={link.diagonal}/> | ||
<Path d={link.diagonal}/> | ||
) | ||
@@ -38,10 +46,8 @@ }, | ||
height={this.state.svgHeight}> | ||
<g transform={"translate(100,0)"}> | ||
<VictoryTree | ||
<Tree | ||
data={fooArrayOfLinksAndNodes} | ||
node={this.node} | ||
link={this.link} | ||
transform={"translate(100,0)"} | ||
/> | ||
</VictoryTree> | ||
</g> | ||
</svg> | ||
@@ -48,0 +54,0 @@ ); |
@@ -36,3 +36,3 @@ /* eslint no-unused-vars:0 */ | ||
return ( | ||
<g> | ||
<g transform={this.props.transform}> | ||
{this.drawNodes(nodes)} | ||
@@ -39,0 +39,0 @@ {this.drawLinks(links)} |
15044
84