Bestehenden Verweis auf CanvasRendingContext2D auf ein Element anwenden

Ich versuche, eine Zeichenbereichsreferenz in einem globalen Objekt zu speichern und diese Referenz dann auf ein Element anzuwenden, anstatt die Zeichenbereichsreferenz neu zu generieren. Hier ist mein bestehender Code. Ich hoffe das ergibt Sinn. Danke im Voraus

s wird angenommen, dass @waveformCache ein globales @ is

var cL = document.getElementById('track' + trackId + 'WaveformL');
var cR = document.getElementById('track' + trackId + 'WaveformR');

if (waveformCache.hasOwnProperty(track.path))
{
    var waveformCacheItem = waveformCache[track.path];

    if (waveformCacheItem.hasOwnProperty('left'))
    {
        // restore canvas data here to cL element
    }
}
else
{
    waveformCache[track.path] = {};

    var left = track.data.getChannelData(0);

    var ctx1 = cL.getContext('2d');
    ctx1.save();
    ctx1.strokeStyle = 'rgb(49,73,11)';
    ctx1.translate(0, 55/2); //centers where the line drawing starts horizontally

    for(var i = 0; i < left.length; i += 200) {
        var x1 = Math.floor(track.waveformLength * i / left.length); //first parameter affects the length of the drawn waveform #ZOOM
        var y1 = left[i] * 55/2;

        ctx1.beginPath();
        ctx1.moveTo(x1, 0);
        ctx1.lineTo(x1 + 1, y1);
        ctx1.stroke();
    }
    ctx1.restore();

    waveformCache[track.path].left = ctx1;
}

Antworten auf die Frage(4)

Ihre Antwort auf die Frage