3.0 source code

OfficeWeb/vendor/touch/src/chart/series/Radar.js

@@ -0,0 +1,168 @@
+/**
+ * @class Ext.chart.series.Radar
+ * @extends Ext.chart.series.Polar
+ *
+ * Creates a Radar Chart. A Radar Chart is a useful visualization technique for comparing different quantitative values for
+ * a constrained number of categories.
+ * As with all other series, the Radar series must be appended in the *series* Chart array configuration. See the Chart
+ * documentation for more information. A typical configuration object for the radar series could be:
+ *
+ *     @example preview
+ *     var chart = new Ext.chart.PolarChart({
+ *         animate: true,
+ *         interactions: ['rotate'],
+ *         store: {
+ *           fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
+ *           data: [
+ *               {'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13},
+ *               {'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3},
+ *               {'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7},
+ *               {'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23},
+ *               {'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33}
+ *           ]
+ *         },
+ *         series: [{
+ *             type: 'radar',
+ *             xField: 'name',
+ *             yField: 'data4',
+ *             style: {
+ *               fillStyle: 'rgba(0, 0, 255, 0.1)',
+ *               strokeStyle: 'rgba(0, 0, 0, 0.8)',
+ *               lineWidth: 1
+ *             }
+ *         }],
+ *         axes: [
+ *           {
+ *             type: 'numeric',
+ *             position: 'radial',
+ *             fields: 'data4',
+ *             style: {
+ *                 estStepSize: 10
+ *             },
+ *             grid: true
+ *           },
+ *           {
+ *             type: 'category',
+ *             position: 'angular',
+ *             fields: 'name',
+ *             style: {
+ *                 estStepSize: 1
+ *             },
+ *             grid: true
+ *           }
+ *         ]
+ *     });
+ *     Ext.Viewport.setLayout('fit');
+ *     Ext.Viewport.add(chart);
+ *
+ *
+ */
+Ext.define('Ext.chart.series.Radar', {
+    extend: 'Ext.chart.series.Polar',
+    type: "radar",
+    seriesType: 'radar',
+    alias: 'series.radar',
+    requires: ['Ext.chart.series.Cartesian', 'Ext.chart.series.sprite.Radar'],
+    /**
+     * @cfg {Object} style
+     * An object containing styles for overriding series styles from theming.
+     */
+
+    config: {
+
+    },
+
+    updateAngularAxis: function (axis) {
+        axis.processData(this);
+    },
+
+    updateRadialAxis: function (axis) {
+        axis.processData(this);
+    },
+
+    coordinateX: function () {
+        return this.coordinate('X', 0, 2);
+    },
+
+    coordinateY: function () {
+        return this.coordinate('Y', 1, 2);
+    },
+
+    updateCenter: function (center) {
+        this.setStyle({
+            translationX: center[0] + this.getOffsetX(),
+            translationY: center[1] + this.getOffsetY()
+        });
+        this.doUpdateStyles();
+    },
+
+    updateRadius: function (radius) {
+        this.setStyle({
+            endRho: radius
+        });
+        this.doUpdateStyles();
+    },
+
+    updateRotation: function (rotation) {
+        this.setStyle({
+            rotationRads: rotation
+        });
+        this.doUpdateStyles();
+    },
+
+    updateTotalAngle: function (totalAngle) {
+        this.processData();
+    },
+
+    getItemForPoint: function (x, y) {
+        var me = this,
+            sprite = me.sprites && me.sprites[0],
+            attr = sprite.attr,
+            dataX = attr.dataX,
+            dataY = attr.dataY,
+            centerX = attr.centerX,
+            centerY = attr.centerY,
+            minX = attr.dataMinX,
+            maxX = attr.dataMaxX,
+            maxY = attr.dataMaxY,
+            endRho = attr.endRho,
+            startRho = attr.startRho,
+            baseRotation = attr.baseRotation,
+            i, length = dataX.length,
+            store = me.getStore(),
+            marker = me.getMarker(),
+            item, th, r;
+
+        if (sprite && marker) {
+            for (i = 0; i < length; i++) {
+                th = (dataX[i] - minX) / (maxX - minX + 1) * 2 * Math.PI + baseRotation;
+                r = dataY[i] / maxY * (endRho - startRho) + startRho;
+                if (Math.abs(centerX + Math.cos(th) * r - x) < 22 && Math.abs(centerY + Math.sin(th) * r - y) < 22) {
+                    item = {
+                        series: this,
+                        sprite: sprite,
+                        index: i,
+                        record: store.getData().items[i],
+                        field: store.getFields().items[i]
+                    };
+                    return item;
+                }
+            }
+        }
+        return this.callSuper(arguments);
+    },
+
+    getXRange: function () {
+        return [this.dataRange[0], this.dataRange[2]];
+    },
+
+    getYRange: function () {
+        return [this.dataRange[1], this.dataRange[3]];
+    }
+}, function () {
+    var klass = this;
+    // TODO: [HACK] Steal from cartesian series.
+    klass.prototype.onAxesChanged = Ext.chart.series.Cartesian.prototype.onAxesChanged;
+    klass.prototype.getSprites = Ext.chart.series.Cartesian.prototype.getSprites;
+});
+