Вопрос

Итак, мне нужно сохранить данные изображения, нарисованные на <canvas> элемент.И есть метод toDataURL(), который работает в большинстве современных браузеров.

За исключением...вы уже догадались...Internet Explorer.

Я поискал в Интернете, но везде люди говорят, что я должен использовать SVG / VML для сохранения данных, но они никогда не упоминают, как это сделать.У меня нет никакого опыта работы с SVG / VML в IE, так как же мне сохранить изображение, нарисованное в элементе canvas в Internet Explorer?Есть ли у кого-нибудь опыт?

На данный момент мне пришлось дублировать код чертежа как на клиенте, так и на сервере, что начинает усложняться.Так что, если есть способ, которым я мог бы извлечь изображение, нарисованное в теге canvas, на стороне клиента (или сервера), это, безусловно, помогло бы.

Спасибо!

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

Решение

Возможно, вы сможете получить VML и то же самое, но это формат XML, так что, вероятно, это не то, что вам нужно.Вы не можете получить изображение из IE без использования плагина.

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

  1. canvas.toDataURL работает в IE9.

  2. Если вам действительно это нужно для старого IE ..что ж..я просто приведу вам цитату

toDataURL не будет поддерживаться из-за характера метода, используемого Explorer Canvas :VML.Мы не нашли способа растрировать VML в bitmap изображения с использованием JS, и даже не с помощью серверного скрипта.Так что, если вам действительно нужно создать dataURL в IE, вам придется использовать FxCanvas (http://code.google.com/p/fxcanvas/) или FlashCanvas (http://flashcanvas.net/) :два решения, основанные на Flash.

http://code.google.com/p/explorercanvas/issues/detail?id=77

У меня была такая же проблема.Что я хотел сделать, так это преобразовать холст в изображение, а затем открыть его на новой вкладке.Я обнаружил, что его преобразование не было проблемой, но открытие по новой ссылке было проблемой.Я решил эту проблему, сгенерировав изображение, поместив его в тег img, а затем включив его на новую страницу.Затем я открыл указанную новую страницу, используя этот учебник - http://www.javascripter.net/faq/writingt.htm

Вот что я сделал

var canvas = document.getElementById('canvas1');
var dataURL = canvas.toDataURL();
var width = parseInt($("#main").width()); //main is the div that contains my canvas
var height = parseInt($("#main").height());
newWindow("<img src=\"" + dataURL + "\"/>");
function newWindow(content) {
    top.consoleRef = window.open("", "Organisational Structure",
        "width="+width+",height="+height
        + ",menubar=0"
        + ",toolbar=1"
        + ",status=0"
        + ",scrollbars=1"
        + ",resizable=1")
    top.consoleRef.document.writeln(
        "<html><head><title>Console</title></head>"
        + "<body bgcolor=white onLoad=\"self.focus()\">"
        + content
        + "</body></html>"
    )
    top.consoleRef.document.close()
}
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top