"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 __());
    };
})();
var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
Object.defineProperty(exports, "__esModule", { value: true });
var d3 = require("d3");
var _ = require("lodash");
var Multi_1 = require("./Multi");
var MultiInline_1 = require("./MultiInline");
var Top_1 = require("./Top");
var Top2_1 = require("./Top2");
var CompareTop_1 = require("./CompareTop");
var Papaw_1 = require("./Papaw");
var MutliHorzontal_1 = require("./MutliHorzontal");
var D3Chart_1 = require("../D3Chart");
var common_1 = require("../common");
var BarWidth = 20;
/**
 * 标准条形图(横向)
*/
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_bar';
        _this.__Grid = {
            left: 0,
            right: 12,
            top: 32,
            bottom: 12,
        };
        _this.labelWidth = 60;
        _this.xAixs = null;
        _this.yAixs = null;
        _this.widthScale = null;
        _this.heightScale = null;
        return _this;
    }
    default_1.prototype.init = function () {
        if (_.has(this.props, 'labelWidth'))
            this.labelWidth = this.props.labelWidth;
    };
    default_1.prototype.sort = function () {
        var _this = this;
        if (_.has(this.props, "needSort") && !this.props.needSort) {
            var list_1 = [];
            this.props.data.map(function (d) {
                var item = _.extend({}, d);
                item[_this.props.valueField] = parseFloat(d[_this.props.valueField]);
                list_1.push(item);
            });
            this.DATA = list_1;
        }
        else {
            this.DATA = _.orderBy(this.props.data, function (d) { return parseFloat(d[_this.props.valueField]); }, 'desc');
        }
        if (this.DATA.length > this.MAXCOUNT) {
            this.DATA.length = this.MAXCOUNT;
        }
        var _a = __read(this.extent(this.DATA, function (d) { return d[_this.props.valueField]; }), 2), min = _a[0], max = _a[1];
        this.widthScale = d3.scaleBand().rangeRound([0, this.LAYOUT.w - this.labelWidth]);
        this.heightScale = d3.scaleLinear().rangeRound([this.LAYOUT.h, 0]);
        this.widthScale.domain(this.DATA.map(function (item) { return item[_this.props.labelField]; }));
        this.heightScale.domain([0, max]).nice();
        this.DATA = d3.stack().keys([this.props.valueField])(this.DATA)[0];
    };
    default_1.prototype.build = function () {
        this.SVG.append('defs').html(common_1.DefUtil.BuildBarGrinder());
        this.SVG.append('g').attr('class', '_container');
        var x = this.SVG.append("g").attr("class", "_x_axis").attr("transform", "translate(" + (this.LAYOUT.x + this.labelWidth) + "," + (this.LAYOUT.h + this.LAYOUT.y) + ")");
        if (_.has(this.props, 'xLabel')) {
            x.append('text')
                .attr('class', '_label')
                .text(this.props.xLabel)
                .attr('x', this.labelWidth + this.LAYOUT.x + this.LAYOUT.w - 40)
                .attr('y', 24);
        }
        var y = this.SVG.append("g").attr("class", "_y_axis").attr("transform", "translate(" + (this.LAYOUT.x + this.labelWidth) + "," + this.LAYOUT.y + ")");
        if (_.has(this.props, 'yLabel')) {
            y.append('text')
                .attr('class', '_label')
                .text(this.props.yLabel)
                .attr('x', 0)
                .attr('y', -12);
        }
        this.update();
    };
    default_1.prototype.update = function () {
        var _this = this;
        var band = this.widthScale.bandwidth();
        var width = band > BarWidth ? BarWidth : band;
        var diff = band > width ? (band - width) / 2 : 0;
        var group = this.SVG.select('g._container')
            .selectAll('g._item').data(this.DATA, function (d) { return d['data'][_this.props.labelField]; });
        var enter = group.enter().append('g')
            .attr('class', function (d, i) { return _this.itemClass(d, i); })
            .attr('transform', "translate(-220," + this.LAYOUT.y + ")");
        enter.merge(group)
            .transition()
            .duration(this.DURATION)
            .attr('transform', function (d, i) { return "translate(" + (_this.labelWidth + band * i) + "," + _this.LAYOUT.y + ")"; });
        enter.on('mouseover', function (d) {
            if (_.has(_this.props, 'tip')) {
                common_1.ToolTip.show(_this.props.tip(d.data));
            }
            else {
                common_1.ToolTip.show("<h2>" + _this.FormatLabel(d.data[_this.props.labelField]) + " : <small class=\"vapfont\">" + _this.FormatValue(d.data[_this.props.valueField]) + "</small></h2>");
            }
        }).on('mouseout', function (d) {
            common_1.ToolTip.hide();
        });
        if (this.props.onClick) {
            enter.on('click', function (d) { _this.props.onClick(d.data); });
        }
        enter.append('rect')
            .attr("y", this.LAYOUT.h)
            .attr("height", 0)
            .merge(group.select('rect'))
            .attr("width", width)
            .attr("x", diff)
            .transition()
            .duration(this.DURATION)
            .attr('y', function (d) { return _this.heightScale(d[1]); })
            .attr('height', function (d) { return _this.heightScale(d[0]) - _this.heightScale(d[1]); });
        this.SVG.select('g._x_axis').call(d3.axisBottom(this.widthScale).tickSize(1).tickFormat(function (e) { return _this.FormatLabel(e); }));
        this.SVG.select('g._y_axis').call(d3.axisLeft(this.heightScale).ticks(4).tickSize(1).tickFormat(function (e) { return _this.FormatValue(e); }));
        group.exit().remove();
    };
    /**
     * 纵向条形图，样式一：两行展示
    */
    default_1.Multi = Multi_1.default;
    /**
     * 纵向条形图，样式二：Label 与条形图在一行展示
    */
    default_1.MultiInline = MultiInline_1.default;
    /**
     * Top排行榜：纯色
    */
    default_1.Top = Top_1.default;
    /**
     * Top排行榜：条纹
    */
    default_1.Top2 = Top2_1.default;
    /**
     * 两侧条形图
    */
    default_1.CompareTop = CompareTop_1.default;
    /**
     * 横向条形图：样式二：类似汽泡
     */
    default_1.Papaw = Papaw_1.default;
    /**
     * 横向条形图：样式三：多断
     */
    default_1.MutiHorzontal = MutliHorzontal_1.default;
    return default_1;
}(D3Chart_1.default));
exports.default = default_1;
