d3实现了思维导图文件树效果
代码语言:html
所属分类:图表
代码描述:d3实现了思维导图文件树效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> .node { cursor: pointer; } .node circle { fill: #fff; stroke: steelblue; stroke-width: 1.5px; } .node text { font: 10px sans-serif; } .link { fill: none; stroke: #ccc; stroke-width: 1.5px; } body { overflow: hidden; } </style> </head> <body translate="no"> <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/d3.v3.js"></script> <div id="body"></div> <script > var margin = { top: 20, right: 120, bottom: 20, left: 120 }, width = 960 - margin.right - margin.left, height = 800 - margin.top - margin.bottom; var root = { "name": "flare", "children": [{ "name": "analytics", "children": [{ "name": "cluster", "children": [{ "name": "AgglomerativeCluster", "size": 3938 }, { "name": "CommunityStructure", "size": 3812 }, { "name": "HierarchicalCluster", "size": 6714 }, { "name": "MergeEdge", "size": 743 }] }, { "name": "graph", "children": [{ "name": "BetweennessCentrality", "size": 3534 }, { "name": "LinkDistance", "size": 5731 }, { "name": "MaxFlowMinCut", "size": 7840 }, { "name": "ShortestPaths", "size": 5914 }, { "name": "SpanningTree", "size": 3416 }] }, { "name": "optimization", "children": [{ "name": "AspectRatioBanker", "size": 7074 }] }] }, { "name": "animate", "children": [{ "name": "Easing", "size": 17010 }, { "name": "FunctionSequence", "size": 5842 }, { "name": "interpolate", "children": [{ "name": "ArrayInterpolator", "size": 1983 }, { "name": "ColorInterpolator", "size": 2047 }, { "name": "DateInterpolator", "size": 1375 }, { "name": "Interpolator", "size": 8746 }, { "name": "MatrixInterpolator", "size": 2202 }, { "name": "NumberInterpolator", "size": 1382 }, { "name": "ObjectInterpolator", "size": 1629 }, { "name": "PointInterpolator", "size": 1675 }, { "name": "RectangleInterpolator", "size": 2042 }] }, { "name": "ISchedulable", "size": 1041 }, { "name": "Parallel", "size": 5176 }, { "name": "Pause", "size": 449 }, { "name": "Scheduler", "size": 5593 }, { "name": "Sequence", "size": 5534 }, { "name": "Transition", "size": 9201 }, { "name": "Transitioner", "size": 19975 }, { "name": "TransitionEvent", "size": 1116 }, { "name": "Tween", "size": 6006 }] }, { "name": "data", "children": [{ "name": "converters", "children": [{ "name": "Converters", "size": 721 }, { "name": "DelimitedTextConverter", "size": 4294 }, { "name": "GraphMLConverter", "size": 9800 }, { "name": "IDataConverter", "size": 1314 }, { "name": "JSONConverter", "size": 2220 }] }, { "name": "DataField", "size": 1759 }, { "name": "DataSchema", "size": 2165 }, { "name": "DataSet", "size": 586 }, { "name": "DataSource", "size": 3331 }, { "name": "DataTable", "size": 772 }, { "name": "DataUtil", "size": 3322 }] }, { "name": "display", "children": [{ "name": "DirtySprite", "size": 8833 }, { "name": "LineSprite", "size": 1732 }, { "name": "RectSprite", "size": 3623 }, { "name": "TextSprite", "size": 10066 }] }, { "name": "flex", "children": [{ "name": "FlareVis", "size": 4116 }] }, { "name": "physics", "children": [{ "name": "DragForce", "size": 1082 }, { "name": "GravityForce", "size": 1336 }, { "name": "IForce", "size": 319 }, { "name": "NBodyForce", "size": 10498 }, { "name": "Particle", "size": 2822 }, { "name": "Simulation", "size": 9983 }, { "name": "Spring", "size": 2213 }, { "name": "SpringForce", "size": 1681 }] }, { "name": "query", "children": [{ "name": "AggregateExpression", "size": 1616 }, { "name": "And", "size": 1027 }, { "name": "Arithmetic", "size": 3891 }, { "name": "Average", "size": 891 }, { "name": "BinaryExpression", "size": 2893 }, { "name": "Comparison", "size": 5103 }, { "name": "CompositeExpression", "size": 3677 }, { "name": "Count", "size": 781 }, { "name": "DateUtil", "size": 4141 }, { "name": "Distinct", "size": 933 }, { "name": "Expression", "size": 5130 }, { "name": "ExpressionIterator", "size": 3617 }, { "name": "Fn", "size": 3240 }, { "name": "If", "size": 2732 }, { "name": "IsA", "size": 2039 }, { "name": "Literal", "size": 1214 }, { "name": "Match", "size": 3748 }, { "name": "Maximum", "size": 843 }, { "name": "methods", "children": [{ "name": "add", "size": 593 }, { "name": "and", "size": 330 }, { "name": "average", "size": 287 }, { "name": "count", "size": 277 }, { "name": "distinct", "size": 292 }, { "name": "div", "size": 595 }, { "name": "eq", "size": 594 }, { "name": "fn", "size": 460 }, { "name": "gt", "size": 603 }, { "name": "gte", "size": 625 }, { "name": "iff", "size": 748 }, { "name": "isa", "size": 461 }, { "name": "lt", "size": 597 }, { "name": "lte", "size": 619 }, { "name": "max", "size": 283 }, { "name": "min", "size": 283 }, { "name": "mod", "size": 591 }, { "name": "mul", "size": 603 }, { "name": "neq", "size": 599 }, { "name": "not", "size": 386 }, { "name": "or", "size": 323 }, { "name": "orderby", "size": 307 }, { "name": "range", "size": 772 }, { "name": "select", "size": 296 }, { "name": "stddev", "size": 363 }, { "name": "sub", "size": 600 }, { "name": "sum", "size": 280 }, { "name": "update", "size": 307 }, { "name": "variance", "size": 335 }, { "name": "where", "size": 299 }, { "name": "xor", "size": 354 }, { "name": "_", "size": 264 }] }, { "name": "Minimum", "size": 843 }, { "name": "Not", "size": 1554 }, { "name": "Or", "size": 970 }, { "name": "Query", "size": 13896 }, { "name": "Range", "size": 1594 }, { "name": "StringUtil", "size": 4130 }, { "name": "Sum", "size": 791 }, { "name": "Variable", "size": 1124 }, { "name": "Variance", "size": 1876 }, { "name": "Xor", "size": 1101 }] }, { "name": "scale", "children": [{ "name": "IScaleMap", "size": 2105 }, { "name": "LinearScale", "size": 1316 }, { "name": "LogScale", "size": 3151 }, { "name": "OrdinalScale", "size": 3770 }, { "name": "QuantileScale", "size": 2435 }, { "name": "QuantitativeScale", "size": 4839 }, { "name": "RootScale", "size": 1756 }, { "name": "Scale", "size": 4268 }, { "name": "ScaleType", "size": 1821 }, { "name": "TimeScale", "size": 5833 }] }, { "name": "util", "children": [{ "name": "Arrays", "size": 8258 }, { "name": "Colors", "size": 10001 }, { "name": "Dates", "size": 8217 }, { "name": "Displays", "size": 12555 }, { "name": "Filter", "size": 2324 }, { "name": "Geometry", "size": 10993 }, { "name": "heap", "children": [{ "name": "FibonacciHeap", "size": 9354 }, { "name": "HeapNode", "size": 1233 }] }, { "name": "IEvaluable", "size": 335 }, { "name": "IPredicate", "size": 383 }, { "name": "IValueProxy", "size": 874 }, { "name": "math", "children": [{ "name": "DenseMatrix", "size": 3165.........完整代码请登录后点击上方下载按钮下载查看
网友评论0