Kod
<!DOCTYPE html>
<html>
<body>
<img id="scream" src="zdjecie.jpg" alt="The Scream" width="500" height="200">
<br>
<canvas id="myCanvas" width="500" height="200" ></canvas>
<input type="button" value="Dodaj do listy" onclick="pobierz();" />
<input type="button" value="stworz canvas" onclick="tworz();" />
<script>
function pobierz() {
var canvas = document.getElementById("myCanvas");
var link = document.createElement('a');
link.download = "test.png";
link.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");;
link.click();
}
function tworz(){
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var img2 =document.getElementById("scream");
ctx.clearRect(0, 0,500, 200);
ctx.drawImage(img2,0,0);
ctx.font = "18pt Times New Roman";
ctx.fillStyle = "black";
ctx.fillText("tak", 210, 115);
}
</script>
</body>
</html>
<html>
<body>
<img id="scream" src="zdjecie.jpg" alt="The Scream" width="500" height="200">
<br>
<canvas id="myCanvas" width="500" height="200" ></canvas>
<input type="button" value="Dodaj do listy" onclick="pobierz();" />
<input type="button" value="stworz canvas" onclick="tworz();" />
<script>
function pobierz() {
var canvas = document.getElementById("myCanvas");
var link = document.createElement('a');
link.download = "test.png";
link.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");;
link.click();
}
function tworz(){
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var img2 =document.getElementById("scream");
ctx.clearRect(0, 0,500, 200);
ctx.drawImage(img2,0,0);
ctx.font = "18pt Times New Roman";
ctx.fillStyle = "black";
ctx.fillText("tak", 210, 115);
}
</script>
</body>
</html>
Mam problem z powyższym kodem otóż w takiej postaci jak jest pobieranie pliku na dysk
nie działa lecz po wymazaniu linijki ctx.drawImage(img2,0,0); pobieranie działa nie wiem od czego
i jak mam sobie z tym poradzić.
