Как сохранить холст HTML5?

StackOverflow https://stackoverflow.com/questions/2544260

  •  23-09-2019
  •  | 
  •  

Вопрос

В настоящее время я использую Холст2Изображение чтобы сохранить содержимое моего холста HTML5.Однако, похоже, он не работает в Google Chrome.Приветствуются любые идеи о том, как обойти проблему.:)

Это было полезно?

Решение

canvas.toDataURL() Кажется, в Chrome работает нормально, поэтому это может быть проблема с библиотекой.Однако функция «конвертировать холст в изображение», похоже, работает.

Другие советы

используйте этот код

<html>
<head>
<script src="base64.js" type="text/javascript"></script>
<script src="canvas2image.js" type="text/javascript"></script>
</head>
<body>
<input type="button" id="savecanvas" value="Save Image" onclick="savecanvasfile()"/>
</body>
</html>



<script>
function savecanvasfile(){
    var canvas = document.getElementById('canvas_name');
    var context = canvas.getContext('2d');
    var strDataURI = canvas.toDataURL();
    Canvas2Image.saveAsPNG(canvas);
}
</script>

загрузите эти Canvas2image.js и base64.js и сохраните их в локальной папке для работы этого кода.

Они будут доступны на сайтеhttp://www.nihilogic.dk/labs/canvas2image/

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
var strDataURI = canvas.toDataURL("image/png;base64");
document.write('<img src="'+strDataURI+'"/>');

Да я сделал это!"="

Взгляните на www.assembla.com/code/codetodiagram/subversion/nodes/experimental/canvasBox/default/CanvasBox.js?rev=239#ln1235.Вы можете видеть, как он работает http://www.thiagomata.com/codetodiagram/svn/experimental/canvasBox/classDiagram/classDiagram.html.

Чтобы изображение не отображалось в браузере, а загружалось как единое целое, мне нужно создать этот простой php-файл: www.assembla.com/code/codetodiagram/subversion/nodes/experimental/canvasBox/default/download.php?rev=239

Мне нужно создать файл close.html, чтобы браузер не сохранял страницу about: пустую после начала загрузки. www.assembla.com/code/codetodiagram/subversion/nodes/experimental/canvasBox/default/close.html?rev=239

Я, вероятно, сделаю большой пост об этом на thiagomata.blog.com, но думаю, что с помощью этих файлов вы уже сможете найти путь.

Возможно, если вы прочитаете этот пост в будущем, ссылка на thiagomata.com может быть неработающей, потому что я скоро перенесу этот проект на codetodiagram.com.

Вот и все!Тьяго Мата

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top