@antv/t8/lib/charts/association/index.js

T8 is a text visualization solution for unstructured data within the AntV technology stack, and it is a declarative T8 markdown syntax that can be used to describe the content of data interpretation reports.

'use strict';

var getElementFontSize = require('../../utils/getElementFontSize.js');
require('../utils/selection.js');
var scales = require('../utils/scales.js');
var paths = require('../utils/paths.js');
var createSvg = require('../utils/createSvg.js');
var data = require('../utils/data.js');
var linearRegression = require('../utils/linearRegression.js');
var _const = require('../utils/const.js');

var renderAssociationChart = function (container, config, paragraphType, themeSeedToken) {
    var _a = config.data, data$1 = _a === void 0 ? [] : _a;
    if (!data$1.length)
        return;
    if (data$1.length < 2)
        throw new Error('data must contain at least 2 points');
    var chartSize = getElementFontSize.getElementFontSize(paragraphType, themeSeedToken);
    var height = chartSize;
    var width = chartSize * 2;
    var svg = createSvg.createSvg(container, width, height);
    var xValueExtent = data.extent(data$1.map(function (d) { return d.x; }));
    var yValueExtent = data.extent(data$1.map(function (d) { return d.y; }));
    var xValueDomain = [
        xValueExtent[0] > 0 ? 0 : xValueExtent[0],
        xValueExtent[1] < 0 ? 0 : xValueExtent[1],
    ];
    var yValueDomain = [
        yValueExtent[0] > 0 ? 0 : yValueExtent[0],
        yValueExtent[1] < 0 ? 0 : yValueExtent[1],
    ];
    var xScale = scales.scaleLinear(xValueDomain, [_const.SCALE_ADJUST, width - _const.SCALE_ADJUST]);
    var yScale = scales.scaleLinear(yValueDomain, [height - _const.SCALE_ADJUST, _const.SCALE_ADJUST]);
    var zeroXPosition = xScale(0);
    var zeroYPosition = yScale(0);
    var linearRegressionResult = linearRegression.linearRegression(data$1);
    var tagData = data$1.map(function (d) {
        var tag = linearRegressionResult.k * d.x + linearRegressionResult.b;
        return {
            x: d.x,
            y: tag,
        };
    });
    svg
        .append('line')
        .attr('x1', zeroXPosition)
        .attr('y1', 0)
        .attr('x2', zeroXPosition)
        .attr('y2', height)
        .attr('stroke', _const.LINE_STROKE_COLOR);
    svg
        .append('line')
        .attr('x1', 0)
        .attr('y1', zeroYPosition)
        .attr('x2', width)
        .attr('y2', zeroYPosition)
        .attr('stroke', _const.LINE_STROKE_COLOR);
    var arrowPath = paths.arrow(xScale, yScale);
    svg
        .append('path')
        .attr('d', arrowPath({ index: tagData[0].x, value: tagData[0].y }, { index: tagData[tagData.length - 1].x, value: tagData[tagData.length - 1].y }))
        .attr('stroke', _const.ARROW_FILL_COLOR)
        .attr('fill', _const.ARROW_FILL_COLOR);
    data$1.forEach(function (d) {
        svg.append('circle').attr('cx', xScale(d.x)).attr('cy', yScale(d.y)).attr('r', 1).attr('fill', _const.HIGHLIGHT_COLOR);
    });
};

exports.renderAssociationChart = renderAssociationChart;
//# sourceMappingURL=index.js.map