サイズ属性を手動で調整して快適な結果を得ることなく、Flare.json データを使用しようとしています。理想的には、サイズをネストされた深さの関数にしたいので、次の図では、階層ツリーの上のノードが、それらが存在するノードのパーセンテージになります。次の例を使用しています: http://bl.ocks.org/mbostock/4063530
同様に、深さを参照する機能により、ストローク幅とフォント サイズを動的に設定できます。これにより、変換による再描画ではなく、コンテナーのスケーリングによってズーム機能を実装するときに発生する問題が解決されます。
以下はすべて同じサイズのflare1000.jsonです。私は、
{
"name": "flare",
"children": [
{
"name": "analytics",
"children": [
{
"name": "cluster",
"children": [
{"name": "AgglomerativeCluster" ,"size": 1000},
{"name": "CommunityStructure" ,"size": 1000},
{"name": "HierarchicalCluster" ,"size": 1000},
{"name": "MergeEdge" ,"size": 1000}
]
},
{
"name": "graph",
"children": [
{"name": "BetweennessCentrality" ,"size": 1000},
{"name": "LinkDistance" ,"size": 1000},
{"name": "MaxFlowMinCut" ,"size": 1000},
{"name": "ShortestPaths" ,"size": 1000},
{"name": "SpanningTree" ,"size": 1000}
]
},
{
"name": "optimization",
"children": [
{"name": "AspectRatioBanker" ,"size": 1000}
]
}
]
} ,
{
"name": "animate",
"children": [
{"name": "Easing" ,"size": 1000},
{"name": "FunctionSequence" ,"size": 1000},
{
"name": "interpolate",
"children": [
{"name": "ArrayInterpolator" ,"size": 1000},
{"name": "ColorInterpolator" ,"size": 1000},
{"name": "DateInterpolator" ,"size": 1000},
{"name": "Interpolator" ,"size": 1000},
{"name": "MatrixInterpolator" ,"size": 1000},
{"name": "NumberInterpolator" ,"size": 1000},
{"name": "ObjectInterpolator" ,"size": 1000},
{"name": "PointInterpolator" ,"size": 1000},
{"name": "RectangleInterpolator" ,"size": 1000}
]
} ,
{"name": "ISchedulable" ,"size": 1000},
{"name": "Parallel" ,"size": 1000},
{"name": "Pause" ,"size": 1000},
{"name": "Scheduler" ,"size": 1000},
{"name": "Sequence" ,"size": 1000},
{"name": "Transition" ,"size": 1000},
{"name": "Transitioner" ,"size": 1000},
{"name": "TransitionEvent" ,"size": 1000},
{"name": "Tween" ,"size": 1000}
]
} ,
{
"name": "data",
"children": [
{
"name": "converters",
"children": [
{"name": "Converters" ,"size": 1000},
{"name": "DelimitedTextConverter" ,"size": 1000},
{"name": "GraphMLConverter" ,"size": 1000},
{"name": "IDataConverter" ,"size": 1000},
{"name": "JSONConverter" ,"size": 1000}
]
} ,
{"name": "DataField" ,"size": 1000},
{"name": "DataSchema" ,"size": 1000},
{"name": "DataSet" ,"size": 1000},
{"name": "DataSource" ,"size": 1000},
{"name": "DataTable" ,"size": 1000},
{"name": "DataUtil" ,"size": 1000}
]
} ,
{
"name": "display" ,
"children": [
{"name": "DirtySprite" ,"size": 1000},
{"name": "LineSprite" ,"size": 1000},
{"name": "RectSprite" ,"size": 1000},
{"name": "TextSprite" ,"size": 1000}
]
} ,
{
"name": "flex",
"children": [
{"name": "FlareVis" ,"size": 1000}
]
},
{
"name": "physics" ,
"children": [
{"name": "DragForce" ,"size": 1000},
{"name": "GravityForce" ,"size": 1000},
{"name": "IForce" ,"size": 1000},
{"name": "NBodyForce" ,"size": 1000},
{"name": "Particle" ,"size": 1000},
{"name": "Simulation" ,"size": 1000},
{"name": "Spring" ,"size": 1000},
{"name": "SpringForce" ,"size": 1000}
]
} ,
{
"name": "query",
"children": [
{"name": "AggregateExpression" ,"size": 1000},
{"name": "And" ,"size": 1000},
{"name": "Arithmetic" ,"size": 1000},
{"name": "Average" ,"size": 1000},
{"name": "BinaryExpression" ,"size": 1000},
{"name": "Comparison" ,"size": 1000},
{"name": "CompositeExpression" ,"size": 1000},
{"name": "Count" ,"size": 1000},
{"name": "DateUtil" ,"size": 1000},
{"name": "Distinct" ,"size": 1000},
{"name": "Expression" ,"size": 1000},
{"name": "ExpressionIterator" ,"size": 1000},
{"name": "Fn" ,"size": 1000},
{"name": "If" ,"size": 1000},
{"name": "IsA" ,"size": 1000},
{"name": "Literal" ,"size": 1000},
{"name": "Match" ,"size": 1000},
{"name": "Maximum" ,"size": 1000},
{
"name": "methods",
"children": [
{"name": "add" ,"size": 1000},
{"name": "and" ,"size": 1000},
{"name": "average" ,"size": 1000},
{"name": "count" ,"size": 1000},
{"name": "distinct" ,"size": 1000},
{"name": "div" ,"size": 1000},
{"name": "eq" ,"size": 1000},
{"name": "fn" ,"size": 1000},
{"name": "gt" ,"size": 1000},
{"name": "gte" ,"size": 1000},
{"name": "iff" ,"size": 1000},
{"name": "isa" ,"size": 1000},
{"name": "lt" ,"size": 1000},
{"name": "Maximum" ,"size": 1000},
{
"name": "methods",
"children": [
{"name": "add" ,"size": 1000},
{"name": "and" ,"size": 1000},
{"name": "average" ,"size": 1000},
{"name": "count" ,"size": 1000},
{"name": "distinct" ,"size": 1000},
{"name": "div" ,"size": 1000},
{"name": "eq" ,"size": 1000},
{"name": "fn" ,"size": 1000},
{"name": "gt" ,"size": 1000},
{"name": "Maximum" ,"size": 1000},
{
"name": "methods",
"children": [
{"name": "add" ,"size": 1000},
{"name": "and" ,"size": 1000},
{"name": "average" ,"size": 1000},
{"name": "count" ,"size": 1000},
{"name": "Maximum" ,"size": 1000},
{
"name": "methods" ,
"children": [
{"name": "add" ,"size": 1000},
{"name": "and" ,"size": 1000},
{"name": "average" ,"size": 1000},
{"name": "count" ,"size": 1000},
{"name": "neq" ,"size": 1000},
{"name": "not" ,"size": 1000},
{"name": "or" ,"size": 1000},
{"name": "add" ,"size": 1000},
{"name": "and" ,"size": 1000},
{"name": "average" ,"size": 1000},
{"name": "count" ,"size": 1000},
{"name": "neq" ,"size": 1000},
{"name": "not" ,"size": 1000},
{"name": "add" ,"size": 1000},
{"name": "and" ,"size": 1000},
{"name": "average" ,"size": 1000},
{"name": "count" ,"size": 1000},
{"name": "neq" ,"size": 1000},
{"name": "not" ,"size": 1000},
{"name": "or" ,"size": 1000},
{"name": "orderby" ,"size": 1000},
{"name": "range" ,"size": 1000},
{"name": "select" ,"size": 1000},
{"name": "stddev" ,"size": 1000},
{"name": "sub" ,"size": 1000},
{"name": "sum" ,"size": 1000},
{"name": "update" ,"size": 1000},
{"name": "variance" ,"size": 1000},
{"name": "where" ,"size": 1000},
{"name": "or" ,"size": 1000},
{"name": "orderby" ,"size": 1000},
{"name": "range" ,"size": 1000},
{"name": "select" ,"size": 1000},
{"name": "stddev" ,"size": 1000},
{"name": "sub" ,"size": 1000},
{"name": "sum" ,"size": 1000},
{"name": "update" ,"size": 1000},
{"name": "variance" ,"size": 1000},
{"name": "where" ,"size": 1000},
{"name": "orderby" ,"size": 1000},
{"name": "range" ,"size": 1000},
{"name": "select" ,"size": 1000},
{"name": "stddev" ,"size": 1000},
{"name": "sub" ,"size": 1000},
{"name": "sum" ,"size": 1000},
{"name": "update" ,"size": 1000},
{"name": "variance" ,"size": 1000},
{"name": "where" ,"size": 1000},
{"name": "xor" ,"size": 1000}
]
} ,
{"name": "distinct" ,"size": 1000},
{"name": "div" ,"size": 1000},
{"name": "eq" ,"size": 1000},
{"name": "fn" ,"size": 1000},
{"name": "gt" ,"size": 1000}
]
} ,
{"name": "gte" ,"size": 1000},
{"name": "iff" ,"size": 1000},
{"name": "isa" ,"size": 1000},
{"name": "lt" ,"size": 1000},
{"name": "lte" ,"size": 1000},
{"name": "max" ,"size": 1000},
{"name": "min" ,"size": 1000}
]
} ,
{"name": "mod" ,"size": 1000},
{"name": "lte" ,"size": 1000},
{"name": "max" ,"size": 1000},
{"name": "min" ,"size": 1000},
{"name": "mod" ,"size": 1000},
{"name": "mul" ,"size": 1000},
{"name": "neq" ,"size": 1000},
{"name": "not" ,"size": 1000},
{"name": "or" ,"size": 1000},
{"name": "orderby" ,"size": 1000},
{"name": "range" ,"size": 1000},
{"name": "select" ,"size": 1000},
{"name": "stddev" ,"size": 1000},
{"name": "sub" ,"size": 1000},
{"name": "sum" ,"size": 1000},
{"name": "update" ,"size": 1000},
{"name": "variance" ,"size": 1000},
{"name": "where" ,"size": 1000},
{"name": "xor" ,"size": 1000},
{"name": "_" ,"size": 1000}
]
} ,
{"name": "Minimum" ,"size": 1000},
{"name": "Not" ,"size": 1000},
{"name": "Or" ,"size": 1000},
{"name": "Query" ,"size": 1000},
{"name": "Range" ,"size": 1000},
{"name": "StringUtil" ,"size": 1000},
{"name": "Sum" ,"size": 1000},
{"name": "Variable" ,"size": 1000},
{"name": "Variance" ,"size": 1000},
{"name": "Xor" ,"size": 1000}
]
},
{
"name": "scale",
"children": [
{"name": "IScaleMap" ,"size": 1000},
{"name": "LinearScale" ,"size": 1000},
{"name": "LogScale" ,"size": 1000},
{"name": "OrdinalScale" ,"size": 1000},
{"name": "QuantileScale" ,"size": 1000},
{"name": "QuantitativeScale" ,"size": 1000},
{"name": "RootScale" ,"size": 1000},
{"name": "Scale" ,"size": 1000},
{"name": "ScaleType" ,"size": 1000},
{"name": "TimeScale" ,"size": 1000}
]
},
{
"name": "util" ,
"children": [
{"name": "Arrays" ,"size": 1000},
{"name": "Colors" ,"size": 1000},
{"name": "Dates" ,"size": 1000},
{"name": "Displays" ,"size": 1000},
{"name": "Filter" ,"size": 1000},
{"name": "Geometry" ,"size": 1000},
{
"name": "heap",
"children": [
{"name": "FibonacciHeap" ,"size": 1000},
{"name": "HeapNode" ,"size": 1000}
]
} ,
{"name": "IEvaluable" ,"size": 1000},
{"name": "IPredicate" ,"size": 1000},
{"name": "IValueProxy" ,"size": 1000},
{
"name": "math" ,
"children": [
{"name": "DenseMatrix" ,"size": 1000},
{"name": "IMatrix" ,"size": 1000},
{"name": "SparseMatrix" ,"size": 1000}
]
} ,
{"name": "Maths" ,"size": 1000},
{"name": "Orientation" ,"size": 1000},
{
"name": "palette" ,
"children": [
{"name": "ColorPalette" ,"size": 1000},
{"name": "Palette" ,"size": 1000},
{"name": "ShapePalette" ,"size": 1000},
{"name": "SizePalette" ,"size": 1000}
]
} ,
{"name": "Property" ,"size": 1000},
{"name": "Shapes" ,"size": 1000},
{"name": "Sort" ,"size": 1000},
{"name": "Stats" ,"size": 1000},
{"name": "Strings" ,"size": 1000}
]
},
{
"name": "vis",
"children": [
{
"name": "axis",
"children": [
{"name": "Axes" ,"size": 1000},
{"name": "Axis" ,"size": 1000},
{"name": "AxisGridLine" ,"size": 1000},
{"name": "AxisLabel" ,"size": 1000},
{"name": "CartesianAxes" ,"size": 1000}
]
},
{
"name": "controls",
"children": [
{"name": "AnchorControl" ,"size": 1000},
{"name": "ClickControl" ,"size": 1000},
{"name": "Control" ,"size": 1000},
{"name": "ControlList" ,"size": 1000},
{"name": "DragControl" ,"size": 1000},
{"name": "ExpandControl" ,"size": 1000},
{"name": "HoverControl" ,"size": 1000},
{"name": "IControl" ,"size": 1000},
{"name": "PanZoomControl" ,"size": 1000},
{"name": "SelectionControl" ,"size": 1000},
{"name": "TooltipControl" ,"size": 1000}
]
} ,
{
"name": "data",
"children": [
{"name": "Data" ,"size": 1000},
{"name": "DataList" ,"size": 1000},
{"name": "DataSprite" ,"size": 1000},
{"name": "EdgeSprite" ,"size": 1000},
{"name": "NodeSprite" ,"size": 1000},
{
"name": "render",
"children": [
{"name": "ArrowType" ,"size": 1000},
{"name": "EdgeRenderer" ,"size": 1000},
{"name": "IRenderer" ,"size": 1000},
{"name": "ShapeRenderer" ,"size": 1000}
]
},
{"name": "ScaleBinding" ,"size": 1000},
{"name": "Tree" ,"size": 1000},
{"name": "TreeBuilder" ,"size": 1000}
]
},
{
"name": "events",
"children": [
{"name": "DataEvent" ,"size": 1000},
{"name": "SelectionEvent" ,"size": 1000},
{"name": "TooltipEvent" ,"size": 1000},
{"name": "VisualizationEvent" ,"size": 1000}
]
} ,
{
"name": "legend" ,
"children": [
{"name": "Legend" ,"size": 1000},
{"name": "LegendItem" ,"size": 1000},
{"name": "LegendRange" ,"size": 1000}
]
},
{
"name": "operator",
"children": [
{
"name": "distortion",
"children": [
{"name": "BifocalDistortion" ,"size": 1000},
{"name": "Distortion" ,"size": 1000},
{"name": "FisheyeDistortion" ,"size": 1000}
]
},
{
"name": "encoder",
"children": [
{"name": "ColorEncoder" ,"size": 1000},
{"name": "Encoder" ,"size": 1000},
{"name": "PropertyEncoder" ,"size": 1000},
{"name": "ShapeEncoder" ,"size": 1000},
{"name": "SizeEncoder" ,"size": 1000}
]
},
{
"name": "filter",
"children": [
{"name": "FisheyeTreeFilter" ,"size": 1000},
{"name": "GraphDistanceFilter" ,"size": 1000},
{"name": "VisibilityFilter" ,"size": 1000}
]
},
{"name": "IOperator" ,"size": 1000},
{
"name": "label",
"children": [
{"name": "Labeler" ,"size": 1000},
{"name": "RadialLabeler" ,"size": 1000},
{"name": "StackedAreaLabeler" ,"size": 1000}
]
},
{
"name": "layout",
"children": [
{"name": "AxisLayout" ,"size": 1000},
{"name": "BundledEdgeRouter" ,"size": 1000},
{"name": "CircleLayout" ,"size": 1000},
{"name": "CirclePackingLayout" ,"size": 1000},
{"name": "DendrogramLayout" ,"size": 1000},
{"name": "ForceDirectedLayout" ,"size": 1000},
{"name": "IcicleTreeLayout" ,"size": 1000},
{"name": "IndentedTreeLayout" ,"size": 1000},
{"name": "Layout" ,"size": 1000},
{"name": "NodeLinkTreeLayout" ,"size": 1000},
{"name": "PieLayout" ,"size": 1000},
{"name": "RadialTreeLayout" ,"size": 1000},
{"name": "RandomLayout" ,"size": 1000},
{"name": "StackedAreaLayout" ,"size": 1000},
{"name": "TreeMapLayout" ,"size": 1000}
]
},
{"name": "Operator" ,"size": 1000},
{"name": "OperatorList" ,"size": 1000},
{"name": "OperatorSequence" ,"size": 1000},
{"name": "OperatorSwitch" ,"size": 1000},
{"name": "SortOperator" ,"size": 1000}
]
},
{"name": "Visualization" ,"size": 1000}
]
}
]
}