Images API


Parámetro
Valores
¿Qué hace?
w
ancho
la anchura para cambiar el tamaño de
Retire el ancho a escala proporcional (A continuación, tendrá la altura)
h
altura
la altura para cambiar el tamaño de
Retire la altura a escala proporcional (A continuación, tendrá el ancho)
q
calidad
0 a 100
La compresión de calidad. Cuanto mayor sea el número, mejor se verá la imagen. Yo no recomendaría ir más alto que el 95 de lo contrario la imagen será demasiado grande
un
alineación
c, t, l, r, b, tl, tr, bl, br
Cultivos de alineación. c = centro, t = arriba, b = abajo, D = derecha, L = izquierda. Las posiciones se pueden unir para crear posiciones diagonales
zc
zoom / recorte
0, 1, 2, 3, 4, 5
Cambiar el modo de recorte y los ajustes de escala
F
filtros
demasiados para mencionar
Vamos a aplicar filtros de imagen para cambiar la imagen cambia de tamaño. Por ejemplo, puede cambiar el brillo / contraste o incluso borrar la imagen
s
suavizar

Aplicar un filtro de enfoque a la imagen, hace que las imágenes en tamaño reducido mirar un poco más nítidas
cc
el color del lienzo/fondo
Valor de color hexadecimal (# ffffff)
Cambiar el color de fondo. La mayoría utiliza al cambiar el zoom y la configuración de los cultivos, que a su vez puede añadir bordes a la imagen.
ct
lienzo de la transparencia
verdadero (1)
Utilice la transparencia e ignorar el color de fondo



Parametros básicos

The parameters below are the main ones used. With these you can resize almost anything.

  • w and h – width and height. Totally optional but also almost essential, few people want the default sizes. The width and height can be any value, the image will enlarge or shrink as required.
  • q – quality. This specifies the compression level of the images being cropped/ resized.


Escalado de imágenes proporcional

Usage is simple. The mysterious zc (Zoom & Crop) parameter comes into action, simply give it the value of 2 and it will apply the borders as required.


zc = Zoom & Crop


When we fixed this feature bug the zc parameter was introduced. The idea being that existing websites would continue to work as they were. As time went on it seemed to be less and less relevant, until it got to the stage where I was considering removing it entirely.
With the new cropping modes this thought has ended. I have added some new scaling modes, as described below.
Cuando nos fijamos este error característica se introdujo el parámetro z. La idea es que los sitios web existentes continuarían trabajando como estaban. A medida que pasaba el tiempo parecía ser cada vez menos relevante, hasta que llegó a la etapa en la que yo estaba considerando retirar por completo.Con los nuevos modos de cultivo este pensamiento ha terminado. He añadido algunos nuevos modos de escala, como se describe a continuación.
0
Resize to Fit specified dimensions (sin recortar)
1
Crop and resize to best fit the dimensions (por defecto)
2
Resize proportionally to fit entire image into specified dimensions, and add borders if required
3
Resize proportionally adjusting size of scaled image so there are no borders gaps
4

5



Cropping Alignment/ Positioning

The code allows you to align the cropping region to different edges of the image. This isn’t full positioning with x,y co-ordinates, but 99 times in 100 you won’t need that anyway. Since this reduces the complexity considerably it made implementation simpler.
El código le permite alinear la región de cultivo de diferentes bordes de la imagen. Esto no está lleno de posicionamiento con coordenadas x, y, aunque 99 veces de cada 100 no será necesario que de todos modos. Dado que este reduce la complejidad considerablemente hizo implementación más simple.

Usage

Cropping alignment requires 1 extra parameter being added to the query string. The letter a will let you set the alignment.

The parameters are straight forward to understand. They are:

  • c : position en el centro (this is the default)
  • t : alinear arriba
  • tr : alinear arriba derecha
  • tl : alinear arriba izquierda
  • b : alinear abajo
  • br : alinear abajo derecha
  • bl : alinear abajo izquierda
  • l : alinear izquierda
  • r : alinear derecha

Image Filters

When I talk about image filters I mean the types of effects you can get in Photoshop or most other image editors. Things like altering brightness and contrast, and blur or emboss.
Cuando hablo de filtros de imagen me refiero a los tipos de efectos que se pueden conseguir en Photoshop o en la mayoría de los otros editores de imágenes. Cosas como la alteración de brillo y contraste, y el desenfoque o relieve.

f – image filters

The filters are controlled through the ‘f‘ query variable. You give the parameter a series of characters and it converts them into different effects.

Since some filters require arguments such as colour values or strength of the filter (amount of contrast for example) you need to pass the filter id followed by the arguments in a comma separated list. For example the brightness filter (id 3) requires 1 argument – so to give a brightness strength of 10 it would look like this:
Los filtros son controlados a través de la variable de consulta 'f'. Usted da el parámetro de una serie de personajes y las convierte en diferentes efectos.Debido a que algunos filtros requieren argumentos tales como los valores de color o intensidad del filtro (cantidad de contraste, por ejemplo) que necesita para pasar el identificador de filtro seguido de los argumentos de una lista separada por comas. Por ejemplo, el filtro de brillo (id 3) requiere 1 argumento - a que den una resistencia a la luminosidad de 10 que se vería así:
f=1,10

The image filters and arguments that you can use are:
  • 1 = Negate/Invertir – Invierte los colores
  • 2 = Grayscale/ – turn the image into shades of grey
  • 3 = Brightness – Adjust brightness of image. Requires 1 argument to specify the amount of brightness to add. Values can be negative to make the image darker.
  • 4 = Contrast/Contraste – Adjust contrast of image. Requires 1 argument to specify the amount of contrast to apply. Values greater than 0 will reduce the contrast and less than 0 will increase the contrast.
  • 5 = Colorize/ Tint – Apply a colour wash to the image. Requires the most parameters of all filters. The arguments are RGBA
  • 6 = Edge Detect – Detect the edges on an image
  • 7 = Emboss/Realizar – Emboss the image (give it a kind of depth), can look nice when combined with the colorize filter above.
  • 8 = Gaussian Blur – blur the image, unfortunately you can’t specify the amount, but you can apply the same filter multiple times (as shown in the demos)
  • 9 = Selective Blur – a different type of blur. Not sure what the difference is, but this blur is less strong than the Gaussian blur.
  • 10 = Mean Removal – Uses mean removal to create a “sketchy” effect.
  • 11 = Smooth/Suavizar – Makes the image smoother.

Multiple Filters at once

To make this super flexible I thought it would be good if I could chain the filters together to use multiple filters on a single image. To do this simply separate multiple filters using a pipe character and then pass the whole lot to the API. For example the values below would apply a brightness of 10 to a grayscale image:
Para hacer esta super flexible, pensé que sería bueno si pudiera encadenar los filtros juntos para usar filtros múltiples en una sola imagen. Para hacer esto, basta con separar varios filtros usando un carácter de barra vertical y luego pasar todo el lote a la API. Por ejemplo los valores a continuación se aplicarían un brillo de 10 a una imagen en escala de grises:
f=2|1,10

s – sharpen

One little extra I recently added is a sharpen filter. This is separate to the other filters above. All you have to do is add ans=1 value to the query string.
Un poco más recientemente he añadido es un filtro de nitidez. Esto es independiente de los otros filtros anteriores. Todo lo que tiene que hacer es añadir y = 1 valor a la cadena de consulta.