update example

689109ea · pah100 · 36ae2471 · 689109ea
隐藏空白更改
内联并排

Showing with 27 addition and 13 deletion

test/boxplot.html test/boxplot.html +27 -13

未找到文件。
--- a/test/boxplot.html
+++ b/test/boxplot.html
@@ -2,16 +2,17 @@
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <link rel="stylesheet" href="reset.css"/>
        <script src="esl.js"></script>
        <script src="config.js"></script>
        <script src="lib/facePrint.js"></script>
-        <script src="lib/dat.gui.min.js"></script>
    </head>
    <body>
        <style>
-            html, body, #main {
-                width: 100%;
-                height: 100%;
+            #main {
+                width: 900px;
+                height: 650px;
+                border: 9px solid #eee;
            }
        </style>
        <div id="info"></div>
@@ -30,6 +31,7 @@
                'echarts',
                'data/Michelson-Morley.json',
                'extension/dataTool/prepareBoxplotData',
+                'zrender/core/env',
                'echarts/chart/boxplot',
                'echarts/chart/scatter',
                'echarts/component/title',
@@ -39,7 +41,7 @@
                'echarts/component/grid',
                'echarts/component/tooltip',
                'zrender/vml/vml'
-            ], function (echarts, rawData, prepareBoxplotData) {
+            ], function (echarts, rawData, prepareBoxplotData, env) {

                chart = echarts.init(document.getElementById('main'), null, {
                    renderer: 'canvas'
@@ -48,6 +50,8 @@
                update('horizontal');
                // update('vertical');

+                initControlPanel(env);
+
                function update(layout) {

                    data = prepareBoxplotData(rawData, {
@@ -82,7 +86,7 @@
                        title: [
                            {
                                text: 'Michelson-Morley Experiment',
-                                left: 'center',
+                                left: 'center'
                            },
                            {
                                text: 'upper: Q3 + 1.5 * IRQ \nlower: Q1 - 1.5 * IRQ',
@@ -224,13 +228,23 @@
                };


-                var gui = new dat.GUI();
-                var config = {
-                    layout: 'horizontal'
-                };
-                gui
-                    .add(config, 'layout', ['horizontal', 'vertical'])
-                    .onChange(update);
+                function initControlPanel(env) {
+                    if (!env.browser.ie || env.browser.ie.version > 8) {
+
+                        var scr = document.createElement('script');
+                        scr.src = 'lib/dat.gui.min.js';
+                        scr.onload = function () {
+                            var gui = new dat.GUI();
+                            var config = {
+                                layout: 'horizontal'
+                            };
+                            gui
+                                .add(config, 'layout', ['horizontal', 'vertical'])
+                                .onChange(update);
+                        };
+                        document.head.appendChild(scr);
+                    }
+                }
            });

        </script>