• Edit
  • Download
  • <!doctype html>
    <html class="zc-html">
    
    <head>
      <meta charset="utf-8">
      <title>ZingSoft Demo</title>
      <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
      <style>
        .chart--container {
          height: 100%;
          width: 100%;
          min-height: 530px;
        }
    
        .zc-ref {
          display: none;
        }
      </style>
    </head>
    ​
    
    <body class="zc-body">
      ​
      <div id="myChart" class="chart--container">
        <a href="https://www.zingchart.com/" rel="noopener" class="zc-ref">Powered by ZingChart</a>
      </div>
    
      <script>
        ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"]; // DEFINE DATA
        // -----------------------------
        let chartData = [{
          id: 'flare',
          text: 'flare',
          parent: ''
        }, {
          id: 'analytics',
          text: 'analytics',
          parent: 'flare'
        }, {
          id: 'cluster',
          text: 'cluster',
          parent: 'analytics'
        }, {
          id: 'agglomerativecluster',
          text: 'AgglomerativeCluster',
          parent: 'cluster',
          value: 3938
        }, {
          id: 'communitystructure',
          text: 'CommunityStructure',
          parent: 'cluster',
          value: 3812
        }, {
          id: 'hierarchicalcluster',
          text: 'HierarchicalCluster',
          parent: 'cluster',
          value: 6714
        }, {
          id: 'mergeedge',
          text: 'MergeEdge',
          parent: 'cluster',
          value: 743
        }, {
          id: 'graph',
          text: 'graph',
          parent: 'analytics'
        }, {
          id: 'betweennesscentrality',
          text: 'BetweennessCentrality',
          parent: 'graph',
          value: 3534
        }, {
          id: 'linkdistance',
          text: 'LinkDistance',
          parent: 'graph',
          value: 5731
        }, {
          id: 'maxflowmincut',
          text: 'MaxFlowMinCut',
          parent: 'graph',
          value: 7840
        }, {
          id: 'shortestpaths',
          text: 'ShortestPaths',
          parent: 'graph',
          value: 5914
        }, {
          id: 'spanningtree',
          text: 'SpanningTree',
          parent: 'graph',
          value: 3416
        }, {
          id: 'optimization',
          text: 'optimization',
          parent: 'analytics'
        }, {
          id: 'aspectratiobanker',
          text: 'AspectRatioBanker',
          parent: 'optimization',
          value: 7074
        }, {
          id: 'animate',
          text: 'animate',
          parent: 'flare'
        }, {
          id: 'easing',
          text: 'Easing',
          parent: 'animate',
          value: 17010
        }, {
          id: 'functionsequence',
          text: 'FunctionSequence',
          parent: 'animate',
          value: 5842
        }, {
          id: 'interpolate',
          text: 'interpolate',
          parent: 'animate'
        }, {
          id: 'arrayinterpolator',
          text: 'ArrayInterpolator',
          parent: 'interpolate',
          value: 1983
        }, {
          id: 'colorinterpolator',
          text: 'ColorInterpolator',
          parent: 'interpolate',
          value: 2047
        }, {
          id: 'dateinterpolator',
          text: 'DateInterpolator',
          parent: 'interpolate',
          value: 1375
        }, {
          id: 'interpolator',
          text: 'Interpolator',
          parent: 'interpolate',
          value: 8746
        }, {
          id: 'matrixinterpolator',
          text: 'MatrixInterpolator',
          parent: 'interpolate',
          value: 2202
        }, {
          id: 'numberinterpolator',
          text: 'NumberInterpolator',
          parent: 'interpolate',
          value: 1382
        }, {
          id: 'objectinterpolator',
          text: 'ObjectInterpolator',
          parent: 'interpolate',
          value: 1629
        }, {
          id: 'pointinterpolator',
          text: 'PointInterpolator',
          parent: 'interpolate',
          value: 1675
        }, {
          id: 'rectangleinterpolator',
          text: 'RectangleInterpolator',
          parent: 'interpolate',
          value: 2042
        }, {
          id: 'ischedulable',
          text: 'ISchedulable',
          parent: 'animate',
          value: 1041
        }, {
          id: 'parallel',
          text: 'Parallel',
          parent: 'animate',
          value: 5176
        }, {
          id: 'pause',
          text: 'Pause',
          parent: 'animate',
          value: 449
        }, {
          id: 'scheduler',
          text: 'Scheduler',
          parent: 'animate',
          value: 5593
        }, {
          id: 'sequence',
          text: 'Sequence',
          parent: 'animate',
          value: 5534
        }, {
          id: 'transition',
          text: 'Transition',
          parent: 'animate',
          value: 9201
        }, {
          id: 'transitioner',
          text: 'Transitioner',
          parent: 'animate',
          value: 19975
        }, {
          id: 'transitionevent',
          text: 'TransitionEvent',
          parent: 'animate',
          value: 1116
        }, {
          id: 'tween',
          text: 'Tween',
          parent: 'animate',
          value: 6006
        }, {
          id: 'data',
          text: 'data',
          parent: 'flare'
        }, {
          id: 'converters',
          text: 'converters',
          parent: 'data'
        }, {
          id: 'converters1',
          text: 'Converters',
          parent: 'converters',
          value: 721
        }, {
          id: 'delimitedtextconverter',
          text: 'DelimitedTextConverter',
          parent: 'converters',
          value: 4294
        }, {
          id: 'graphmlconverter',
          text: 'GraphMLConverter',
          parent: 'converters',
          value: 9800
        }, {
          id: 'idataconverter',
          text: 'IDataConverter',
          parent: 'converters',
          value: 1314
        }, {
          id: 'jsonconverter',
          text: 'JSONConverter',
          parent: 'converters',
          value: 2220
        }, {
          id: 'datafield',
          text: 'DataField',
          parent: 'data',
          value: 1759
        }, {
          id: 'dataschema',
          text: 'DataSchema',
          parent: 'data',
          value: 2165
        }, {
          id: 'dataset',
          text: 'DataSet',
          parent: 'data',
          value: 586
        }, {
          id: 'datasource',
          text: 'DataSource',
          parent: 'data',
          value: 3331
        }, {
          id: 'datatable',
          text: 'DataTable',
          parent: 'data',
          value: 772
        }, {
          id: 'datautil',
          text: 'DataUtil',
          parent: 'data',
          value: 3322
        }, {
          id: 'display',
          text: 'display',
          parent: 'flare'
        }, {
          id: 'dirtysprite',
          text: 'DirtySprite',
          parent: 'display',
          value: 8833
        }, {
          id: 'linesprite',
          text: 'LineSprite',
          parent: 'display',
          value: 1732
        }, {
          id: 'rectsprite',
          text: 'RectSprite',
          parent: 'display',
          value: 3623
        }, {
          id: 'textsprite',
          text: 'TextSprite',
          parent: 'display',
          value: 10066
        }, {
          id: 'flex',
          text: 'flex',
          parent: 'flare'
        }, {
          id: 'flarevis',
          text: 'FlareVis',
          parent: 'flex',
          value: 4116
        }, {
          id: 'physics',
          text: 'physics',
          parent: 'flare'
        }, {
          id: 'dragforce',
          text: 'DragForce',
          parent: 'physics',
          value: 1082
        }, {
          id: 'gravityforce',
          text: 'GravityForce',
          parent: 'physics',
          value: 1336
        }, {
          id: 'iforce',
          text: 'IForce',
          parent: 'physics',
          value: 319
        }, {
          id: 'nbodyforce',
          text: 'NBodyForce',
          parent: 'physics',
          value: 10498
        }, {
          id: 'particle',
          text: 'Particle',
          parent: 'physics',
          value: 2822
        }, {
          id: 'simulation',
          text: 'Simulation',
          parent: 'physics',
          value: 9983
        }, {
          id: 'spring',
          text: 'Spring',
          parent: 'physics',
          value: 2213
        }, {
          id: 'springforce',
          text: 'SpringForce',
          parent: 'physics',
          value: 1681
        }, {
          id: 'query',
          text: 'query',
          parent: 'flare'
        }, {
          id: 'aggregateexpression',
          text: 'AggregateExpression',
          parent: 'query',
          value: 1616
        }, {
          id: 'and',
          text: 'And',
          parent: 'query',
          value: 1027
        }, {
          id: 'arithmetic',
          text: 'Arithmetic',
          parent: 'query',
          value: 3891
        }, {
          id: 'average',
          text: 'Average',
          parent: 'query',
          value: 891
        }, {
          id: 'binaryexpression',
          text: 'BinaryExpression',
          parent: 'query',
          value: 2893
        }, {
          id: 'comparison',
          text: 'Comparison',
          parent: 'query',
          value: 5103
        }, {
          id: 'compositeexpression',
          text: 'CompositeExpression',
          parent: 'query',
          value: 3677
        }, {
          id: 'count',
          text: 'Count',
          parent: 'query',
          value: 781
        }, {
          id: 'dateutil',
          text: 'DateUtil',
          parent: 'query',
          value: 4141
        }, {
          id: 'distinct',
          text: 'Distinct',
          parent: 'query',
          value: 933
        }, {
          id: 'expression',
          text: 'Expression',
          parent: 'query',
          value: 5130
        }, {
          id: 'expressioniterator',
          text: 'ExpressionIterator',
          parent: 'query',
          value: 3617
        }, {
          id: 'fn',
          text: 'Fn',
          parent: 'query',
          value: 3240
        }, {
          id: 'if',
          text: 'If',
          parent: 'query',
          value: 2732
        }, {
          id: 'isa',
          text: 'IsA',
          parent: 'query',
          value: 2039
        }, {
          id: 'literal',
          text: 'Literal',
          parent: 'query',
          value: 1214
        }, {
          id: 'match',
          text: 'Match',
          parent: 'query',
          value: 3748
        }, {
          id: 'maximum',
          text: 'Maximum',
          parent: 'query',
          value: 843
        }, {
          id: 'methods',
          text: 'methods',
          parent: 'query'
        }, {
          id: 'add',
          text: 'add',
          parent: 'methods',
          value: 593
        }, {
          id: 'and1',
          text: 'and',
          parent: 'methods',
          value: 330
        }, {
          id: 'average1',
          text: 'average',
          parent: 'methods',
          value: 287
        }, {
          id: 'count1',
          text: 'count',
          parent: 'methods',
          value: 277
        }, {
          id: 'distinct1',
          text: 'distinct',
          parent: 'methods',
          value: 292
        }, {
          id: 'div',
          text: 'div',
          parent: 'methods',
          value: 595
        }, {
          id: 'eq',
          text: 'eq',
          parent: 'methods',
          value: 594
        }, {
          id: 'fn1',
          text: 'fn',
          parent: 'methods',
          value: 460
        }, {
          id: 'gt',
          text: 'gt',
          parent: 'methods',
          value: 603
        }, {
          id: 'gte',
          text: 'gte',
          parent: 'methods',
          value: 625
        }, {
          id: 'iff',
          text: 'iff',
          parent: 'methods',
          value: 748
        }, {
          id: 'isa1',
          text: 'isa',
          parent: 'methods',
          value: 461
        }, {
          id: 'lt',
          text: 'lt',
          parent: 'methods',
          value: 597
        }, {
          id: 'lte',
          text: 'lte',
          parent: 'methods',
          value: 619
        }, {
          id: 'max',
          text: 'max',
          parent: 'methods',
          value: 283
        }, {
          id: 'min',
          text: 'min',
          parent: 'methods',
          value: 283
        }, {
          id: 'mod',
          text: 'mod',
          parent: 'methods',
          value: 591
        }, {
          id: 'mul',
          text: 'mul',
          parent: 'methods',
          value: 603
        }, {
          id: 'neq',
          text: 'neq',
          parent: 'methods',
          value: 599
        }, {
          id: 'not',
          text: 'not',
          parent: 'methods',
          value: 386
        }, {
          id: 'or',
          text: 'or',
          parent: 'methods',
          value: 323
        }, {
          id: 'orderby',
          text: 'orderby',
          parent: 'methods',
          value: 307
        }, {
          id: 'range',
          text: 'range',
          parent: 'methods',
          value: 772
        }, {
          id: 'select',
          text: 'select',
          parent: 'methods',
          value: 296
        }, {
          id: 'stddev',
          text: 'stddev',
          parent: 'methods',
          value: 363
        }, {
          id: 'sub',
          text: 'sub',
          parent: 'methods',
          value: 600
        }, {
          id: 'sum',
          text: 'sum',
          parent: 'methods',
          value: 280
        }, {
          id: 'update',
          text: 'update',
          parent: 'methods',
          value: 307
        }, {
          id: 'variance',
          text: 'variance',
          parent: 'methods',
          value: 335
        }, {
          id: 'where',
          text: 'where',
          parent: 'methods',
          value: 299
        }, {
          id: 'xor',
          text: 'xor',
          parent: 'methods',
          value: 354
        }, {
          id: '_',
          text: '_',
          parent: 'methods',
          value: 264
        }, {
          id: 'minimum',
          text: 'Minimum',
          parent: 'query',
          value: 843
        }, {
          id: 'not1',
          text: 'Not',
          parent: 'query',
          value: 1554
        }, {
          id: 'or1',
          text: 'Or',
          parent: 'query',
          value: 970
        }, {
          id: 'query1',
          text: 'Query',
          parent: 'query',
          value: 13896
        }, {
          id: 'range1',
          text: 'Range',
          parent: 'query',
          value: 1594
        }, {
          id: 'stringutil',
          text: 'StringUtil',
          parent: 'query',
          value: 4130
        }, {
          id: 'sum1',
          text: 'Sum',
          parent: 'query',
          value: 791
        }, {
          id: 'variable',
          text: 'Variable',
          parent: 'query',
          value: 1124
        }, {
          id: 'variance1',
          text: 'Variance',
          parent: 'query',
          value: 1876
        }, {
          id: 'xor1',
          text: 'Xor',
          parent: 'query',
          value: 1101
        }, {
          id: 'scale',
          text: 'scale',
          parent: 'flare'
        }, {
          id: 'iscalemap',
          text: 'IScaleMap',
          parent: 'scale',
          value: 2105
        }, {
          id: 'linearscale',
          text: 'LinearScale',
          parent: 'scale',
          value: 1316
        }, {
          id: 'logscale',
          text: 'LogScale',
          parent: 'scale',
          value: 3151
        }, {
          id: 'ordinalscale',
          text: 'OrdinalScale',
          parent: 'scale',
          value: 3770
        }, {
          id: 'quantilescale',
          text: 'QuantileScale',
          parent: 'scale',
          value: 2435
        }, {
          id: 'quantitativescale',
          text: 'QuantitativeScale',
          parent: 'scale',
          value: 4839
        }, {
          id: 'rootscale',
          text: 'RootScale',
          parent: 'scale',
          value: 1756
        }, {
          id: 'scale1',
          text: 'Scale',
          parent: 'scale',
          value: 4268
        }, {
          id: 'scaletype',
          text: 'ScaleType',
          parent: 'scale',
          value: 1821
        }, {
          id: 'timescale',
          text: 'TimeScale',
          parent: 'scale',
          value: 5833
        }, {
          id: 'util',
          text: 'util',
          parent: 'flare'
        }, {
          id: 'arrays',
          text: 'Arrays',
          parent: 'util',
          value: 8258
        }, {
          id: 'colors',
          text: 'Colors',
          parent: 'util',
          value: 10001
        }, {
          id: 'dates',
          text: 'Dates',
          parent: 'util',
          value: 8217
        }, {
          id: 'displays',
          text: 'Displays',
          parent: 'util',
          value: 12555
        }, {
          id: 'filter',
          text: 'Filter',
          parent: 'util',
          value: 2324
        }, {
          id: 'geometry',
          text: 'Geometry',
          parent: 'util',
          value: 10993
        }, {
          id: 'heap',
          text: 'heap',
          parent: 'util'
        }, {
          id: 'fibonacciheap',
          text: 'FibonacciHeap',
          parent: 'heap',
          value: 9354
        }, {
          id: 'heapnode',
          text: 'HeapNode',
          parent: 'heap',
          value: 1233
        }, {
          id: 'ievaluable',
          text: 'IEvaluable',
          parent: 'util',
          value: 335
        }, {
          id: 'ipredicate',
          text: 'IPredicate',
          parent: 'util',
          value: 383
        }, {
          id: 'ivalueproxy',
          text: 'IValueProxy',
          parent: 'util',
          value: 874
        }, {
          id: 'math',
          text: 'math',
          parent: 'util'
        }, {
          id: 'densematrix',
          text: 'DenseMatrix',
          parent: 'math',
          value: 3165
        }, {
          id: 'imatrix',
          text: 'IMatrix',
          parent: 'math',
          value: 2815
        }, {
          id: 'sparsematrix',
          text: 'SparseMatrix',
          parent: 'math',
          value: 3366
        }, {
          id: 'maths',
          text: 'Maths',
          parent: 'util',
          value: 17705
        }, {
          id: 'orientation',
          text: 'Orientation',
          parent: 'util',
          value: 1486
        }, {
          id: 'palette',
          text: 'palette',
          parent: 'util'
        }, {
          id: 'colorpalette',
          text: 'ColorPalette',
          parent: 'palette',
          value: 6367
        }, {
          id: 'palette1',
          text: 'Palette',
          parent: 'palette',
          value: 1229
        }, {
          id: 'shapepalette',
          text: 'ShapePalette',
          parent: 'palette',
          value: 2059
        }, {
          id: 'sizepalette',
          text: 'SizePalette',
          parent: 'palette',
          value: 2291
        }, {
          id: 'property',
          text: 'Property',
          parent: 'util',
          value: 5559
        }, {
          id: 'shapes',
          text: 'Shapes',
          parent: 'util',
          value: 19118
        }, {
          id: 'sort',
          text: 'Sort',
          parent: 'util',
          value: 6887
        }, {
          id: 'stats',
          text: 'Stats',
          parent: 'util',
          value: 6557
        }, {
          id: 'strings',
          text: 'Strings',
          parent: 'util',
          value: 22026
        }, {
          id: 'vis',
          text: 'vis',
          parent: 'flare'
        }, {
          id: 'axis',
          text: 'axis',
          parent: 'vis'
        }, {
          id: 'axes',
          text: 'Axes',
          parent: 'axis',
          value: 1302
        }, {
          id: 'axis1',
          text: 'Axis',
          parent: 'axis',
          value: 24593
        }, {
          id: 'axisgridline',
          text: 'AxisGridLine',
          parent: 'axis',
          value: 652
        }, {
          id: 'axislabel',
          text: 'AxisLabel',
          parent: 'axis',
          value: 636
        }, {
          id: 'cartesianaxes',
          text: 'CartesianAxes',
          parent: 'axis',
          value: 6703
        }, {
          id: 'controls',
          text: 'controls',
          parent: 'vis'
        }, {
          id: 'anchorcontrol',
          text: 'AnchorControl',
          parent: 'controls',
          value: 2138
        }, {
          id: 'clickcontrol',
          text: 'ClickControl',
          parent: 'controls',
          value: 3824
        }, {
          id: 'control',
          text: 'Control',
          parent: 'controls',
          value: 1353
        }, {
          id: 'controllist',
          text: 'ControlList',
          parent: 'controls',
          value: 4665
        }, {
          id: 'dragcontrol',
          text: 'DragControl',
          parent: 'controls',
          value: 2649
        }, {
          id: 'expandcontrol',
          text: 'ExpandControl',
          parent: 'controls',
          value: 2832
        }, {
          id: 'hovercontrol',
          text: 'HoverControl',
          parent: 'controls',
          value: 4896
        }, {
          id: 'icontrol',
          text: 'IControl',
          parent: 'controls',
          value: 763
        }, {
          id: 'panzoomcontrol',
          text: 'PanZoomControl',
          parent: 'controls',
          value: 5222
        }, {
          id: 'selectioncontrol',
          text: 'SelectionControl',
          parent: 'controls',
          value: 7862
        }, {
          id: 'tooltipcontrol',
          text: 'TooltipControl',
          parent: 'controls',
          value: 8435
        }, {
          id: 'data1',
          text: 'data',
          parent: 'vis'
        }, {
          id: 'data2',
          text: 'Data',
          parent: 'data1',
          value: 20544
        }, {
          id: 'datalist',
          text: 'DataList',
          parent: 'data1',
          value: 19788
        }, {
          id: 'datasprite',
          text: 'DataSprite',
          parent: 'data1',
          value: 10349
        }, {
          id: 'edgesprite',
          text: 'EdgeSprite',
          parent: 'data1',
          value: 3301
        }, {
          id: 'nodesprite',
          text: 'NodeSprite',
          parent: 'data1',
          value: 19382
        }, {
          id: 'render',
          text: 'render',
          parent: 'data1'
        }, {
          id: 'arrowtype',
          text: 'ArrowType',
          parent: 'render',
          value: 698
        }, {
          id: 'edgerenderer',
          text: 'EdgeRenderer',
          parent: 'render',
          value: 5569
        }, {
          id: 'irenderer',
          text: 'IRenderer',
          parent: 'render',
          value: 353
        }, {
          id: 'shaperenderer',
          text: 'ShapeRenderer',
          parent: 'render',
          value: 2247
        }, {
          id: 'scalebinding',
          text: 'ScaleBinding',
          parent: 'data1',
          value: 11275
        }, {
          id: 'tree',
          text: 'Tree',
          parent: 'data1',
          value: 7147
        }, {
          id: 'treebuilder',
          text: 'TreeBuilder',
          parent: 'data1',
          value: 9930
        }, {
          id: 'events',
          text: 'events',
          parent: 'vis'
        }, {
          id: 'dataevent',
          text: 'DataEvent',
          parent: 'events',
          value: 2313
        }, {
          id: 'selectionevent',
          text: 'SelectionEvent',
          parent: 'events',
          value: 1880
        }, {
          id: 'tooltipevent',
          text: 'TooltipEvent',
          parent: 'events',
          value: 1701
        }, {
          id: 'visualizationevent',
          text: 'VisualizationEvent',
          parent: 'events',
          value: 1117
        }, {
          id: 'legend',
          text: 'legend',
          parent: 'vis'
        }, {
          id: 'legend1',
          text: 'Legend',
          parent: 'legend',
          value: 20859
        }, {
          id: 'legenditem',
          text: 'LegendItem',
          parent: 'legend',
          value: 4614
        }, {
          id: 'legendrange',
          text: 'LegendRange',
          parent: 'legend',
          value: 10530
        }, {
          id: 'operator',
          text: 'operator',
          parent: 'vis'
        }, {
          id: 'distortion',
          text: 'distortion',
          parent: 'operator'
        }, {
          id: 'bifocaldistortion',
          text: 'BifocalDistortion',
          parent: 'distortion',
          value: 4461
        }, {
          id: 'distortion1',
          text: 'Distortion',
          parent: 'distortion',
          value: 6314
        }, {
          id: 'fisheyedistortion',
          text: 'FisheyeDistortion',
          parent: 'distortion',
          value: 3444
        }, {
          id: 'encoder',
          text: 'encoder',
          parent: 'operator'
        }, {
          id: 'colorencoder',
          text: 'ColorEncoder',
          parent: 'encoder',
          value: 3179
        }, {
          id: 'encoder1',
          text: 'Encoder',
          parent: 'encoder',
          value: 4060
        }, {
          id: 'propertyencoder',
          text: 'PropertyEncoder',
          parent: 'encoder',
          value: 4138
        }, {
          id: 'shapeencoder',
          text: 'ShapeEncoder',
          parent: 'encoder',
          value: 1690
        }, {
          id: 'sizeencoder',
          text: 'SizeEncoder',
          parent: 'encoder',
          value: 1830
        }, {
          id: 'filter1',
          text: 'filter',
          parent: 'operator'
        }, {
          id: 'fisheyetreefilter',
          text: 'FisheyeTreeFilter',
          parent: 'filter1',
          value: 5219
        }, {
          id: 'graphdistancefilter',
          text: 'GraphDistanceFilter',
          parent: 'filter1',
          value: 3165
        }, {
          id: 'visibilityfilter',
          text: 'VisibilityFilter',
          parent: 'filter1',
          value: 3509
        }, {
          id: 'ioperator',
          text: 'IOperator',
          parent: 'operator',
          value: 1286
        }, {
          id: 'label',
          text: 'label',
          parent: 'operator'
        }, {
          id: 'labeler',
          text: 'Labeler',
          parent: 'label',
          value: 9956
        }, {
          id: 'radiallabeler',
          text: 'RadialLabeler',
          parent: 'label',
          value: 3899
        }, {
          id: 'stackedarealabeler',
          text: 'StackedAreaLabeler',
          parent: 'label',
          value: 3202
        }, {
          id: 'layout',
          text: 'layout',
          parent: 'operator'
        }, {
          id: 'axislayout',
          text: 'AxisLayout',
          parent: 'layout',
          value: 6725
        }, {
          id: 'bundlededgerouter',
          text: 'BundledEdgeRouter',
          parent: 'layout',
          value: 3727
        }, {
          id: 'circlelayout',
          text: 'CircleLayout',
          parent: 'layout',
          value: 9317
        }, {
          id: 'circlepackinglayout',
          text: 'CirclePackingLayout',
          parent: 'layout',
          value: 12003
        }, {
          id: 'dendrogramlayout',
          text: 'DendrogramLayout',
          parent: 'layout',
          value: 4853
        }, {
          id: 'forcedirectedlayout',
          text: 'ForceDirectedLayout',
          parent: 'layout',
          value: 8411
        }, {
          id: 'icicletreelayout',
          text: 'IcicleTreeLayout',
          parent: 'layout',
          value: 4864
        }, {
          id: 'indentedtreelayout',
          text: 'IndentedTreeLayout',
          parent: 'layout',
          value: 3174
        }, {
          id: 'layout1',
          text: 'Layout',
          parent: 'layout',
          value: 7881
        }, {
          id: 'nodelinktreelayout',
          text: 'NodeLinkTreeLayout',
          parent: 'layout',
          value: 12870
        }, {
          id: 'pielayout',
          text: 'PieLayout',
          parent: 'layout',
          value: 2728
        }, {
          id: 'radialtreelayout',
          text: 'RadialTreeLayout',
          parent: 'layout',
          value: 12348
        }, {
          id: 'randomlayout',
          text: 'RandomLayout',
          parent: 'layout',
          value: 870
        }, {
          id: 'stackedarealayout',
          text: 'StackedAreaLayout',
          parent: 'layout',
          value: 9121
        }, {
          id: 'treemaplayout',
          text: 'TreeMapLayout',
          parent: 'layout',
          value: 9191
        }, {
          id: 'operator1',
          text: 'Operator',
          parent: 'operator',
          value: 2490
        }, {
          id: 'operatorlist',
          text: 'OperatorList',
          parent: 'operator',
          value: 5248
        }, {
          id: 'operatorsequence',
          text: 'OperatorSequence',
          parent: 'operator',
          value: 4190
        }, {
          id: 'operatorswitch',
          text: 'OperatorSwitch',
          parent: 'operator',
          value: 2581
        }, {
          id: 'sortoperator',
          text: 'SortOperator',
          parent: 'operator',
          value: 2023
        }, {
          id: 'visualization',
          text: 'Visualization',
          parent: 'vis',
          value: 16540
        }];
    
        // CHART CONFIG
        // -----------------------------
        let chartConfig = {
          type: 'sunburst',
          backgroundColor: '#fff',
          borderColor: '#000',
          borderWidth: '1px',
          title: {
            text: 'Irregular Sunburst - File System Data'
          },
          options: {
            slice: 0,
            space: 0
          },
          plot: {
            animation: {},
            valueBox: {
              text: '%data-vbtext',
              color: '#000',
              fontSize: '10px',
              visible: null
            },
            tooltipText: '<span style=\'font-size:19px\'>%plot-text</span><br/>Size: %node-value',
            alpha: 1
          },
          plotarea: {
            margin: '40px 0px 0px 0px',
            borderColor: '#000',
            borderWidth: '1px',
          },
          tooltip: {
            align: 'left',
            thousandsSeparator: ','
          },
          series: chartData
        };
    
        // RENDER CHARTS
        // -----------------------------
        zingchart.render({
          id: 'myChart',
          data: chartConfig
        });
      </script>
    </body>
    
    </html>
    <!doctype html>
    <html class="zc-html">
    
    <head>
      <meta charset="utf-8">
      <title>ZingSoft Demo</title>
      <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    </head>
    ​
    
    <body class="zc-body">
      ​
      <div id="myChart" class="chart--container">
        <a href="https://www.zingchart.com/" rel="noopener" class="zc-ref">Powered by ZingChart</a>
      </div>
    
    </body>
    
    </html>
    .chart--container {
      height: 100%;
      width: 100%;
      min-height: 530px;
    }
    
    .zc-ref {
      display: none;
    }
    // DEFINE DATA
    // -----------------------------
    let chartData = [{
      id: 'flare',
      text: 'flare',
      parent: ''
    }, {
      id: 'analytics',
      text: 'analytics',
      parent: 'flare'
    }, {
      id: 'cluster',
      text: 'cluster',
      parent: 'analytics'
    }, {
      id: 'agglomerativecluster',
      text: 'AgglomerativeCluster',
      parent: 'cluster',
      value: 3938
    }, {
      id: 'communitystructure',
      text: 'CommunityStructure',
      parent: 'cluster',
      value: 3812
    }, {
      id: 'hierarchicalcluster',
      text: 'HierarchicalCluster',
      parent: 'cluster',
      value: 6714
    }, {
      id: 'mergeedge',
      text: 'MergeEdge',
      parent: 'cluster',
      value: 743
    }, {
      id: 'graph',
      text: 'graph',
      parent: 'analytics'
    }, {
      id: 'betweennesscentrality',
      text: 'BetweennessCentrality',
      parent: 'graph',
      value: 3534
    }, {
      id: 'linkdistance',
      text: 'LinkDistance',
      parent: 'graph',
      value: 5731
    }, {
      id: 'maxflowmincut',
      text: 'MaxFlowMinCut',
      parent: 'graph',
      value: 7840
    }, {
      id: 'shortestpaths',
      text: 'ShortestPaths',
      parent: 'graph',
      value: 5914
    }, {
      id: 'spanningtree',
      text: 'SpanningTree',
      parent: 'graph',
      value: 3416
    }, {
      id: 'optimization',
      text: 'optimization',
      parent: 'analytics'
    }, {
      id: 'aspectratiobanker',
      text: 'AspectRatioBanker',
      parent: 'optimization',
      value: 7074
    }, {
      id: 'animate',
      text: 'animate',
      parent: 'flare'
    }, {
      id: 'easing',
      text: 'Easing',
      parent: 'animate',
      value: 17010
    }, {
      id: 'functionsequence',
      text: 'FunctionSequence',
      parent: 'animate',
      value: 5842
    }, {
      id: 'interpolate',
      text: 'interpolate',
      parent: 'animate'
    }, {
      id: 'arrayinterpolator',
      text: 'ArrayInterpolator',
      parent: 'interpolate',
      value: 1983
    }, {
      id: 'colorinterpolator',
      text: 'ColorInterpolator',
      parent: 'interpolate',
      value: 2047
    }, {
      id: 'dateinterpolator',
      text: 'DateInterpolator',
      parent: 'interpolate',
      value: 1375
    }, {
      id: 'interpolator',
      text: 'Interpolator',
      parent: 'interpolate',
      value: 8746
    }, {
      id: 'matrixinterpolator',
      text: 'MatrixInterpolator',
      parent: 'interpolate',
      value: 2202
    }, {
      id: 'numberinterpolator',
      text: 'NumberInterpolator',
      parent: 'interpolate',
      value: 1382
    }, {
      id: 'objectinterpolator',
      text: 'ObjectInterpolator',
      parent: 'interpolate',
      value: 1629
    }, {
      id: 'pointinterpolator',
      text: 'PointInterpolator',
      parent: 'interpolate',
      value: 1675
    }, {
      id: 'rectangleinterpolator',
      text: 'RectangleInterpolator',
      parent: 'interpolate',
      value: 2042
    }, {
      id: 'ischedulable',
      text: 'ISchedulable',
      parent: 'animate',
      value: 1041
    }, {
      id: 'parallel',
      text: 'Parallel',
      parent: 'animate',
      value: 5176
    }, {
      id: 'pause',
      text: 'Pause',
      parent: 'animate',
      value: 449
    }, {
      id: 'scheduler',
      text: 'Scheduler',
      parent: 'animate',
      value: 5593
    }, {
      id: 'sequence',
      text: 'Sequence',
      parent: 'animate',
      value: 5534
    }, {
      id: 'transition',
      text: 'Transition',
      parent: 'animate',
      value: 9201
    }, {
      id: 'transitioner',
      text: 'Transitioner',
      parent: 'animate',
      value: 19975
    }, {
      id: 'transitionevent',
      text: 'TransitionEvent',
      parent: 'animate',
      value: 1116
    }, {
      id: 'tween',
      text: 'Tween',
      parent: 'animate',
      value: 6006
    }, {
      id: 'data',
      text: 'data',
      parent: 'flare'
    }, {
      id: 'converters',
      text: 'converters',
      parent: 'data'
    }, {
      id: 'converters1',
      text: 'Converters',
      parent: 'converters',
      value: 721
    }, {
      id: 'delimitedtextconverter',
      text: 'DelimitedTextConverter',
      parent: 'converters',
      value: 4294
    }, {
      id: 'graphmlconverter',
      text: 'GraphMLConverter',
      parent: 'converters',
      value: 9800
    }, {
      id: 'idataconverter',
      text: 'IDataConverter',
      parent: 'converters',
      value: 1314
    }, {
      id: 'jsonconverter',
      text: 'JSONConverter',
      parent: 'converters',
      value: 2220
    }, {
      id: 'datafield',
      text: 'DataField',
      parent: 'data',
      value: 1759
    }, {
      id: 'dataschema',
      text: 'DataSchema',
      parent: 'data',
      value: 2165
    }, {
      id: 'dataset',
      text: 'DataSet',
      parent: 'data',
      value: 586
    }, {
      id: 'datasource',
      text: 'DataSource',
      parent: 'data',
      value: 3331
    }, {
      id: 'datatable',
      text: 'DataTable',
      parent: 'data',
      value: 772
    }, {
      id: 'datautil',
      text: 'DataUtil',
      parent: 'data',
      value: 3322
    }, {
      id: 'display',
      text: 'display',
      parent: 'flare'
    }, {
      id: 'dirtysprite',
      text: 'DirtySprite',
      parent: 'display',
      value: 8833
    }, {
      id: 'linesprite',
      text: 'LineSprite',
      parent: 'display',
      value: 1732
    }, {
      id: 'rectsprite',
      text: 'RectSprite',
      parent: 'display',
      value: 3623
    }, {
      id: 'textsprite',
      text: 'TextSprite',
      parent: 'display',
      value: 10066
    }, {
      id: 'flex',
      text: 'flex',
      parent: 'flare'
    }, {
      id: 'flarevis',
      text: 'FlareVis',
      parent: 'flex',
      value: 4116
    }, {
      id: 'physics',
      text: 'physics',
      parent: 'flare'
    }, {
      id: 'dragforce',
      text: 'DragForce',
      parent: 'physics',
      value: 1082
    }, {
      id: 'gravityforce',
      text: 'GravityForce',
      parent: 'physics',
      value: 1336
    }, {
      id: 'iforce',
      text: 'IForce',
      parent: 'physics',
      value: 319
    }, {
      id: 'nbodyforce',
      text: 'NBodyForce',
      parent: 'physics',
      value: 10498
    }, {
      id: 'particle',
      text: 'Particle',
      parent: 'physics',
      value: 2822
    }, {
      id: 'simulation',
      text: 'Simulation',
      parent: 'physics',
      value: 9983
    }, {
      id: 'spring',
      text: 'Spring',
      parent: 'physics',
      value: 2213
    }, {
      id: 'springforce',
      text: 'SpringForce',
      parent: 'physics',
      value: 1681
    }, {
      id: 'query',
      text: 'query',
      parent: 'flare'
    }, {
      id: 'aggregateexpression',
      text: 'AggregateExpression',
      parent: 'query',
      value: 1616
    }, {
      id: 'and',
      text: 'And',
      parent: 'query',
      value: 1027
    }, {
      id: 'arithmetic',
      text: 'Arithmetic',
      parent: 'query',
      value: 3891
    }, {
      id: 'average',
      text: 'Average',
      parent: 'query',
      value: 891
    }, {
      id: 'binaryexpression',
      text: 'BinaryExpression',
      parent: 'query',
      value: 2893
    }, {
      id: 'comparison',
      text: 'Comparison',
      parent: 'query',
      value: 5103
    }, {
      id: 'compositeexpression',
      text: 'CompositeExpression',
      parent: 'query',
      value: 3677
    }, {
      id: 'count',
      text: 'Count',
      parent: 'query',
      value: 781
    }, {
      id: 'dateutil',
      text: 'DateUtil',
      parent: 'query',
      value: 4141
    }, {
      id: 'distinct',
      text: 'Distinct',
      parent: 'query',
      value: 933
    }, {
      id: 'expression',
      text: 'Expression',
      parent: 'query',
      value: 5130
    }, {
      id: 'expressioniterator',
      text: 'ExpressionIterator',
      parent: 'query',
      value: 3617
    }, {
      id: 'fn',
      text: 'Fn',
      parent: 'query',
      value: 3240
    }, {
      id: 'if',
      text: 'If',
      parent: 'query',
      value: 2732
    }, {
      id: 'isa',
      text: 'IsA',
      parent: 'query',
      value: 2039
    }, {
      id: 'literal',
      text: 'Literal',
      parent: 'query',
      value: 1214
    }, {
      id: 'match',
      text: 'Match',
      parent: 'query',
      value: 3748
    }, {
      id: 'maximum',
      text: 'Maximum',
      parent: 'query',
      value: 843
    }, {
      id: 'methods',
      text: 'methods',
      parent: 'query'
    }, {
      id: 'add',
      text: 'add',
      parent: 'methods',
      value: 593
    }, {
      id: 'and1',
      text: 'and',
      parent: 'methods',
      value: 330
    }, {
      id: 'average1',
      text: 'average',
      parent: 'methods',
      value: 287
    }, {
      id: 'count1',
      text: 'count',
      parent: 'methods',
      value: 277
    }, {
      id: 'distinct1',
      text: 'distinct',
      parent: 'methods',
      value: 292
    }, {
      id: 'div',
      text: 'div',
      parent: 'methods',
      value: 595
    }, {
      id: 'eq',
      text: 'eq',
      parent: 'methods',
      value: 594
    }, {
      id: 'fn1',
      text: 'fn',
      parent: 'methods',
      value: 460
    }, {
      id: 'gt',
      text: 'gt',
      parent: 'methods',
      value: 603
    }, {
      id: 'gte',
      text: 'gte',
      parent: 'methods',
      value: 625
    }, {
      id: 'iff',
      text: 'iff',
      parent: 'methods',
      value: 748
    }, {
      id: 'isa1',
      text: 'isa',
      parent: 'methods',
      value: 461
    }, {
      id: 'lt',
      text: 'lt',
      parent: 'methods',
      value: 597
    }, {
      id: 'lte',
      text: 'lte',
      parent: 'methods',
      value: 619
    }, {
      id: 'max',
      text: 'max',
      parent: 'methods',
      value: 283
    }, {
      id: 'min',
      text: 'min',
      parent: 'methods',
      value: 283
    }, {
      id: 'mod',
      text: 'mod',
      parent: 'methods',
      value: 591
    }, {
      id: 'mul',
      text: 'mul',
      parent: 'methods',
      value: 603
    }, {
      id: 'neq',
      text: 'neq',
      parent: 'methods',
      value: 599
    }, {
      id: 'not',
      text: 'not',
      parent: 'methods',
      value: 386
    }, {
      id: 'or',
      text: 'or',
      parent: 'methods',
      value: 323
    }, {
      id: 'orderby',
      text: 'orderby',
      parent: 'methods',
      value: 307
    }, {
      id: 'range',
      text: 'range',
      parent: 'methods',
      value: 772
    }, {
      id: 'select',
      text: 'select',
      parent: 'methods',
      value: 296
    }, {
      id: 'stddev',
      text: 'stddev',
      parent: 'methods',
      value: 363
    }, {
      id: 'sub',
      text: 'sub',
      parent: 'methods',
      value: 600
    }, {
      id: 'sum',
      text: 'sum',
      parent: 'methods',
      value: 280
    }, {
      id: 'update',
      text: 'update',
      parent: 'methods',
      value: 307
    }, {
      id: 'variance',
      text: 'variance',
      parent: 'methods',
      value: 335
    }, {
      id: 'where',
      text: 'where',
      parent: 'methods',
      value: 299
    }, {
      id: 'xor',
      text: 'xor',
      parent: 'methods',
      value: 354
    }, {
      id: '_',
      text: '_',
      parent: 'methods',
      value: 264
    }, {
      id: 'minimum',
      text: 'Minimum',
      parent: 'query',
      value: 843
    }, {
      id: 'not1',
      text: 'Not',
      parent: 'query',
      value: 1554
    }, {
      id: 'or1',
      text: 'Or',
      parent: 'query',
      value: 970
    }, {
      id: 'query1',
      text: 'Query',
      parent: 'query',
      value: 13896
    }, {
      id: 'range1',
      text: 'Range',
      parent: 'query',
      value: 1594
    }, {
      id: 'stringutil',
      text: 'StringUtil',
      parent: 'query',
      value: 4130
    }, {
      id: 'sum1',
      text: 'Sum',
      parent: 'query',
      value: 791
    }, {
      id: 'variable',
      text: 'Variable',
      parent: 'query',
      value: 1124
    }, {
      id: 'variance1',
      text: 'Variance',
      parent: 'query',
      value: 1876
    }, {
      id: 'xor1',
      text: 'Xor',
      parent: 'query',
      value: 1101
    }, {
      id: 'scale',
      text: 'scale',
      parent: 'flare'
    }, {
      id: 'iscalemap',
      text: 'IScaleMap',
      parent: 'scale',
      value: 2105
    }, {
      id: 'linearscale',
      text: 'LinearScale',
      parent: 'scale',
      value: 1316
    }, {
      id: 'logscale',
      text: 'LogScale',
      parent: 'scale',
      value: 3151
    }, {
      id: 'ordinalscale',
      text: 'OrdinalScale',
      parent: 'scale',
      value: 3770
    }, {
      id: 'quantilescale',
      text: 'QuantileScale',
      parent: 'scale',
      value: 2435
    }, {
      id: 'quantitativescale',
      text: 'QuantitativeScale',
      parent: 'scale',
      value: 4839
    }, {
      id: 'rootscale',
      text: 'RootScale',
      parent: 'scale',
      value: 1756
    }, {
      id: 'scale1',
      text: 'Scale',
      parent: 'scale',
      value: 4268
    }, {
      id: 'scaletype',
      text: 'ScaleType',
      parent: 'scale',
      value: 1821
    }, {
      id: 'timescale',
      text: 'TimeScale',
      parent: 'scale',
      value: 5833
    }, {
      id: 'util',
      text: 'util',
      parent: 'flare'
    }, {
      id: 'arrays',
      text: 'Arrays',
      parent: 'util',
      value: 8258
    }, {
      id: 'colors',
      text: 'Colors',
      parent: 'util',
      value: 10001
    }, {
      id: 'dates',
      text: 'Dates',
      parent: 'util',
      value: 8217
    }, {
      id: 'displays',
      text: 'Displays',
      parent: 'util',
      value: 12555
    }, {
      id: 'filter',
      text: 'Filter',
      parent: 'util',
      value: 2324
    }, {
      id: 'geometry',
      text: 'Geometry',
      parent: 'util',
      value: 10993
    }, {
      id: 'heap',
      text: 'heap',
      parent: 'util'
    }, {
      id: 'fibonacciheap',
      text: 'FibonacciHeap',
      parent: 'heap',
      value: 9354
    }, {
      id: 'heapnode',
      text: 'HeapNode',
      parent: 'heap',
      value: 1233
    }, {
      id: 'ievaluable',
      text: 'IEvaluable',
      parent: 'util',
      value: 335
    }, {
      id: 'ipredicate',
      text: 'IPredicate',
      parent: 'util',
      value: 383
    }, {
      id: 'ivalueproxy',
      text: 'IValueProxy',
      parent: 'util',
      value: 874
    }, {
      id: 'math',
      text: 'math',
      parent: 'util'
    }, {
      id: 'densematrix',
      text: 'DenseMatrix',
      parent: 'math',
      value: 3165
    }, {
      id: 'imatrix',
      text: 'IMatrix',
      parent: 'math',
      value: 2815
    }, {
      id: 'sparsematrix',
      text: 'SparseMatrix',
      parent: 'math',
      value: 3366
    }, {
      id: 'maths',
      text: 'Maths',
      parent: 'util',
      value: 17705
    }, {
      id: 'orientation',
      text: 'Orientation',
      parent: 'util',
      value: 1486
    }, {
      id: 'palette',
      text: 'palette',
      parent: 'util'
    }, {
      id: 'colorpalette',
      text: 'ColorPalette',
      parent: 'palette',
      value: 6367
    }, {
      id: 'palette1',
      text: 'Palette',
      parent: 'palette',
      value: 1229
    }, {
      id: 'shapepalette',
      text: 'ShapePalette',
      parent: 'palette',
      value: 2059
    }, {
      id: 'sizepalette',
      text: 'SizePalette',
      parent: 'palette',
      value: 2291
    }, {
      id: 'property',
      text: 'Property',
      parent: 'util',
      value: 5559
    }, {
      id: 'shapes',
      text: 'Shapes',
      parent: 'util',
      value: 19118
    }, {
      id: 'sort',
      text: 'Sort',
      parent: 'util',
      value: 6887
    }, {
      id: 'stats',
      text: 'Stats',
      parent: 'util',
      value: 6557
    }, {
      id: 'strings',
      text: 'Strings',
      parent: 'util',
      value: 22026
    }, {
      id: 'vis',
      text: 'vis',
      parent: 'flare'
    }, {
      id: 'axis',
      text: 'axis',
      parent: 'vis'
    }, {
      id: 'axes',
      text: 'Axes',
      parent: 'axis',
      value: 1302
    }, {
      id: 'axis1',
      text: 'Axis',
      parent: 'axis',
      value: 24593
    }, {
      id: 'axisgridline',
      text: 'AxisGridLine',
      parent: 'axis',
      value: 652
    }, {
      id: 'axislabel',
      text: 'AxisLabel',
      parent: 'axis',
      value: 636
    }, {
      id: 'cartesianaxes',
      text: 'CartesianAxes',
      parent: 'axis',
      value: 6703
    }, {
      id: 'controls',
      text: 'controls',
      parent: 'vis'
    }, {
      id: 'anchorcontrol',
      text: 'AnchorControl',
      parent: 'controls',
      value: 2138
    }, {
      id: 'clickcontrol',
      text: 'ClickControl',
      parent: 'controls',
      value: 3824
    }, {
      id: 'control',
      text: 'Control',
      parent: 'controls',
      value: 1353
    }, {
      id: 'controllist',
      text: 'ControlList',
      parent: 'controls',
      value: 4665
    }, {
      id: 'dragcontrol',
      text: 'DragControl',
      parent: 'controls',
      value: 2649
    }, {
      id: 'expandcontrol',
      text: 'ExpandControl',
      parent: 'controls',
      value: 2832
    }, {
      id: 'hovercontrol',
      text: 'HoverControl',
      parent: 'controls',
      value: 4896
    }, {
      id: 'icontrol',
      text: 'IControl',
      parent: 'controls',
      value: 763
    }, {
      id: 'panzoomcontrol',
      text: 'PanZoomControl',
      parent: 'controls',
      value: 5222
    }, {
      id: 'selectioncontrol',
      text: 'SelectionControl',
      parent: 'controls',
      value: 7862
    }, {
      id: 'tooltipcontrol',
      text: 'TooltipControl',
      parent: 'controls',
      value: 8435
    }, {
      id: 'data1',
      text: 'data',
      parent: 'vis'
    }, {
      id: 'data2',
      text: 'Data',
      parent: 'data1',
      value: 20544
    }, {
      id: 'datalist',
      text: 'DataList',
      parent: 'data1',
      value: 19788
    }, {
      id: 'datasprite',
      text: 'DataSprite',
      parent: 'data1',
      value: 10349
    }, {
      id: 'edgesprite',
      text: 'EdgeSprite',
      parent: 'data1',
      value: 3301
    }, {
      id: 'nodesprite',
      text: 'NodeSprite',
      parent: 'data1',
      value: 19382
    }, {
      id: 'render',
      text: 'render',
      parent: 'data1'
    }, {
      id: 'arrowtype',
      text: 'ArrowType',
      parent: 'render',
      value: 698
    }, {
      id: 'edgerenderer',
      text: 'EdgeRenderer',
      parent: 'render',
      value: 5569
    }, {
      id: 'irenderer',
      text: 'IRenderer',
      parent: 'render',
      value: 353
    }, {
      id: 'shaperenderer',
      text: 'ShapeRenderer',
      parent: 'render',
      value: 2247
    }, {
      id: 'scalebinding',
      text: 'ScaleBinding',
      parent: 'data1',
      value: 11275
    }, {
      id: 'tree',
      text: 'Tree',
      parent: 'data1',
      value: 7147
    }, {
      id: 'treebuilder',
      text: 'TreeBuilder',
      parent: 'data1',
      value: 9930
    }, {
      id: 'events',
      text: 'events',
      parent: 'vis'
    }, {
      id: 'dataevent',
      text: 'DataEvent',
      parent: 'events',
      value: 2313
    }, {
      id: 'selectionevent',
      text: 'SelectionEvent',
      parent: 'events',
      value: 1880
    }, {
      id: 'tooltipevent',
      text: 'TooltipEvent',
      parent: 'events',
      value: 1701
    }, {
      id: 'visualizationevent',
      text: 'VisualizationEvent',
      parent: 'events',
      value: 1117
    }, {
      id: 'legend',
      text: 'legend',
      parent: 'vis'
    }, {
      id: 'legend1',
      text: 'Legend',
      parent: 'legend',
      value: 20859
    }, {
      id: 'legenditem',
      text: 'LegendItem',
      parent: 'legend',
      value: 4614
    }, {
      id: 'legendrange',
      text: 'LegendRange',
      parent: 'legend',
      value: 10530
    }, {
      id: 'operator',
      text: 'operator',
      parent: 'vis'
    }, {
      id: 'distortion',
      text: 'distortion',
      parent: 'operator'
    }, {
      id: 'bifocaldistortion',
      text: 'BifocalDistortion',
      parent: 'distortion',
      value: 4461
    }, {
      id: 'distortion1',
      text: 'Distortion',
      parent: 'distortion',
      value: 6314
    }, {
      id: 'fisheyedistortion',
      text: 'FisheyeDistortion',
      parent: 'distortion',
      value: 3444
    }, {
      id: 'encoder',
      text: 'encoder',
      parent: 'operator'
    }, {
      id: 'colorencoder',
      text: 'ColorEncoder',
      parent: 'encoder',
      value: 3179
    }, {
      id: 'encoder1',
      text: 'Encoder',
      parent: 'encoder',
      value: 4060
    }, {
      id: 'propertyencoder',
      text: 'PropertyEncoder',
      parent: 'encoder',
      value: 4138
    }, {
      id: 'shapeencoder',
      text: 'ShapeEncoder',
      parent: 'encoder',
      value: 1690
    }, {
      id: 'sizeencoder',
      text: 'SizeEncoder',
      parent: 'encoder',
      value: 1830
    }, {
      id: 'filter1',
      text: 'filter',
      parent: 'operator'
    }, {
      id: 'fisheyetreefilter',
      text: 'FisheyeTreeFilter',
      parent: 'filter1',
      value: 5219
    }, {
      id: 'graphdistancefilter',
      text: 'GraphDistanceFilter',
      parent: 'filter1',
      value: 3165
    }, {
      id: 'visibilityfilter',
      text: 'VisibilityFilter',
      parent: 'filter1',
      value: 3509
    }, {
      id: 'ioperator',
      text: 'IOperator',
      parent: 'operator',
      value: 1286
    }, {
      id: 'label',
      text: 'label',
      parent: 'operator'
    }, {
      id: 'labeler',
      text: 'Labeler',
      parent: 'label',
      value: 9956
    }, {
      id: 'radiallabeler',
      text: 'RadialLabeler',
      parent: 'label',
      value: 3899
    }, {
      id: 'stackedarealabeler',
      text: 'StackedAreaLabeler',
      parent: 'label',
      value: 3202
    }, {
      id: 'layout',
      text: 'layout',
      parent: 'operator'
    }, {
      id: 'axislayout',
      text: 'AxisLayout',
      parent: 'layout',
      value: 6725
    }, {
      id: 'bundlededgerouter',
      text: 'BundledEdgeRouter',
      parent: 'layout',
      value: 3727
    }, {
      id: 'circlelayout',
      text: 'CircleLayout',
      parent: 'layout',
      value: 9317
    }, {
      id: 'circlepackinglayout',
      text: 'CirclePackingLayout',
      parent: 'layout',
      value: 12003
    }, {
      id: 'dendrogramlayout',
      text: 'DendrogramLayout',
      parent: 'layout',
      value: 4853
    }, {
      id: 'forcedirectedlayout',
      text: 'ForceDirectedLayout',
      parent: 'layout',
      value: 8411
    }, {
      id: 'icicletreelayout',
      text: 'IcicleTreeLayout',
      parent: 'layout',
      value: 4864
    }, {
      id: 'indentedtreelayout',
      text: 'IndentedTreeLayout',
      parent: 'layout',
      value: 3174
    }, {
      id: 'layout1',
      text: 'Layout',
      parent: 'layout',
      value: 7881
    }, {
      id: 'nodelinktreelayout',
      text: 'NodeLinkTreeLayout',
      parent: 'layout',
      value: 12870
    }, {
      id: 'pielayout',
      text: 'PieLayout',
      parent: 'layout',
      value: 2728
    }, {
      id: 'radialtreelayout',
      text: 'RadialTreeLayout',
      parent: 'layout',
      value: 12348
    }, {
      id: 'randomlayout',
      text: 'RandomLayout',
      parent: 'layout',
      value: 870
    }, {
      id: 'stackedarealayout',
      text: 'StackedAreaLayout',
      parent: 'layout',
      value: 9121
    }, {
      id: 'treemaplayout',
      text: 'TreeMapLayout',
      parent: 'layout',
      value: 9191
    }, {
      id: 'operator1',
      text: 'Operator',
      parent: 'operator',
      value: 2490
    }, {
      id: 'operatorlist',
      text: 'OperatorList',
      parent: 'operator',
      value: 5248
    }, {
      id: 'operatorsequence',
      text: 'OperatorSequence',
      parent: 'operator',
      value: 4190
    }, {
      id: 'operatorswitch',
      text: 'OperatorSwitch',
      parent: 'operator',
      value: 2581
    }, {
      id: 'sortoperator',
      text: 'SortOperator',
      parent: 'operator',
      value: 2023
    }, {
      id: 'visualization',
      text: 'Visualization',
      parent: 'vis',
      value: 16540
    }];
    
    // CHART CONFIG
    // -----------------------------
    let chartConfig = {
      type: 'sunburst',
      backgroundColor: '#fff',
      borderColor: '#000',
      borderWidth: '1px',
      title: {
        text: 'Irregular Sunburst - File System Data'
      },
      options: {
        slice: 0,
        space: 0
      },
      plot: {
        animation: {},
        valueBox: {
          text: '%data-vbtext',
          color: '#000',
          fontSize: '10px',
          visible: null
        },
        tooltipText: '<span style=\'font-size:19px\'>%plot-text</span><br/>Size: %node-value',
        alpha: 1
      },
      plotarea: {
        margin: '40px 0px 0px 0px',
        borderColor: '#000',
        borderWidth: '1px',
      },
      tooltip: {
        align: 'left',
        thousandsSeparator: ','
      },
      series: chartData
    };
    
    // RENDER CHARTS
    // -----------------------------
    zingchart.render({
      id: 'myChart',
      data: chartConfig
    });