/**
 * @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
 *     Ext.create('Ext.Container', {
 *         renderTo: Ext.getBody(),
 *         width: 600,
 *         height: 400,
 *         layout: 'fit',
 *         items: {
 *             xtype: 'polar',
 *             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.define('Ext.chart.series.Radar', {
    extend: 'Ext.chart.series.Polar',
    type: 'radar',
    seriesType: 'radar',
    alias: 'series.radar',
    requires: ['Ext.chart.series.sprite.Radar'],
    /**
     * @cfg {Object} style 
     * An object containing styles for overriding series styles from theming.
     */
 
    config: {
 
    },
 
    themeColorCount: function() {
        return 1;
    },
 
    themeMarkerCount: function() {
        return 1;
    },
 
    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(),
            threshhold = 22,
            item, th, r;
 
        if (me.getHidden()) {
            return null;
        }
        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) < threshhold && Math.abs(centerY + Math.sin(th) * r - y) < threshhold) {
                    item = {
                        series: me,
                        sprite: sprite,
                        index: i,
                        record: store.getData().items[i],
                        field: me.getYField()
                    };
                    return item;
                }
            }
        }
        return me.callParent(arguments);
    },
 
    getSprites: function () {
        if (!this.getChart()) {
            return [];
        }
        if (!this.sprites.length) {
            this.createSprite();
        }
        return this.sprites;
    },
 
    provideLegendInfo: function (target) {
        var me = this,
            style = me.getSubStyleWithTheme(),
            fill = style.fillStyle;
 
        if (Ext.isArray(fill)) {
            fill = fill[0];
        }
        target.push({
            name: me.getTitle() || me.getYField() || me.getId(),
            mark: (Ext.isObject(fill) ? fill.stops && fill.stops[0].color : fill) || style.strokeStyle || 'black',
            disabled: me.getHidden(),
            series: me.getId(),
            index: 0
        });
    }
 
});