How to use the webgl-operate.Label.devicePixelRatio function in webgl-operate

protected updateLabels(): void {
        if (!this._labelLeft.valid) {
            return;
        }

        const top = +this._canvasSize[1] * 0.5;
        const step = 32.0 * Label.devicePixelRatio();
        const width = this._canvasSize[0] - 32.0 /* margin */ * Label.devicePixelRatio();

        this._labelSize.position = [-width * 0.5, top - 1.0 * step];

        this._labelLeft.lineWidth = width;
        this._labelLeft.position = [-width * 0.5, top - 2.5 * step];

        this._labelRight.lineWidth = width;
        this._labelRight.position = [+width * 0.5, top - 3.5 * step];

        this._labelMiddle.lineWidth = width;
        this._labelMiddle.position = [0.0, top - 4.5 * step];

        this._labelCustom.lineWidth = width * 0.5;
        this._labelCustom.position = [-width * 0.5, top - 6.0 * step];
    }

protected updateLabelsLinear(): void {
        if (!this._labelLinear1.valid) {
            return;
        }

        const step = this._canvasSize[1] / 8.0;
        const top = 3.5 * step;
        const width = this._canvasSize[0] - 32.0 /* margin */ * Label.devicePixelRatio();

        this._labelLinear1.position = [-width * 0.1, top - 0.0 * step];
        this._labelLinear2.position = [-width * 0.1, top - 1.0 * step];
        this._labelLinear3.position = [-width * 0.1, top - 2.0 * step];
        this._labelLinear4.position = [-width * 0.1, top - 3.0 * step];
        this._labelLinear5.position = [-width * 0.1, top - 4.0 * step];
        this._labelLinear6.position = [-width * 0.1, top - 5.0 * step];
        this._labelLinear7.position = [-width * 0.1, top - 6.0 * step];
        this._labelLinear8.position = [-width * 0.1, top - 7.0 * step];
    }

protected updateLabels(): void {
        if (!this._labelBaseline.valid) {
            return;
        }

        const step = this._canvasSize[1] / 6.0;
        const top = 2.5 * step;
        const width = this._canvasSize[0] - 32.0 /* margin */ * Label.devicePixelRatio();

        this._labelTop.position = [-width * 0.5, top - 0.0 * step];
        this._labelAscent.position = [-width * 0.5, top - 1.0 * step];
        this._labelCenter.position = [-width * 0.5, top - 2.0 * step];
        this._labelBaseline.position = [-width * 0.5, top - 3.0 * step];
        this._labelDescent.position = [-width * 0.5, top - 4.0 * step];
        this._labelBottom.position = [-width * 0.5, top - 5.0 * step];
    }

protected updateLabelsNearest(): void {
        if (!this._labelNearest1.valid) {
            return;
        }

        const step = this._canvasSize[1] / 8.0;
        const top = 3.5 * step;
        const width = this._canvasSize[0] - 32.0 /* margin */ * Label.devicePixelRatio();

        this._labelNearest1.position = [-width * 0.3, top - 0.0 * step];
        this._labelNearest2.position = [-width * 0.3, top - 1.0 * step];
        this._labelNearest3.position = [-width * 0.3, top - 2.0 * step];
        this._labelNearest4.position = [-width * 0.3, top - 3.0 * step];
        this._labelNearest5.position = [-width * 0.3, top - 4.0 * step];
        this._labelNearest6.position = [-width * 0.3, top - 5.0 * step];
        this._labelNearest7.position = [-width * 0.3, top - 6.0 * step];
        this._labelNearest8.position = [-width * 0.3, top - 7.0 * step];
    }