"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var d3 = require("d3");
var D3Chart_1 = require("../D3Chart");
var _ = require("lodash");
var RadarOptions_1 = require("./RadarOptions");
var common_1 = require("../common");
var default_1 = /** @class */ (function (_super) {
    __extends(default_1, _super);
    function default_1() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.__ClassName = '_vc_radar';
        _this.levels = 4;
        _this.margin = 36;
        _this.radius = 0;
        return _this;
    }
    default_1.prototype.init = function () {
        if (_.has(this.props, 'levels'))
            this.levels = this.props.levels;
    };
    default_1.prototype.build = function () {
        var group = this.SVG.append('g').attr('class', '_container');
        group.selectAll("._levels")
            .data(d3.range(1, this.levels + 1).reverse())
            .enter()
            .append("circle")
            .attr("class", "_levels");
        //背景上的指示线
        group.selectAll("line._ticks")
            .data(this.props.labelFields)
            .enter()
            .append('line')
            .attr('class', '_ticks')
            .attr('x1', 0)
            .attr('y1', 0)
            .attr('x2', 0)
            .attr('y2', 0);
        //Label
        var axis = this.SVG.selectAll("._label_group")
            .data(this.props.labelTexts)
            .enter()
            .append("g")
            .attr("class", '_label_group')
            .attr("transform", "translate(" + (this.WIDTH / 2) + "," + (this.HEIGHT / 2) + ")");
        axis.append("text")
            .attr("class", "_label")
            // .attr("dy", "0.35em")
            .attr("x", 0)
            .attr("y", 0)
            .text(function (d) { return d; });
        // .call(wrap);
        this.update();
    };
    default_1.prototype.update = function () {
        var _this = this;
        var group = this.SVG.select('g._container').attr("transform", "translate(" + (this.WIDTH / 2) + "," + (this.HEIGHT / 2) + ")");
        // 半径及角度
        var angleSlice = Math.PI * 2 / this.props.labelFields.length;
        var radius = Math.min(this.WIDTH / 2, this.HEIGHT / 2) - this.margin;
        var nodes = RadarOptions_1.createNodes(this.props.labelFields.length, radius);
        //Scale for the radius
        var rScale = d3.scaleLinear()
            .domain([0, this.props.maxValue])
            .range([0, radius]);
        group.selectAll('circle._levels')
            .transition()
            .duration(this.DURATION)
            .attr("r", function (d) { return radius / _this.levels * d; });
        //背景上的指示线
        group.selectAll("line._ticks")
            .data(nodes)
            .transition()
            .duration(this.DURATION)
            .attr('x2', function (d) { return d.x; })
            .attr('y2', function (d) { return d.y; });
        //Label
        this.SVG.selectAll("._label_group")
            .attr("transform", "translate(" + (this.WIDTH / 2) + "," + (this.HEIGHT / 2) + ")")
            .select('text._label')
            .transition()
            .duration(this.DURATION)
            .attr("x", function (d, i) { return rScale(_this.props.maxValue * 1) * Math.cos(angleSlice * i - Math.PI / 2); })
            .attr("y", function (d, i) { return rScale(_this.props.maxValue * 1) * Math.sin(angleSlice * i - Math.PI / 2); });
        //区域连线
        var radarLine = d3.lineRadial()
            .curve(d3.curveLinearClosed)
            // @ts-ignore
            .radius(function (d, i) { return rScale(d); })
            .angle(function (d, i) { return i * angleSlice; });
        group.selectAll("._item").remove();
        var blobWrapper = group.selectAll("._item")
            .data(this.DATA)
            .enter()
            .append("g")
            .attr("class", function (d, i) { return _this.itemClass(d, i); });
        blobWrapper
            .append("path")
            .attr("class", "radarArea")
            .attr("d", function (d) { var p = radarLine(_this.props.labelFields.map(function (key) { return d[key]; })); return p; })
            .attr("transform", "scale(0)")
            .transition()
            .duration(this.DURATION)
            .attr("transform", "scale(1)");
        var circleGroup = blobWrapper.append('g');
        circleGroup.selectAll('circle._point')
            .data(function (d) { return _this.props.labelFields.map(function (key) { return { key: key, value: d[key] }; }); })
            .enter()
            .append('circle')
            .attr('class', '_point')
            .attr("cx", 0)
            .attr("cy", 0)
            .transition()
            .duration(this.DURATION)
            .attr("cx", function (d, i) { return rScale(d.value) * Math.cos(angleSlice * i - Math.PI / 2); })
            .attr("cy", function (d, i) { return rScale(d.value) * Math.sin(angleSlice * i - Math.PI / 2); });
        blobWrapper.on('mouseover', function (d, i) {
            if (_this.props.tip) {
                common_1.ToolTip.show(_this.props.tip(d, i));
                return;
            }
            var html = [];
            for (var i_1 = 0; i_1 < _this.props.labelFields.length; i_1++) {
                html.push("<p>" + _this.props.labelTexts[i_1] + " : " + d[_this.props.labelFields[i_1]] + "</p>");
            }
            common_1.ToolTip.show(html.join(''));
        }).on('mouseout', function () {
            common_1.ToolTip.hide();
        });
    };
    return default_1;
}(D3Chart_1.default));
exports.default = default_1;
