BMP декодирование в JavaScript и рисунок для проводника холста

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

Вопрос

Мне нужно скачать BMP с JavaScript и визуализируйте его на экран, в Internet Explorer. Во-первых, да, я знаю, что это безумно, я не собираюсь попасть в почему, давайте просто будем принять на мгновение, что IMG SRC не работает из-за ограничений безопасности, но запрос AJAX с правильной аутентификацией в сообщении будет Верните изображение. Этот пример обходит всю безопасность ради простоты и просто доказывает, что мы можем что-то сделать.

Лучшая идея, с которой я мог придумать, должен был получить поток через Ajax, декодировать растровое изображение, а затем сделать его с холстом. Internet Explorer Очевидно, не поддерживает холст, но, к счастью, Google предоставил обертку SVG под названием Eccanvas, которые я могу использовать для этого.

Мой код (код рисования кажется, работает, BMP декодирует не столько)

http://gist.github.com/614328.

Будущая поддержка для других изображений, помимо BMP, является обязательным, и из-за того, как холст работает, проще всего рисовать пиксели в RGBA. Texture2D по существу является классом обертки для массива байтов RGBA, а также код чертежа. Bytestream делает его немного легче на глазах, имеющих дело с массивом байтов, и BitmapDecoder содержит метод для перевода формата BGR в текстуру RGBA для рисования.

Возможен ли байты неправильно переведены по пути или есть что-то дело с моей логикой декодирования?

FYI, я получил файл спецификации из Википедии:

http://en.wikipedia.org/wiki/bmp_file_format#bitmap_information_.28dib_header.29.

Любая идея, что происходит в логике декодирования или логики рисования, которые вызывают мой BMP неправильно?

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

Решение 3

Исправление было сочетанием двух вещей

  1. Немного VBScript для чтения сырого байта ответственного
  2. Правильно декодирование байтовых данных правильно, каждый пиксель не поддается, поскольку статью Wikipedia предлагает, это фактически каждая сканировка, которая дополняется до размера DWord.

Рабочий код:

http://gist.github.com/616240.

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

XMLHttpRequest (aka ajax) был в первую очередь предназначен для текстового контента, поэтому возможно, что двоичные данные (особенно нулевые символы) не переводится правильно. Первая проверка будет сравнивать размер извлеченных данных с фактическим размером файла.

По крайней мере, на Firefox, кажется, есть способ специально получить двоичные данные, как описано здесь: Обработка двоичных данных.

Вот гораздо более простые (и значительный исполнительный) подход: Base64 кодирует данные BMP (вы можете сделать это либо на сервере, либо на клиенте), а затем встроить его на страницу с помощью УРИ:

<script type="text/javascript">
  function fetchBmp() {
    $.get('http://localhost:3168/experimental/imgrender/beta.bmp', function (data) {
      var base64Data = $.base64.encode(data); // *

      $('#my-image').attr('src', 'data:image/bmp;base64,' + base64Data);
    });
  }

  // * Lots of plugins for this, e.g. http://github.com/carlo/jquery-base64
</script>    

<img id="my-image" />

Все современные браузеры поддерживают URI данных (в том числе IE8 и UP - для Wearbounds IE7), а также формат BMP.

Как отмечает Casablanca, могут возникнуть проблемы с загрузочными двоичными данными через AJAX, поэтому вам, возможно, придется Google для обходных путей.

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