Question

"use strict";
class Signature {
    constructor() {
        this.color = "#000000";
        this.sign = false;
        this.begin_sign = false;
        this.width_line = 5;
        this.canvas = document.getElementById('canvas');
        this.offsetLeft = this.canvas.offsetLeft;
        this.offsetTop = this.canvas.offsetTop;
        this.context = canvas.getContext('2d');
        this.context.lineJoin = 'round'; // jointure arrondie
        this.context.lineCap = 'round'; // extrémité arrondie
        this.whenActionDown();
        this.whenActionUp();
        this.whenActionMove();
        this.createSignature();
        this.clearCanvas();
        this.resetCanvas();
    }
    // Mise à jour de la position de la souris car c'est dans une modal
    updateMousePosition(mX, mY) {
    let rect = this.canvas.getBoundingClientRect();
    let scaleX = this.canvas.width / rect.width;
    let scaleY = this.canvas.height / rect.height;
    this.cursorX = (mX - rect.left) * scaleX;
    this.cursorY = (mY - rect.top) * scaleY;
}

    actionDown(e) {
        this.sign = true;
        this.updateMousePosition(e.clientX, e.clientY);
    }

    actionUp() {
        this.sign = false;
        this.begin_sign = false;
    }

    actionMove(e) {
        if (this.sign) {
            this.updateMousePosition(e.clientX, e.clientY);
            this.createSignature();
        }
    }


    // La signature commence lorsqu'on clique sur la souris :
    whenActionDown() {
        document.addEventListener("mousedown", this.actionDown.bind(this));
      document.addEventListener("touchstart", this.actionDown.bind(this));
    }

    // Relâchement du clic. On arrête la signature :
    whenActionUp() {
        document.addEventListener("mouseup", this.actionUp.bind(this));
      document.addEventListener("touchend", this.actionUp.bind(this));
    }

    // Mouvement de la souris sur le canvas :
    whenActionMove() {
        this.canvas.addEventListener('mousemove', this.actionMove.bind(this));
        this.canvas.addEventListener('touchmove', this.actionMove.bind(this));
    }

    // Fonction qui permet la création de la signature :
    createSignature() {
        // Si c'est le début, la signature démarre :
        if (!this.begin_sign) {
            // Placement du curseur pour la première fois :
            this.context.beginPath();
            this.context.moveTo(this.cursorX, this.cursorY);
            this.begin_sign = true;
        }
        // Sinon on signe :
        else {
            this.context.lineTo(this.cursorX, this.cursorY);
            this.context.strokeStyle = this.color;
            this.context.lineWidth = this.width_line;
            this.context.stroke();
        }
    }
    // Nettoyage du Canvas :
    clearCanvas() {
        this.context.clearRect(0, 0, this.canvas.offsetWidth, this.canvas.offsetHeight);
    }
    // Reset :
    resetCanvas() {
        document.getElementById("reset").addEventListener("click", () => {
            this.clearCanvas();
        })
    }
}
// Instanciation de la Signature :
document.addEventListener("DOMContentLoaded", event => {
    new Signature();
});

如何在MySQL中联接这两个表

Answer 1

仅使用别名，我假设您的第一个表名为location，第二个表名为route，因为您没有提供表名

Select slno, a.location, b.location from route
   left join location as a on route.first_loc = a.id
   left join location as b on route.second_loc = b.id

如何在同一行中将具有相同列名和不同ID的两个SQL表联接在一起？

1 个答案: