• Edit
  • Download
  • <!DOCTYPE html>
    <html>
    
    <head>
        <meta charset="utf-8">
        <title>ZingSoft Demo</title>
        <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
        <style>
            html,
            body {
                margin: 0;
                padding: 0;
                width: 100%;
                height: 100%;
            }
    
            .chart--container {
                min-height: 150px;
                width: 100%;
                height: 100%;
            }
    
            .zc-ref {
                display: none;
            }
    
            zing-grid[loading] {
                height: 450px;
            }
        </style>
    </head>
    
    <body>
        <!-- CHART CONTAINER -->
        <div id="myChart" class="chart--container">
            <a class="zc-ref" href="https://www.zingchart.com/">Powered by ZingChart</a>
        </div>
        <script>
            ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"]; // window.onload event for Javascript to run after HTML
            // because this Javascript is injected into the document head
            window.addEventListener('load', () => {
                // Javascript code to execute after DOM content
    
                // data format for sunburst chart
                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,
                    }
                ];
    
                // full ZingChart schema can be found here:
                // https://www.zingchart.com/docs/api/json-configuration/
                let chartConfig = {
                    type: 'sunburst',
                    globals: {
                        fontSize: '14px'
                    },
                    title: {
                        text: 'A Simple Sunburst Chart',
                        fontSize: '24px'
                    },
                    options: {
                        _palette: ['#7CA82B', '#29A2CC', '#D31E1E', '#EF8535', '#A05F18', '#265E96', '#6B7075', '#28536B', '#A87356', '#70AE6E', '#764493', '#BA163B', '#E8630A'],
                        slice: 0,
                        space: 0
                    },
                    // plot represents general series, or plots, styling
                    plot: {
                        // hoverstate
                        'border-width': 1,
                        'border-color': "#cccccc",
                        'line-style': "dotted",
                        tooltip: {
                            align: 'left',
                            padding: '10px 15px',
                            borderRadius: '3px',
                            thousandsSeparator: ','
                        },
                        valueBox: {
                            text: '%data-vbtext',
                            color: '#424242',
                            fontSize: '10px',
                            visible: null
                        }
                    },
                    plotarea: {
                        margin: '20px 5px 5px 5px'
                    },
                    series: chartData
                };
    
                // render chart
                zingchart.render({
                    id: 'myChart',
                    data: chartConfig,
                    height: '100%',
                    width: '100%',
                });
            });
        </script>
    </body>
    
    </html>
    <!DOCTYPE html>
    <html>
    	<head>
        <meta charset="utf-8">
        <title>ZingSoft Demo</title>
    		<script src="https://cdn.zingchart.com/zingchart.min.js"></script>
      </head>
      <body>
        <!-- CHART CONTAINER -->
        <div id="myChart" class="chart--container">
          <a class="zc-ref" href="https://www.zingchart.com/">Powered by ZingChart</a>
        </div>
      </body>
    </html>
    html, body {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;
    }
    
    .chart--container {
      min-height: 150px;
      width: 100%;
      height: 100%;
    }
    
    .zc-ref {
      display: none;
    }
    // window.onload event for Javascript to run after HTML
    // because this Javascript is injected into the document head
    window.addEventListener('load', () => {
      // Javascript code to execute after DOM content
    
      // data format for sunburst chart
      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,
        }
      ];
    
      // full ZingChart schema can be found here:
      // https://www.zingchart.com/docs/api/json-configuration/
      let chartConfig = {
        type: 'sunburst',
        globals: {
          fontSize: '14px'
        },
        title: {
          text: 'A Simple Sunburst Chart',
          fontSize: '24px'
        },
        options: {
          _palette: ['#7CA82B', '#29A2CC', '#D31E1E', '#EF8535', '#A05F18', '#265E96', '#6B7075', '#28536B', '#A87356', '#70AE6E', '#764493', '#BA163B', '#E8630A'],
          slice: 0,
          space: 0
        },
        // plot represents general series, or plots, styling
        plot: {
          // hoverstate
          'border-width': 1,
        	'border-color': "#cccccc",
        	'line-style': "dotted",
          tooltip: {
            align: 'left',
            padding: '10px 15px',
            borderRadius: '3px',
            thousandsSeparator: ','
          },
          valueBox: {
            text: '%data-vbtext',
            color: '#424242',
            fontSize: '10px',
            visible: null
          }
        },
        plotarea: {
          margin: '20px 5px 5px 5px'
        },
        series: chartData
      };
    
      // render chart
      zingchart.render({
        id: 'myChart',
        data: chartConfig,
        height: '100%',
        width: '100%',
      });
    });