Как разбить изображение на куски

Question

Я ищу способ разделить изображение на куски.

Отсутствие частей, которые можно разделить изображение, настраивается с помощью tile_height и tile_width.Посмотрите на помощь.

Мне не нужны какие-либо решения с любыми каркасами. Только с помощью ванили JavaScript

Я попытался ниже

var _clipX =0; 
var _clipY = _clipX; 
var _clipHeight = IMAGE_HEIGHT/TILE_HEIGHT; 
var _clipWidth = IMAGE_WIDTH/TILE_WIDTH; 
var _nRows = Math.floor(IMAGE_HEIGHT/TILE_HEIGHT); 
var _nColumns = Math.floor(IMAGE_WIDTH/TILE_WIDTH); 
for(var i=0;i<_nRows;i++){ 
    for(var j=0;j<_nColumns;j++){ 
     el.getContext('2d').drawImage(image, _clipX, _clipY, _clipWidth, _clipHeight, _clipX, _clipY,_clipWidth , _clipHeight); 
     _clipX = _clipX + _clipWidth; 
    } 
    _clipX = 0 
    _clipY = _clipY + _clipHeight; 
} 

Ниже JSFiddle для работы

JSFiddle

Answer 1

Да !!!

Найдено. Вместо того, чтобы повторять измерения размеров тега изображения, когда вы вызываете образы, он выполняет итерацию по естественным размерам изображения, следовательно, проблема, с которой я столкнулся.

Теперь я попытался с размером изображения, таким же, как и размеры тегов img, и он отлично работает.

благодарит за оказанную помощь