rt-graphic-component/components/Station/JlStation.js

import { Container, Point, Graphics, Color } from 'pixi.js';
import { JlGraphic, VectorText } from 'jl-graphic';
import { stationConstsMap } from './StationConfig.js';
import { CategoryType } from '../Platform/PlatformConfig.js';

class constrolGraphic extends Container {
    categoryType;
    constrolConfig;
    stateArrowFillColor;
    constructor(categoryType) {
        super();
        this.categoryType = categoryType;
    }
    draw(stationConsts) {
        const constrolConsts = stationConsts.constrolGraphic;
        const graphicsPs = [];
        for (let i = 0; i < constrolConsts.constrolConfig.length; i++) {
            const posX = constrolConsts.circleBetweenOffset *
                (i - (constrolConsts.constrolConfig.length - 1) / 2);
            graphicsPs.push({
                circlePs: new Point(posX, constrolConsts.circleOffsetY),
                codeGraphPs: new Point(posX, constrolConsts.codeOffsetY),
            });
        }
        const constrolConfig = this.constrolConfig || constrolConsts.constrolConfig;
        constrolConfig.forEach((g, i) => {
            this.drawCircleCode(constrolConsts, g.codeText, g.circleFillColor, g.codeGraphFillColor, graphicsPs[i]);
        });
        if (constrolConsts.inArrowFillColor) {
            const points = [0, 0, 2, 2, 2, 1, 14, 1, 14, -1, 2, -1, 2, -2];
            const arrow = new Graphics();
            arrow
                .clear()
                .lineStyle(constrolConsts.borderWidth, new Color('0xFFFFFF'))
                .beginFill('0xFFFFFF')
                .drawPolygon(points)
                .endFill();
            arrow.scale.set(1.1, 1.1);
            arrow.position.set(-7, constrolConsts.circleOffsetY);
            this.addChild(arrow);
            const inArrow = new Graphics();
            const fillColor = this.stateArrowFillColor || constrolConsts.inArrowFillColor;
            inArrow.beginFill(fillColor).drawPolygon(points).endFill();
            inArrow.position.set(-6.5, constrolConsts.circleOffsetY);
            this.addChild(inArrow);
        }
    }
    drawCircleCode(constrolConsts, code, circleFillColor, codeGraphFillColor, pos) {
        const circle = new Graphics();
        const codeGraph = new VectorText();
        this.addChild(circle);
        this.addChild(codeGraph);
        circle.tint = 0xffffff;
        circle
            .clear()
            .lineStyle(constrolConsts.borderWidth, new Color(circleFillColor))
            .beginFill(circleFillColor, 1)
            .drawCircle(0, 0, constrolConsts.radius).endFill;
        circle.position.copyFrom(pos.circlePs);
        codeGraph.text = code;
        codeGraph.style.fill = codeGraphFillColor;
        codeGraph.setVectorFontSize(constrolConsts.codeControlFontSize);
        codeGraph.anchor.set(0.5);
        codeGraph.position.copyFrom(pos.codeGraphPs);
    }
    clear() {
        this.children.forEach((child) => {
            if (child instanceof Graphics) {
                child.clear();
            }
            else if (child instanceof VectorText) {
                child.text = '';
            }
        });
    }
}
class JlStation extends JlGraphic {
    static Type = 'station';
    categoryType;
    stationConsts;
    codeGraph = new VectorText(''); //车站名
    kilometerGraph = new VectorText(''); //公里标
    controlGraphic;
    _ipRtuStusDown = false;
    constructor(categoryType) {
        super(JlStation.Type);
        this.categoryType = categoryType;
        this.stationConsts = stationConstsMap.get(this.categoryType);
        this.addChild(this.codeGraph);
        this.addChild(this.kilometerGraph);
        if (this.stationConsts.constrolGraphic) {
            this.controlGraphic = new constrolGraphic(categoryType);
            this.addChild(this.controlGraphic);
        }
    }
    get datas() {
        return this.getDatas();
    }
    get code() {
        return this.datas.code;
    }
    doRepaint() {
        const codeGraph = this.codeGraph;
        const kilometerGraph = this.kilometerGraph;
        const controlGraphic = this.controlGraphic;
        controlGraphic?.clear();
        switch (this.categoryType) {
            case CategoryType.XiAn:
                codeGraph.text = this.datas?.code
                    ? `${this.datas?.name}(${this.datas?.code})`
                    : `${this.datas?.name}`;
                break;
            case CategoryType.BeiJing:
                codeGraph.text = this.datas?.code || '车站Station';
                break;
        }
        codeGraph.style.fill = this.stationConsts.codeColor;
        codeGraph.setVectorFontSize(this.stationConsts.codeFontSize);
        codeGraph.anchor.set(0.5);
        const kilometerCode = this.datas.kilometerSystem?.kilometer || 12345678;
        if (Math.floor(kilometerCode * 1000).toString().length > 3) {
            const kiloBit = Math.floor(Number(kilometerCode) / 1000000).toString();
            kilometerGraph.text =
                'K' +
                    kiloBit +
                    '+' +
                    (Number(kilometerCode.toString().substring(kiloBit.length)) / 1000).toFixed(3);
        }
        else {
            kilometerGraph.text = (kilometerCode * 1000).toFixed(3);
        }
        kilometerGraph.style.fill = this.stationConsts.kilometerCodeColor;
        kilometerGraph.setVectorFontSize(this.stationConsts.kilometerCodeFontSize);
        kilometerGraph.anchor.set(0.5);
        kilometerGraph.position.set(0, this.stationConsts.kilometerCodeOffsetY);
        if (this.datas.childTransforms?.length) {
            this.datas.childTransforms.forEach((child) => {
                if (child.name == 'kilometer') {
                    const pos = child.transform.position;
                    kilometerGraph.position.set(pos.x, pos.y);
                }
            });
        }
        if (this.controlGraphic) {
            this.controlGraphic.draw(this.stationConsts);
        }
    }
}

export { JlStation };