first commit

www/bower_components/c3/docs/js/index.js

@@ -0,0 +1,168 @@
+var chart = c3.generate({
+    data: {
+        columns: [
+            ['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]
+        ],
+        selection: {
+            enabled: true
+        }
+    }
+});
+
+var defaultMessage = $('#message').html(), currentIndex = 0, timer, duration = 1500, demos = [
+    function () {
+        chart.load({
+            columns: [['data2', 100, 30, 200, 320, 50, 150, 230, 80, 150]]
+        })
+        setMessage('Load data2');
+    },
+    function () {
+        chart.load({
+            columns: [['data3', 70, 90, 170, 220, 100, 110, 130, 40, 50]]
+        })
+        setMessage('Load data3');
+    },
+    function () {
+        chart.select(['data1'], [2]);
+        setMessage('Select point for index 2 of data1');
+    },
+    function () {
+        chart.select(['data1'], [4,6]);
+        setMessage('Select point for index 4,6 of data1');
+    },
+    function () {
+        chart.unselect();
+        setMessage('Unselect points');
+    },
+    function () {
+        chart.focus('data2');
+        setMessage('Focus on data2');
+    },
+    function () {
+        chart.focus('data3');
+        setMessage('Focus on data3');
+    },
+    function () {
+        chart.revert();
+        setMessage('Defocus');
+    },
+    function () {
+        chart.load({
+            columns: [['data1', 300, 230, 400, 520, 230, 250, 330, 280, 250]]
+        })
+        setMessage('Update data1');
+    },
+    function () {
+        chart.load({
+            columns: [['data2', 30, 50, 90, 120, 40, 50, 80, 70, 50]]
+        })
+        setMessage('Update data2');
+    },
+    function () {
+        chart.regions([{start:1,end:3}]);
+        setMessage('Add region from 1 to 3');
+        },
+    function () {
+        chart.regions.add([{start:6}]);
+        setMessage('Add region from 6 to end');
+    },
+    function () {
+        chart.regions([]);
+        setMessage('Clear regions');
+    },
+    function () {
+        chart.xgrids([{value: 1, text:'Label 1'}, {value: 4, text: 'Label 4'}]);
+        setMessage('Add x grid lines for 1, 4');
+    },
+    function () {
+        chart.ygrids.add([{value: 450, text:'Label 450'}]);
+        setMessage('Add y grid lines for 450');
+    },
+    function () {
+        chart.xgrids.remove({value: 1});
+        chart.xgrids.remove({value: 4});
+        setMessage('Remove grid lines for 1, 4');
+    },
+    function () {
+        chart.ygrids.remove({value: 450});
+        setMessage('Remove grid line for 450');
+    },
+    function () {
+        chart.transform('bar');
+        setMessage('Show as bar chart');
+    },
+    function () {
+        chart.groups([['data2','data3']]);
+        setMessage('Grouping data2 and data3');
+    },
+    function () {
+        chart.groups([['data1', 'data2', 'data3']]);
+        setMessage('Grouping data1, data2 and data3');
+    },
+    function () {
+        chart.groups([['data2', 'data3']]);
+        chart.transform('line', 'data1');
+        setMessage('Show data1 as line');
+    },
+    function () {
+        chart.unload({
+            ids: 'data3'
+        });
+        setMessage('Unload data3');
+    },
+    function () {
+        chart.unload({
+            ids: 'data2'
+        });
+        setMessage('Unload data2');
+    },
+    function () {
+        chart.flow({
+            columns: [
+                ['data1', 390, 400, 200, 500]
+            ],
+            duration: 1000,
+        });
+        setMessage('Flow 4 data');
+    },
+    function () {
+        // wait for end of transition for flow
+    },
+    function () {
+        chart.flow({
+            columns: [
+                ['data1', 190, 230]
+            ],
+        });
+        setMessage('Flow 2 data');
+    },
+    function () {
+        // wait for end of transition for flow
+    },
+    function () {
+        chart.transform('line', ['data1', 'data2', 'data3']);
+        chart.groups([['data1'], ['data2'], ['data3']]);
+        chart.load({
+            columns: [['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]]
+        })
+        setMessage('Starting Demo..');
+    }
+];
+
+function setMessage(message) {
+    document.getElementById('message').innerHTML = '<a id="demoMessage" class="button small secondary" onclick="stopDemo();" title="Stop Demo" onclick="stopDemo();">'+message+'</button>';
+//        $('#demoMessage').tooltip('toggle');
+}
+
+function startDemo() {
+    setMessage('Starting Demo..');
+    timer = setInterval(function(){
+        if (currentIndex == demos.length) currentIndex = 0;
+        demos[currentIndex++]();
+    }, duration);
+}
+
+function stopDemo() {
+    clearInterval(timer);
+    document.getElementById('message').innerHTML = defaultMessage;
+}