show

Plot.show(aY, aColor)

ソース

show(aY, aColor) {
    if (aY && aColor) {
        this.clear();
        this.plot(aY, aColor);
    }

    var ctx = this.context;

    ctx.fillStyle = "gainsboro";// "rgb(200, 0, 0)";
    ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);

    this.minY = Number.MAX_VALUE;
    this.maxY = -Number.MAX_VALUE;

    this.minX = 0;
    this.maxX = 0;
    for(let p of this.list) {
        var Y, color;
        [Y, color] = p;

        if (Y.length == 0) {
            continue;
        }
        this.minY = Math.min(this.minY, Y.reduce((u, v) => Math.min(u, v)));
        this.maxY = Math.max(this.maxY, Y.reduce((u, v) => Math.max(u, v)));

        this.maxX = Math.max(this.maxX, Y.length);
    }
    if (this.minY == Number.MAX_VALUE) {
        return;
    }

    var span_y = this.maxY - this.minY;

    if (span_y == 0) {
        return;
    }

    var pr, sc, pr1, pr2, sc1, sc2;

    if (0 < this.maxY) {

        var p = Math.log10(this.maxY);

        // 小数点以下の桁数
        pr1 = Math.floor(p);
        pr2 = pr1 - 1;

        sc1 = Math.pow(10, pr1);
        sc2 = Math.pow(10, pr2);

        var max1 = Math.ceil(this.maxY / sc1) * sc1;
        var max2 = Math.ceil(this.maxY / sc2) * sc2;

        if (0.9 < this.maxY / max1) {

            pr = pr1;
            sc = sc1;
            this.maxY = max1;
        }
        else {

            pr = pr2;
            sc = sc2;
            this.maxY = max2;
        }
    }

    this.spanX = this.maxX - this.minX;
    this.spanY = this.maxY - this.minY;

    for(let p of this.list) {
        var Y, color;
        [Y, color] = p;

        ctx.strokeStyle = color;
        ctx.fillStyle = color;

        ctx.beginPath();
        ctx.moveTo(this.pixX(0), this.pixY(Y[0]));
        for (var i = 1; i < Y.length; i++) {
            ctx.lineTo(this.pixX(i), this.pixY(Y[i]));
        }
        ctx.stroke();

        for (var i = 0; i < Y.length; i++) {
            ctx.beginPath();
            ctx.arc(this.pixX(i), this.pixY(Y[i]), 2, 0, Math.PI * 2, false);
            ctx.fill();
        }
    }

    ctx.strokeStyle = "black";

    // X軸
    this.drawLine(ctx, this.minX, 0, this.maxX, 0);

    // Y軸
    this.drawLine(ctx, 0, this.minY, 0, this.maxY);

    ctx.font = "16px 'Times New Roman'";

    // Yの最大値
    var txt = (pr < 0 ? this.maxY.toFixed(-pr) : this.maxY.toFixed(0));

    this.rightText(ctx, 0, this.maxY, txt);

    var org_x = this.pixX(0);
    this.drawLinePix(ctx, org_x - 3, this.pixY(this.maxY), org_x + 3, this.pixY(this.maxY));

    // Yの目盛り
    for (var i = 1; i * sc1 < this.maxY; i++) {

        var y = i * sc1;

        this.drawLinePix(ctx, org_x - 3, this.pixY(y), org_x + 3, this.pixY(y));

        var txt = (pr1 < 0 ? y.toFixed(-pr1) : y.toFixed(0));
        this.rightText(ctx, 0, y, txt);
    }
}