2009-03-11 2 views
5

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

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

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

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

Спасибо!

ответ

1

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

+1

Есть простой способ, чтобы преобразовать VML в BMP или PNG? –

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

  2. Если вам действительно нужно для старых IE .. хорошо .. я просто дам вам цитату

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

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

2

У меня была такая же проблема. То, что я хотел сделать, это преобразовать холст в изображение, а затем открыть его на новой вкладке. Я обнаружил, что преобразование это не проблема, но открытие в новой ссылке было. Я решил это, создав изображение, поместив его в тег 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() 
} 
+0

Это прекрасное решение проблемы с моей точки зрения. Единственное, с чем я столкнулся, был в IE9, мне пришлось использовать пустую строку в качестве второго параметра для window.open, поскольку использование значения «Организационная структура» вызвало ошибку в IE9. – MartynJones87

Смежные вопросы