Merge pull request #32 from kernc/local-highcharts

Use local Highcharts and update license
biolab · Mar 23, 2017 · fcde40d · fcde40d
2 parents 4161df9 + 1b7473b
commit fcde40d
Show file tree

Hide file tree

Showing 20 changed files with 1,918 additions and 683 deletions.
diff --git a/LICENSE b/LICENSE
diff --git a/MANIFEST.in b/MANIFEST.in
@@ -1,3 +1,4 @@
 include orangecontrib/educational/tutorials/*.ows
 include orangecontrib/educational/widgets/icons/*
 include orangecontrib/educational/widgets/resources/*
+include orangecontrib/educational/widgets/highcharts/_highcharts/*
diff --git a/README.md b/README.md
@@ -1,7 +1,14 @@
-# orange3-educational
+Orange3-Educational
+===================
 
 Educational widgets for machine learning and data mining in 
-[Orange3](http://orange.biolab.si).
+[Orange](http://orange.biolab.si).
+
+**License: CC-BY-NC-3.0**
+
+In order to use this package commercially, please obtain a [Highcharts] license.
+
+[Highcharts]: http://www.highcharts.com/
 
 Widgets in Educational Add-on demonstrate several key data mining and machine learning procedures.
 The widgets are useful for beginners to understand the inner working of key algorithms in the data
@@ -32,4 +39,4 @@ use
 
     python3 -m Orange.canvas
 
-new widgets are in the toolbox bar under Educational section.
+new widgets are in the toolbox bar under Educational section.
diff --git a/orangecontrib/educational/widgets/highcharts/__init__.py b/orangecontrib/educational/widgets/highcharts/__init__.py
@@ -0,0 +1 @@
+from .highcharts import Highchart
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/LICENSE b/orangecontrib/educational/widgets/highcharts/_highcharts/LICENSE
@@ -0,0 +1,11 @@
+The files in this directory, as indicated by the file heading comment,
+are provided courtesy of Highsoft AS and are licensed under the terms of
+Creative Commons Attribution Non Commercial 3.0 license [CC-BY-NC-3.0],
+except jquery.js, which is distributed under the terms of [MIT] license.
+
+Highsoft products are NOT free for commercial or governmental use. In order
+to use or redistribute Highsoft products commercially, you should obtain an
+appropriate license here: http://www.highcharts.com/
+
+[CC-BY-NC-3.0]: https://creativecommons.org/licenses/by-nc/3.0/
+[MIT]: https://jquery.org/license/
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/chart.html b/orangecontrib/educational/widgets/highcharts/_highcharts/chart.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+<title></title>
+<style>
+    html, body, #container {
+        width: 100%%;
+        height: 100%%;
+        margin: 0;
+        padding: 0;
+        -webkit-user-select: none;
+        user-select: none;
+        overflow: hidden;
+    }
+    #container {
+        min-width: 100px;
+        min-height: 100px;
+    }
+    text, .highcharts-tooltip {
+        cursor: default !important;
+    }
+</style>
+</head>
+<body>
+<div id="container"></div>
+
+<script src="jquery.js"></script>
+<script src="highstock.js"></script>
+<script src="map.js"></script>
+<script src="highcharts-more.js"></script>
+<script src="no-data-to-display.js"></script>
+<script src="orange-theme.js"></script>
+<script src="orange-selection.js"></script>
+<script>
+    (function(){
+        %(javascript)s;
+        var options = %(options)s ;  /* formatted in Highchart class */
+        fixupPythonObject(options);
+        Highcharts.setOptions(options);
+        //window.chart = new Highcharts.Chart({});
+    })();
+</script>
+</body>
+</html>
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/highcharts-more.js b/orangecontrib/educational/widgets/highcharts/_highcharts/highcharts-more.js
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/highmaps.js b/orangecontrib/educational/widgets/highcharts/_highcharts/highmaps.js
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/highstock.js b/orangecontrib/educational/widgets/highcharts/_highcharts/highstock.js
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/jquery.js b/orangecontrib/educational/widgets/highcharts/_highcharts/jquery.js
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/map.js b/orangecontrib/educational/widgets/highcharts/_highcharts/map.js
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/no-data-to-display.js b/orangecontrib/educational/widgets/highcharts/_highcharts/no-data-to-display.js
@@ -0,0 +1,12 @@
+/*
+ Highstock JS v4.2.6 (2016-08-02)
+ Plugin for displaying a message when there is no data visible in chart.
+
+ (c) 2010-2016 Highsoft AS
+ Author: Oystein Moseng
+
+ License: www.highcharts.com/license
+*/
+(function(a){typeof module==="object"&&module.exports?module.exports=a:a(Highcharts)})(function(a){function h(){return!!this.points.length}function d(){this.hasData()?this.hideNoData():this.showNoData()}var e=a.seriesTypes,c=a.Chart.prototype,f=a.getOptions(),g=a.extend,i=a.each;g(f.lang,{noData:"No data to display"});f.noData={position:{x:0,y:0,align:"center",verticalAlign:"middle"},attr:{},style:{fontWeight:"bold",fontSize:"12px",color:"#60606a"}};i(["pie","gauge","waterfall","bubble","treemap"],
+function(b){if(e[b])e[b].prototype.hasData=h});a.Series.prototype.hasData=function(){return this.visible&&this.dataMax!==void 0&&this.dataMin!==void 0};c.showNoData=function(b){var a=this.options,b=b||a.lang.noData,a=a.noData;if(!this.noDataLabel)this.noDataLabel=this.renderer.label(b,0,0,null,null,null,a.useHTML,null,"no-data").attr(a.attr).css(a.style).add(),this.noDataLabel.align(g(this.noDataLabel.getBBox(),a.position),!1,"plotBox")};c.hideNoData=function(){if(this.noDataLabel)this.noDataLabel=
+this.noDataLabel.destroy()};c.hasData=function(){for(var a=this.series,c=a.length;c--;)if(a[c].hasData()&&!a[c].options.isInternal)return!0;return!1};c.callbacks.push(function(b){a.addEvent(b,"load",d);a.addEvent(b,"redraw",d)})});
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/orange-selection.js b/orangecontrib/educational/widgets/highcharts/_highcharts/orange-selection.js
@@ -0,0 +1,103 @@
+/**
+ * Our selection-handling functionality.
+ */
+
+Highcharts.Chart.prototype.deselectPointsIfNot = function(accumulate) {
+    // If no Shift or Ctrl modifier, clear the existing selection
+    if (!accumulate) {
+        var points = this.getSelectedPoints();
+        for (var i = 0; i < points.length; ++i) {
+            points[i].select(false, true);
+        }
+    }
+};
+
+Highcharts.Chart.prototype.getSelectedPointsForExport = function() {
+    /**
+     * The original getSelectedPoints object is too complex for QWebView
+     * bridge. Let's just take what we need.
+     */
+    var points = [],
+        selected = this.getSelectedPoints();
+    for (var i = 0; i < this.series.length; ++i)
+        points.push([]);
+    for (var i = 0; i < selected.length; ++i) {
+        var p = selected[i];
+        points[p.series.index].push(p.index);
+    }
+    return points;
+};
+
+Highcharts.wrap(Highcharts.Point.prototype, 'select', function (proceed) {
+    // Super call with the original arguments
+    proceed.apply(this, Array.prototype.slice.call(arguments, 1));
+
+    // Raise selected point to front
+    if (this.selected) {
+        this.graphic.element.parentNode.appendChild(this.graphic.element);
+    } else {
+        // or lower deselected point to back
+        this.graphic.element.parentNode.insertBefore(
+            this.graphic.element,
+            this.graphic.element.parentNode.firstChild);
+    }
+});
+
+function unselectAllPoints(e) {
+    // Only handle left click on the canvas area, if no modifier pressed
+    if (e.ctrlKey  ||
+        e.shiftKey ||
+        !(e.which == 1 &&
+          e.target.parentElement &&
+          e.target.parentElement.tagName.toLowerCase() == 'svg'))
+        return true;
+    this.deselectPointsIfNot(false);
+    pybridge._highcharts_on_selected_points([]);
+}
+
+function clickedPointSelect(e) {
+    var chart = this.series.chart;
+    chart.deselectPointsIfNot(e.shiftKey || e.ctrlKey);
+    var points = chart.getSelectedPointsForExport();
+    if (this.selected) { // Already selected, this click should deselect
+        var selected = points[this.series.index];
+        selected.splice(selected.indexOf(this.index), 1);
+    } else
+        points[this.series.index].push(this.index);
+    pybridge._highcharts_on_selected_points(points);
+    return true;
+}
+
+function rectSelectPoints(e) {
+    if (!(e.originalEvent && e.originalEvent.which == 1))
+        return true;
+    e.preventDefault();  // Don't zoom
+
+    var no_xAxis = !e.xAxis || !e.xAxis.length,
+        no_yAxis = !e.yAxis || !e.yAxis.length,
+        xMin = no_xAxis || e.xAxis[0].min,
+        xMax = no_xAxis || e.xAxis[0].max,
+        yMin = no_yAxis || e.yAxis[0].min,
+        yMax = no_yAxis || e.yAxis[0].max,
+        series = this.series,
+        accumulate = e.originalEvent.shiftKey || e.originalEvent.ctrlKey,
+        newstate = e.originalEvent.ctrlKey ? undefined /* =toggle */ : true;
+
+    this.deselectPointsIfNot(accumulate);
+
+    // Select the points
+    for (var i=0; i < series.length; ++i) {
+        var points = series[i].points;
+        for (var j=0; j < points.length; ++j) {
+            var point = points[j], x = point.x, y = point.y;
+            if ((no_xAxis || (x >= xMin && x <= xMax)) &&
+                (no_yAxis || (y >= yMin && y <= yMax)) &&
+                point.series.visible) {
+                point.select(newstate, true);
+            }
+        }
+    }
+
+    pybridge._highcharts_on_selected_points(this.getSelectedPointsForExport());
+    return false;  // Don't zoom
+}
diff --git a/orangecontrib/educational/widgets/highcharts/_highcharts/orange-theme.js b/orangecontrib/educational/widgets/highcharts/_highcharts/orange-theme.js
@@ -0,0 +1,99 @@
+/**
+ * Orange theme for Highcharts JS
+ */
+
+Highcharts.theme = {
+    colors: [
+        // A set of optimally distinct colors. "Best" palette, generated with
+        // http://tools.medialab.sciences-po.fr/iwanthue/experiment.php
+        // See also:
+        // http://graphicdesign.stackexchange.com/questions/3682/where-can-i-find-a-large-palette-set-of-contrasting-colors-for-coloring-many-d
+        "#1F7ECA", "#D32525", "#28D825", "#D5861F", "#98257E", "#2227D5",
+        "#D5D623", "#D31BD6", "#6A7CDB", "#78D5D4", "#59D17E", "#7C5A27",
+        "#248221", "#DC8E96", "#DFD672", "#572B8E", "#817D8C", "#17D07C",
+        "#24D4D5", "#9FD17E", "#7A25D8", "#82DF26", "#DE2482", "#76192B",
+        "#C69CDD", "#CC5AD2", "#2B7970", "#CC685C", "#799E2D", "#1C2675"],
+    credits: {
+        href: '#',
+        text: 'Orange – Data Mining Fruitful & Fun; Highcharts.com',
+        style: {
+            color: 'rgba(0, 0, 0, .01)',
+        }
+    },
+    chart: {
+        renderTo: 'container',
+        animation: false,
+        // As of Highcharts 4.2.3, panning sometimes only seems to work
+        // in the X axis. There an add-on:
+        // http://www.highcharts.com/plugin-registry/single/27/Y-Axis%20Panning
+        panning: true,  // FIXME: https://github.com/highcharts/highcharts/issues/5240
+        panKey: 'alt'
+    },
+    drilldown: {
+        animation: true
+    },
+    exporting: {
+        buttons: {
+            contextButton: {
+                enabled: false
+            }
+        }
+    },
+    plotOptions: {
+        series: {
+            animation: false,
+            // Turbo threshold default (1000) results in many bugs and loss of
+            // feature when the series' data excedes it in length.
+            // So we disable it. See:
+            // https://github.com/highcharts/highcharts/search?q=turboThreshold&state=open&type=Issues
+            turboThreshold: 0,
+            marker: {
+                symbol: 'circle',
+                // NOTE: Should probably match plotOptions.column.marker.states
+                states: {
+                    select: {
+                        fillColor: null,  // = default marker color
+                        lineColor: '#f80',
+                        lineWidth: 3
+                    }
+                }
+            }
+        },
+        scatter: {
+            tooltip: {
+                followPointer: false
+            }
+        },
+        column: {
+            borderWidth: 5,
+            // NOTE: Should probably match plotOptions.series.marker.states
+            states: {
+                select: {
+                    color: null,  // = default marker color
+                    borderColor: '#f80'
+                }
+            }
+        }
+    },
+    title: {
+        text: null
+    },
+    tooltip: {
+        shared: true,
+        useHTML: true,
+        animation: false,
+        followPointer: false,
+        pointFormat: '<span style="color:{point.color}">\u25CF</span> {series.name}: <b>{point.y:.2f}</b><br/>'
+    },
+    xAxis: {
+        lineWidth: 1,
+        showLastLabel: true
+    },
+    yAxis: {
+        lineWidth: 1,
+        showLastLabel: true
+    }
+};
+
+// Apply the theme
+var highchartsOptions = Highcharts.setOptions(Highcharts.theme);