У меня есть элемент формы на моей странице HTML, который в настоящее время извлекает toDataURL()
из одного холста (canvas2
) и рисует изображение во втором холсте (outputCanvas
).Мне нужно, чтобы событие onclick извлекло изображение холста и использовало это изображение в этой функции.На данный момент я могу вручную сохранить изображение холста в формате .png, а затем жестко закодировать файл в эту функцию, но мне нужно, чтобы все это происходило при нажатии кнопки.Я новичок в .js, но я могу обработать псевдокод, если его легче объяснить, но, пожалуйста, будьте конкретны.Следующие draw()
должны быть обработаны, когда происходит щелчок.У меня есть слушатель ниже, который должен назвать draw()
.
function init () {
canvas = document.getElementById('anotherCanvas');
ctx = canvas.getContext('2d');
draw ();
}
function draw() {
img = new Image();
img.src = 'recursed1.png';
fr1 = makeFrame(ctx,makeVect(400,0), makeVect(400, 0), makeVect(0, 400));
img.onload = function(){
ctx.save();
newPainter = cornerSplit(imagePainter,5);
newPainter(fr1);
ctx.restore();
ctx.save();
newPainter(flipHorizLeft(fr1));
ctx.restore();
ctx.save();
newPainter(flipVertDown(fr1));
ctx.restore();
ctx.save();
newPainter(flipVertDown(flipHorizLeft(fr1)));
}
Следующее в настоящее время не зависит от вышеуказанного, я могу заставить работать вышеуказанную функцию, только если вручную сохраню и закодирую изображение, созданное на независимом холсте (canvas2).Мне нужно, чтобы они работали вместе.Элемент HTML:
<input type="button" id="recImage" value="Recurse Image">
var formElement = document.getElementById("createImageData");
formElement.addEventListener('click', createImageDataPressed, false);
function createImageDataPressed(e) {
var imageDataDisplay = document.getElementById("imageDataDisplay");
imageDataDisplay.value = canvas2.toDataURL();
var newImagewindow.open(canvas2.toDataURL(),
"canvasImage","right=300,top=400,width="canvas2.width + ",height=" +
canvas2.height + ",toolbar=0,resizable=0");
}
Выше приведена моя последняя попытка, она не работает ... Ничто не установлено в камне, и если есть лучший путь, чем тот, который я пытаюсь, пожалуйста, дайте мне знать, эта работа может помочь вам понять, что я пытаюсь сделать