Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Загрузка процесса при отрисовке изображения (https://javascript.ru/forum/misc/63144-zagruzka-processa-pri-otrisovke-izobrazheniya.html)

slovnosvoboda 20.05.2016 12:29

Загрузка процесса при отрисовке изображения
 
Добрый день.
Есть следующий код:

/**
 * depth: 1 - monochrome
 *        4 - 4-bit grayscale
 *        8 - 8-bit grayscale
 *       16 - 16-bit colour
 *       32 - 32-bit colour
 **/
function drawArray(arr, depth) {
  var offset, height, data, image;

  function conv(size) {
    return String.fromCharCode(size&0xff, (size>>8)&0xff, (size>>16)&0xff, (size>>24)&0xff);
  }

  height = Math.ceil(Math.sqrt(arr.length * 8/depth));

  //BMP Header
  data  = 'BM';                          // ID field
  data += conv(offset + arr.length);     // BMP size
  data += conv(0);                       // unused
  data += conv(offset);                  // pixel data offset
  
  //DIB Header
  data += conv(40);                      // DIB header length
  data += conv(height);                  // image height
  data += conv(height);                  // image width
  data += String.fromCharCode(1, 0);     // colour panes
  data += String.fromCharCode(depth, 0); // bits per pixel
  data += conv(0);                       // compression method
  data += conv(arr.length);              // size of the raw data
  data += conv(2835);                    // horizontal print resolution
  data += conv(2835);                    // vertical print resolution
  data += conv(0);                       // colour palette, 0 == 2^n
  data += conv(0);                       // important colours
  
  //Grayscale tables for bit depths <= 8
  if (depth <= 8) {
    data += conv(0);
    
    for (var s = Math.floor(255/(Math.pow(2, depth)-1)), i = s; i < 256; i += s)  {
      data += conv(i + i*256 + i*65536);
    }
  }
  
  //Pixel data
  data += String.fromCharCode.apply(String, arr);
 
  //Image element
  image = document.createElement('img');

  image.src = 'data:image/bmp;base64,' + btoa(data);

  return image;
}

/*Usage example, visualize random numbers generated by Math.random */

setInterval(function(){	
document.getElementsByTagName('body')[0].innerHTML = '';	

for (var a= [], i = 0; i < 16256; i++) {
  a[i] = Math.floor(Math.random()*256);
}

document.body.appendChild(drawArray(a, 8));

}, 0);


При добавлении элемента img в setInterval грузится процесс. Как исправить?

Dilettante_Pro 20.05.2016 13:05

slovnosvoboda,
Ежели интервал 0 - вот все время и крутится создание нового массива и перерисовка img

slovnosvoboda 20.05.2016 13:07

Цитата:

Сообщение от Dilettante_Pro (Сообщение 417102)
slovnosvoboda,
Ежели интервал 0 - вот все время и крутится создание нового массива и перерисовка img

Нужна минимальная задержка при перерисовке.

Dilettante_Pro 20.05.2016 13:56

slovnosvoboda,
А тогда чего вы хотите? Процесс идет с какой только может скоростью, ничем остальным ему некогда заниматься


Часовой пояс GMT +3, время: 10:28.