| |
| <!-- |
| Licensed to the Apache Software Foundation (ASF) under one |
| or more contributor license agreements. See the NOTICE file |
| distributed with this work for additional information |
| regarding copyright ownership. The ASF licenses this file |
| to you under the Apache License, Version 2.0 (the |
| "License"); you may not use this file except in compliance |
| with the License. You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, |
| software distributed under the License is distributed on an |
| "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY |
| KIND, either express or implied. See the License for the |
| specific language governing permissions and limitations |
| under the License. |
| --> |
| |
| <html> |
| <head> |
| <meta charset="utf-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> |
| <script src="lib/simpleRequire.js"></script> |
| <script src="lib/config.js"></script> |
| <script src="lib/jquery.min.js"></script> |
| </head> |
| <body> |
| <style> |
| html, body, #main { |
| width: 100%; |
| padding: 0; |
| margin: 0; |
| height: 100%; |
| } |
| </style> |
| <div id="main"></div> |
| <script> |
| require([ |
| 'echarts' |
| ], function (echarts) { |
| var chart = echarts.init(document.getElementById('main'), null, { |
| |
| }); |
| |
| window.onresize = function () { |
| chart.resize(); |
| }; |
| |
| var data1 = { |
| "name": "flare", |
| "children": [ |
| { |
| "name": "data", |
| "children": [ |
| { |
| "name": "converters", |
| "children": [ |
| {"name": "Converters", "value": 721}, |
| {"name": "DelimitedTextConverter", "value": 4294} |
| ] |
| }, |
| { |
| "name": "DataUtil", |
| "value": 3322 |
| } |
| ] |
| }, |
| { |
| "name": "display", |
| "children": [ |
| {"name": "DirtySprite", "value": 8833}, |
| {"name": "LineSprite", "value": 1732}, |
| {"name": "RectSprite", "value": 3623} |
| ] |
| }, |
| { |
| "name": "flex", |
| "children": [ |
| {"name": "FlareVis", "value": 4116} |
| ] |
| }, |
| { |
| "name": "query", |
| "children": [ |
| {"name": "AggregateExpression", "value": 1616}, |
| {"name": "And", "value": 1027}, |
| {"name": "Arithmetic", "value": 3891}, |
| {"name": "Average", "value": 891}, |
| {"name": "BinaryExpression", "value": 2893}, |
| {"name": "Comparison", "value": 5103}, |
| {"name": "CompositeExpression", "value": 3677}, |
| {"name": "Count", "value": 781}, |
| {"name": "DateUtil", "value": 4141}, |
| {"name": "Distinct", "value": 933}, |
| {"name": "Expression", "value": 5130}, |
| {"name": "ExpressionIterator", "value": 3617}, |
| {"name": "Fn", "value": 3240}, |
| {"name": "If", "value": 2732}, |
| {"name": "IsA", "value": 2039}, |
| {"name": "Literal", "value": 1214}, |
| {"name": "Match", "value": 3748}, |
| {"name": "Maximum", "value": 843}, |
| { |
| "name": "methods", |
| "children": [ |
| {"name": "add", "value": 593}, |
| {"name": "and", "value": 330}, |
| {"name": "average", "value": 287}, |
| {"name": "count", "value": 277}, |
| {"name": "distinct", "value": 292}, |
| {"name": "div", "value": 595}, |
| {"name": "eq", "value": 594}, |
| {"name": "fn", "value": 460}, |
| {"name": "gt", "value": 603}, |
| {"name": "gte", "value": 625}, |
| {"name": "iff", "value": 748}, |
| {"name": "isa", "value": 461}, |
| {"name": "lt", "value": 597}, |
| {"name": "lte", "value": 619}, |
| {"name": "max", "value": 283}, |
| {"name": "min", "value": 283}, |
| {"name": "mod", "value": 591}, |
| {"name": "mul", "value": 603}, |
| {"name": "neq", "value": 599}, |
| {"name": "not", "value": 386}, |
| {"name": "or", "value": 323}, |
| {"name": "orderby", "value": 307}, |
| {"name": "range", "value": 772}, |
| {"name": "select", "value": 296}, |
| {"name": "stddev", "value": 363}, |
| {"name": "sub", "value": 600}, |
| {"name": "sum", "value": 280}, |
| {"name": "update", "value": 307}, |
| {"name": "variance", "value": 335}, |
| {"name": "where", "value": 299}, |
| {"name": "xor", "value": 354}, |
| {"name": "_", "value": 264} |
| ] |
| }, |
| {"name": "Minimum", "value": 843}, |
| {"name": "Not", "value": 1554}, |
| {"name": "Or", "value": 970}, |
| {"name": "Query", "value": 13896}, |
| {"name": "Range", "value": 1594}, |
| {"name": "StringUtil", "value": 4130}, |
| {"name": "Sum", "value": 791}, |
| {"name": "Variable", "value": 1124}, |
| {"name": "Variance", "value": 1876}, |
| {"name": "Xor", "value": 1101} |
| ] |
| }, |
| { |
| "name": "scale", |
| "children": [ |
| {"name": "IScaleMap", "value": 2105}, |
| {"name": "LinearScale", "value": 1316}, |
| {"name": "LogScale", "value": 3151}, |
| {"name": "OrdinalScale", "value": 3770}, |
| {"name": "QuantileScale", "value": 2435}, |
| {"name": "QuantitativeScale", "value": 4839}, |
| {"name": "RootScale", "value": 1756}, |
| {"name": "Scale", "value": 4268}, |
| {"name": "ScaleType", "value": 1821}, |
| {"name": "TimeScale", "value": 5833} |
| ] |
| } |
| ] |
| }; |
| |
| var data2 = { |
| "name": "flare", |
| "children": [ |
| { |
| "name": "flex", |
| "children": [ |
| {"name": "FlareVis", "value": 4116} |
| ] |
| }, |
| { |
| "name": "scale", |
| "children": [ |
| {"name": "IScaleMap", "value": 2105}, |
| {"name": "LinearScale", "value": 1316}, |
| {"name": "LogScale", "value": 3151}, |
| {"name": "OrdinalScale", "value": 3770}, |
| {"name": "QuantileScale", "value": 2435}, |
| {"name": "QuantitativeScale", "value": 4839}, |
| {"name": "RootScale", "value": 1756}, |
| {"name": "Scale", "value": 4268}, |
| {"name": "ScaleType", "value": 1821}, |
| {"name": "TimeScale", "value": 5833} |
| ] |
| }, |
| { |
| "name": "display", |
| "children": [ |
| {"name": "DirtySprite", "value": 8833} |
| ] |
| } |
| ] |
| }; |
| |
| chart.setOption({ |
| |
| tooltip: { |
| trigger: 'item', |
| triggerOn: 'mousemove' |
| }, |
| |
| legend: { |
| top: '2%', |
| left: '3%', |
| orient: 'vertical', |
| data: [{ |
| name: 'tree1' |
| } , |
| { |
| name: 'tree2', |
| }] |
| }, |
| |
| series:[ |
| { |
| type: 'tree', |
| |
| name: 'tree1', |
| |
| data: [data1], |
| |
| top: '5%', |
| left: '7%', |
| bottom: '2%', |
| right: '60%', |
| |
| symbolSize: 7, |
| emphasis: { |
| focus: 'relative' |
| }, |
| label: { |
| position: 'left', |
| verticalAlign: 'middle', |
| align: 'right' |
| }, |
| |
| leaves: { |
| label: { |
| position: 'right', |
| verticalAlign: 'middle', |
| align: 'left' |
| } |
| }, |
| |
| expandAndCollapse: true, |
| |
| animationDuration: 550, |
| animationDurationUpdate: 750 |
| |
| }, |
| { |
| type: 'tree', |
| name: 'tree2', |
| data: [data2], |
| |
| top: '20%', |
| left: '70%', |
| bottom: '22%', |
| right: '8%', |
| center: ['80%', '10%'], |
| zoom: 1.2, |
| symbolSize: 7, |
| orient: 'RL', |
| |
| label: { |
| position: 'right', |
| verticalAlign: 'middle', |
| align: 'left' |
| }, |
| |
| leaves: { |
| label: { |
| position: 'left', |
| verticalAlign: 'middle', |
| align: 'right' |
| } |
| }, |
| |
| expandAndCollapse: true, |
| |
| animationDuration: 550, |
| animationDurationUpdate: 750 |
| } |
| ] |
| }); |
| }); |
| </script> |
| </body> |
| </html> |
