Blur is missing from transform options

[jdwillemse]

Cloudinary offers blur transform options but this is not reflected in the blur API. Would be great if this API had all the options.

[d-mendoza]

Hi @jdwillemse, Can you share with us the call you are trying to make? And possibly where it is not being referenced. I found an example that uses blur here: https://cloudinary.com/cookbook/tag/blur I am looking forward to your update.

[jdwillemse]

I want to be able to chain this filter to the other transformations

  transformer
    .width(width)
    .crop('fill')
    .gravity('faces')
    .blur('300')

Here is another reference: https://cloudinary.com/documentation/image_transformations#blurring_pixelating_and_sharpening_effects

[d-mendoza]

@jdwillemse

I believe you are trying to create a chained transformation, more info here. If you can share the whole transformation you are trying do, I can go ahead a try to reproduce the issue. Also, can you identify the language you are using, it appears that it is Java?

If sensitive information is being shared, you can open a support ticket at https://support.cloudinary.com/hc/en-us/requests/new and address it to me.

[jdwillemse]

I'm using the core lib in JS (React). Here is the relevant code

import cloudinary from 'cloudinary-core';

const cloudinaryCore = new cloudinary.Cloudinary({ cloud_name: 'xxxx' });
const transformer = new cloudinary.Transformation();
…
const transform = transformer
    .width(width)
    .crop('fill')
    .gravity('faces');
…
<img src={`${cloudinaryCore.url(source, transform)}` />

[d-mendoza]

@jdwillemse Thank you for reporting this. I will send it over to our dev team to review.

In the meantime, the alternative would be to do either of the following:

var cloudinary = require("cloudinary-core");

const cloudinaryCore = new cloudinary.Cloudinary({ cloud_name: 'xxxx' });
const transformer = new cloudinary.Transformation();

const transform = transformer
    .width(500)
    .crop('fill')
    .gravity('faces')
    .chain()
    .overlay("text:arial_60:This is my picture")
    .gravity("north")
    .y(20).chain().width(10).crop("crop");

// Use imageTag to generate a html formatted image tag
console.log(cloudinaryCore.imageTag("couple.jpg").transformation()
    .width(500).crop('fill').gravity('faces').chain()
    .overlay("text:arial_60:This is my picture").gravity("north").y(20)
    .toHtml());
// Results
// <img src="http://res.cloudinary.com/xxxx/image/upload/c_fill,g_faces,w_500/g_north,l_text:arial_60:This is my picture,y_20/couple.jpg">

console.log(cloudinaryCore.url("couple.jpg", transform));
// Results
// http://res.cloudinary.com/xxxx/image/upload/c_fill,g_faces,w_500/g_north,l_text:arial_60:This is my picture,y_20/couple.jpg

[d-mendoza]

Hi @jdwillemse, I wanted to add to this ticket. I believe what you actually wanted to do was:

const cl = cloudinary.Cloudinary.new({cloud_name: "demo"});
let transformer = new cloudinary.Transformation()
  .effect( "blur_faces:300") // or any other blur effect
  .crop("fill")
  .width(400);
cl.url( 'friends', transformer);

Please let us know if this answers your question.