JavaScript/HTML5 Canvas - 加载图像数组

var img = new Image();
img.src = 'your_image_url';
img.onload = function() {
    // 处理图片加载完成后的业务逻辑
}
img.onerror = function() {
    // 处理图片加载失败时的业务逻辑
}

var canvas = document.getElementById('your-canvas-element');
var img = new Image();
img.src = canvas.toDataURL('image/png');

var xhr = new XMLHttpRequest();
xhr.open('GET', 'your_image_url', true);
xhr.responseType = 'blob';
xhr.onload = function() {
    var blob = xhr.response;
    var img = new Image();
    img.src = URL.createObjectURL(blob);
    // 处理图片加载完成后的业务逻辑
}
xhr.onerror = function() {
    // 处理图片加载失败时的业务逻辑
}

<div id="my-swiper-container"></div>

import Plyr from 'plyr';

var player = new Plyr('#my-swiper-container');

player.addMedia('your_image_url', 'image');