jimp icon indicating copy to clipboard operation
jimp copied to clipboard

Support for drawing primitives: lines, rectangles, polygons, gradients and so on

Open yanovich opened this issue 4 years ago • 0 comments

Is your feature request related to a problem? Please describe. Jimp lacks functionality for drawing primitives: lines, rectangles, polygons, gradients and so on.

Describe the solution you'd like It would be great to add such features.

Describe alternatives you've considered I am doing this in my project for now.

Additional context

function gradientFill(img, colorX1Y1, colorX2Y1, colorX1Y2, colorX2Y2, x1, y1, x2, y2) {
  if (x1 === x2 || y1 === y2) {
  ¦ return
  } 
  
  if (x1 > x2) {
  ¦ [x1, x2] = [x2, x1]
  } 
  if (y1 > y2) {
  ¦ [y1, y2] = [y2, y1]
  } 
  
  if (x1 >= img.width) {
  ¦ return
  } 
  if (y1 >= img.height) {
  ¦ return
  } 
  
  if (x2 >= img.width) {
  ¦ x2 = img.width
  } 
  if (y2 >= img.height) {
  ¦ y2 = img.height
  } 
  
  const dX = x2 - x1
  const dY = y2 - y1
  for (let i = x1; i < x2; i++) {
  ¦ const dx = i - x1
  ¦ for (let j = y1; j < y2; j++) {
  ¦ ¦ const dy = j - y1
  ¦ ¦ for (let c = 0; c < 4; c++) {
  ¦ ¦ ¦ const colorX1 = Math.round(
  ¦ ¦ ¦ ¦ (colorX1Y1[c] * (dY - dy)) / dY + (colorX1Y2[c] * dy) / dY
  ¦ ¦ ¦ ) 
  ¦ ¦ ¦ const colorX2 = Math.round(
  ¦ ¦ ¦ ¦ (colorX2Y1[c] * (dY - dy)) / dY + (colorX2Y2[c] * dy) / dY
  ¦ ¦ ¦ ) 
  ¦ ¦ ¦ img.bitmap[4 * (j * img.width + i) + c] = Math.round(
  ¦ ¦ ¦ ¦ (colorX1 * (dX - dx)) / dX + (colorX2 * dx) / dX
  ¦ ¦ ¦ ) 
  ¦ ¦ }
  ¦ }
  }
}

yanovich avatar Oct 28 '20 11:10 yanovich