steam-family-bot-core/lib/render/components/(chart)/piegraph.js

一个用于新版 Steam 家庭的库存监控 Bot 插件

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Piegraph = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const playtimeGraph_1 = require("./playtimeGraph");
const renderChart_1 = require("../renderChart");
function Piegraph({ countData, style, }) {
    const cntData = countData.map((it) => {
        return [it.name, it.cnt];
    });
    const option = {
        darkMode: true,
        color: playtimeGraph_1.selectableColor,
        title: {
            text: '库存数量',
            left: 'center',
            textStyle: {
                color: '#ffffff',
            },
        },
        legend: {
            left: 'center',
            top: 'bottom',
            textStyle: playtimeGraph_1.defaultTextStyle,
        },
        grid: { left: '55%' },
        xAxis: {
            // gridIndex: 0,
            ...playtimeGraph_1.axisStyle,
        },
        yAxis: {
            type: 'category',
            show: false,
            ...playtimeGraph_1.axisStyle,
        },
        dataset: {
            source: [['name', 'count'], ...cntData],
        },
        series: [
            {
                type: 'pie',
                id: 'pie',
                radius: '40%',
                center: ['30%', '50%'],
                roseType: 'radius',
                itemStyle: {
                    borderRadius: 10,
                },
                label: {
                    formatter: '{b}({d}%)',
                    textStyle: {
                        color: '#ffffff',
                    },
                },
                encode: {
                    itemName: 'name',
                    value: 'count',
                },
            },
            ...cntData.map((it) => ({
                type: 'bar',
                seriesLayoutBy: 'row',
                itemStyle: {
                    borderRadius: [0, 50, 50, 0],
                },
                height: '4px',
                label: {
                    textStyle: {
                        color: '#ffffff',
                    },
                    show: true,
                    position: 'right',
                },
            })),
        ],
    };
    const res = (0, renderChart_1.renderChart)(option, style);
    return ((0, jsx_runtime_1.jsx)("div", { dangerouslySetInnerHTML: {
            __html: res,
        } }));
}
exports.Piegraph = Piegraph;
//# sourceMappingURL=piegraph.js.map