自动背景图像旋转清除

用户接口,无论是移动应用或桌面应用都包含大量视觉媒体(图像和视频),需要设计师和前端开发商密切合作构建UI进程包含设计师对开发师交接,设计师转编开发者用Photoshop、InVision和Scletch等工具制作的蓝图开发者用级联样式表执行蓝图

旋转图像背景是一项常用任务安市极佳教程写由克雷格巴克勒2018年7月描述如何使用CSS云化图象可多方式变换无CSS使用或参与设计师例举 :

• 删除图像背景
• 旋转图片
• 置图像于另一面
• 使图像背景透明化,使之与背景色混合

文章记录过程云式闪光作为视觉媒体端对端解决方案:它有效处理上传和即时变换、自动化优化并在所有设备中响应图像和视频

CSS, 特别是变换属性提供直接高效操作图像比方说旋转 ()CSS函数内可用指定度旋转图像这种方法直截了当,不需要外部服务,使它成为开发商的极佳起始点。

HTML和CSS整合对网页上创建和操纵元素至关重要开发者用divs等元素配置HTML并应用CSS属性可实现旋转、缩放、移动或直接转换浏览器中元素等变换这种方法虽然基础性,但构成网络开发中复杂图像操作的基础

值得注意的是,你可以通过简单向用户URL添加参数来变换云形图像

旋转图像,如此--

上载库迪纳里角形带度数参数旋转图像时钟举个例子a_60中位60码表示60度旋转URL读取

<\/Image>","codeSnippet":" \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('180_yacaar.png', {angle: 60}).toHtml();","codeSnippet":"cloudinary.imageTag('180_yacaar.png', {angle: 60}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(angle=60)","codeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(angle=60)","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->rotate(Rotate::byAngle(60));","codeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->rotate(Rotate::byAngle(60));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"angle\"=>60))","codeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"angle\"=>60))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().angle(60)).imageTag(\"180_yacaar.png\");","codeSnippet":"cloudinary.url().transformation(new Transformation().angle(60)).imageTag(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", :angle=>60)","codeSnippet":"cl_image_tag(\"180_yacaar.png\", :angle=>60)","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Angle(60)).BuildImageTag(\"180_yacaar.png\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Angle(60)).BuildImageTag(\"180_yacaar.png\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().angle(60)).generate(\"180_yacaar.png\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().angle(60)).generate(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t rotate(Rotate.byAngle(60)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t rotate(Rotate.byAngle(60)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {angle: 60})","codeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {angle: 60})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\").rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/a_60\/180_yacaar.png","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"angle":"60"}],"transformation_string":"a_60","url_suffix":"","version":"","secure":true,"public_id":"180_yacaar.png","extension":"png","format":"png","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

从程序学上讲,只有Ruby、PHP、Python、Node.js、Jaava、JavaScript、JQuery、Rect、Agle、.Net、Androidi

云化提供数十变换效果图像举个例子影效果前置旋转图像外加影变参数e_shadow前)角形参数(a_60URL中类似 :

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [ {effect: \"shadow:40\"}, {angle: 60} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [\n {effect: \"shadow:40\"},\n {angle: 60}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[ {'effect': \"shadow:40\"}, {'angle': 60} ])","codeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[\n {'effect': \"shadow:40\"},\n {'angle': 60}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40))\n\t->rotate(Rotate::byAngle(60));","codeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40))\n\t->rotate(Rotate::byAngle(60));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array( array(\"effect\"=>\"shadow:40\"), array(\"angle\"=>60) )))","codeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array(\n array(\"effect\"=>\"shadow:40\"),\n array(\"angle\"=>60)\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().effect(\"shadow:40\").chain() .angle(60)).imageTag(\"180_yacaar.png\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .effect(\"shadow:40\").chain()\n .angle(60)).imageTag(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[ {:effect=>\"shadow:40\"}, {:angle=>60} ])","codeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[\n {:effect=>\"shadow:40\"},\n {:angle=>60}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Effect(\"shadow:40\").Chain() .Angle(60)).BuildImageTag(\"180_yacaar.png\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Effect(\"shadow:40\").Chain()\n .Angle(60)).BuildImageTag(\"180_yacaar.png\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setEffect(\"shadow:40\").chain() .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setEffect(\"shadow:40\").chain()\n .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().effect(\"shadow:40\").chain() .angle(60)).generate(\"180_yacaar.png\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .effect(\"shadow:40\").chain()\n .angle(60)).generate(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40) })\n\t rotate(Rotate.byAngle(60)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40) })\n\t rotate(Rotate.byAngle(60)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [ {effect: \"shadow:40\"}, {angle: 60} ]})","codeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [\n {effect: \"shadow:40\"},\n {angle: 60}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/e_shadow:40\/a_60\/180_yacaar.png","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"effect":"shadow:40"},{"angle":"60"}],"transformation_string":"e_shadow:40\/a_60","url_suffix":"","version":"","secure":true,"public_id":"180_yacaar.png","extension":"png","format":"png","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

同时,你也可以定制X级并y市影偏移并改变影色上头通过描述参数中你所期望的值,例如:

<\/Image>","codeSnippet":" \n\t \n\t magesstative:'''''''s's's's's's'squali's's'squali's's's' <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(\n shadow()\n .strength(40)\n .color(\"yellow\")\n .offsetX(15)\n .offsetY(15)\n )\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(\n shadow()\n .strength(40)\n .color(\"yellow\")\n .offsetX(15)\n .offsetY(15)\n )\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(\n shadow()\n .strength(40)\n .color(\"yellow\")\n .offsetX(15)\n .offsetY(15)\n )\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(\n shadow()\n .strength(40)\n .color(\"yellow\")\n .offsetX(15)\n .offsetY(15)\n )\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [ {effect: \"shadow:40\", x: 15, y: 15, color: \"yellow\"}, {angle: 60} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [\n {effect: \"shadow:40\", x: 15, y: 15, color: \"yellow\"},\n {angle: 60}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[ {'effect': \"shadow:40\", 'x': 15, 'y': 15, 'color': \"yellow\"}, {'angle': 60} ])","codeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[\n {'effect': \"shadow:40\", 'x': 15, 'y': 15, 'color': \"yellow\"},\n {'angle': 60}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40)\n\t->color(Color::YELLOW)\n->offsetX(15)\n->offsetY(15))\n\t->rotate(Rotate::byAngle(60));","codeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40)\n\t->color(Color::YELLOW)\n->offsetX(15)\n->offsetY(15))\n\t->rotate(Rotate::byAngle(60));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array( array(\"effect\"=>\"shadow:40\", \"x\"=>15, \"y\"=>15, \"color\"=>\"yellow\"), array(\"angle\"=>60) )))","codeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array(\n array(\"effect\"=>\"shadow:40\", \"x\"=>15, \"y\"=>15, \"color\"=>\"yellow\"),\n array(\"angle\"=>60)\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().effect(\"shadow:40\").x(15).y(15).color(\"yellow\").chain() .angle(60)).imageTag(\"180_yacaar.png\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .effect(\"shadow:40\").x(15).y(15).color(\"yellow\").chain()\n .angle(60)).imageTag(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[ {:effect=>\"shadow:40\", :x=>15, :y=>15, :color=>\"yellow\"}, {:angle=>60} ])","codeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[\n {:effect=>\"shadow:40\", :x=>15, :y=>15, :color=>\"yellow\"},\n {:angle=>60}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Effect(\"shadow:40\").X(15).Y(15).Color(\"yellow\").Chain() .Angle(60)).BuildImageTag(\"180_yacaar.png\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Effect(\"shadow:40\").X(15).Y(15).Color(\"yellow\").Chain()\n .Angle(60)).BuildImageTag(\"180_yacaar.png\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40)\n\t.color(Color.YELLOW)\n.offsetX(15)\n.offsetY(15))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40)\n\t.color(Color.YELLOW)\n.offsetX(15)\n.offsetY(15))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setEffect(\"shadow:40\").setX(15).setY(15).setColor(\"yellow\").chain() .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setEffect(\"shadow:40\").setX(15).setY(15).setColor(\"yellow\").chain()\n .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().effect(\"shadow:40\").x(15).y(15).color(\"yellow\").chain() .angle(60)).generate(\"180_yacaar.png\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .effect(\"shadow:40\").x(15).y(15).color(\"yellow\").chain()\n .angle(60)).generate(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40)\n\t.color(Color.YELLOW)\n.offsetX(15)\n.offsetY(15))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40)\n\t.color(Color.YELLOW)\n.offsetX(15)\n.offsetY(15))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40)\n\t color(Color.YELLOW)\n offsetX(15)\n offsetY(15) })\n\t rotate(Rotate.byAngle(60)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40)\n\t color(Color.YELLOW)\n offsetX(15)\n offsetY(15) })\n\t rotate(Rotate.byAngle(60)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [ {effect: \"shadow:40\", x: 15, y: 15, color: \"yellow\"}, {angle: 60} ]})","codeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [\n {effect: \"shadow:40\", x: 15, y: 15, color: \"yellow\"},\n {angle: 60}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(\n shadow()\n .strength(40)\n .color(\"yellow\")\n .offsetX(15)\n .offsetY(15)\n )\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(\n shadow()\n .strength(40)\n .color(\"yellow\")\n .offsetX(15)\n .offsetY(15)\n )\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/e_shadow:40,x_15,y_15,co_yellow\/a_60\/180_yacaar.png","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"effect":"shadow:40","x":"15","y":"15","color":"yellow"},{"angle":"60"}],"transformation_string":"e_shadow:40,x_15,y_15,co_yellow\/a_60","url_suffix":"","version":"","secure":true,"public_id":"180_yacaar.png","extension":"png","format":"png","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

偏移效果加插图e_dis参数到URL,如此示例

<\/Image>","codeSnippet":" \n\t \n\t \n\t \n\t \n\t \n<\/Image>","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","codeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n\t \n\t \n\t \n<\/cld-image>","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","codeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","codeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('glass.jpg', {transformation: [ {overlay: new cloudinary.Layer().publicId(\"sample\"), width: 182, height: 198}, {height: \"2.0\", width: \"1.0\", crop: \"pad\"}, {overlay: new cloudinary.Layer().publicId(\"radial_ipdlli\"), effect: \"displace\", y: -8}, {effect: \"trim\"}, {flags: \"layer_apply\", x: -26, y: 28} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('glass.jpg', {transformation: [\n {overlay: new cloudinary.Layer().publicId(\"sample\"), width: 182, height: 198},\n {height: \"2.0\", width: \"1.0\", crop: \"pad\"},\n {overlay: new cloudinary.Layer().publicId(\"radial_ipdlli\"), effect: \"displace\", y: -8},\n {effect: \"trim\"},\n {flags: \"layer_apply\", x: -26, y: 28}\n ]}).toHtml();","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"glass.jpg\").image(transformation=[ {'overlay': \"sample\", 'width': 182, 'height': 198}, {'height': \"2.0\", 'width': \"1.0\", 'crop': \"pad\"}, {'overlay': \"radial_ipdlli\", 'effect': \"displace\", 'y': -8}, {'effect': \"trim\"}, {'flags': \"layer_apply\", 'x': -26, 'y': 28} ])","codeSnippet":"CloudinaryImage(\"glass.jpg\").image(transformation=[\n {'overlay': \"sample\", 'width': 182, 'height': 198},\n {'height': \"2.0\", 'width': \"1.0\", 'crop': \"pad\"},\n {'overlay': \"radial_ipdlli\", 'effect': \"displace\", 'y': -8},\n {'effect': \"trim\"},\n {'flags': \"layer_apply\", 'x': -26, 'y': 28}\n ])","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('glass.jpg'))\n\t->addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\");","codeSnippet":"(new ImageTag('glass.jpg'))\n\t->addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\");","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"glass.jpg\", array(\"transformation\"=>array( array(\"overlay\"=>\"sample\", \"width\"=>182, \"height\"=>198), array(\"height\"=>\"2.0\", \"width\"=>\"1.0\", \"crop\"=>\"pad\"), array(\"overlay\"=>\"radial_ipdlli\", \"effect\"=>\"displace\", \"y\"=>-8), array(\"effect\"=>\"trim\"), array(\"flags\"=>\"layer_apply\", \"x\"=>-26, \"y\"=>28) )))","codeSnippet":"cl_image_tag(\"glass.jpg\", array(\"transformation\"=>array(\n array(\"overlay\"=>\"sample\", \"width\"=>182, \"height\"=>198),\n array(\"height\"=>\"2.0\", \"width\"=>\"1.0\", \"crop\"=>\"pad\"),\n array(\"overlay\"=>\"radial_ipdlli\", \"effect\"=>\"displace\", \"y\"=>-8),\n array(\"effect\"=>\"trim\"),\n array(\"flags\"=>\"layer_apply\", \"x\"=>-26, \"y\"=>28)\n )))","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().overlay(new Layer().publicId(\"sample\")).width(182).height(198).chain() .height(2.0).width(1.0).crop(\"pad\").chain() .overlay(new Layer().publicId(\"radial_ipdlli\")).effect(\"displace\").y(-8).chain() .effect(\"trim\").chain() .flags(\"layer_apply\").x(-26).y(28)).imageTag(\"glass.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .overlay(new Layer().publicId(\"sample\")).width(182).height(198).chain()\n .height(2.0).width(1.0).crop(\"pad\").chain()\n .overlay(new Layer().publicId(\"radial_ipdlli\")).effect(\"displace\").y(-8).chain()\n .effect(\"trim\").chain()\n .flags(\"layer_apply\").x(-26).y(28)).imageTag(\"glass.jpg\");","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"glass.jpg\", :transformation=>[ {:overlay=>\"sample\", :width=>182, :height=>198}, {:height=>2.0, :width=>1.0, :crop=>\"pad\"}, {:overlay=>\"radial_ipdlli\", :effect=>\"displace\", :y=>-8}, {:effect=>\"trim\"}, {:flags=>\"layer_apply\", :x=>-26, :y=>28} ])","codeSnippet":"cl_image_tag(\"glass.jpg\", :transformation=>[\n {:overlay=>\"sample\", :width=>182, :height=>198},\n {:height=>2.0, :width=>1.0, :crop=>\"pad\"},\n {:overlay=>\"radial_ipdlli\", :effect=>\"displace\", :y=>-8},\n {:effect=>\"trim\"},\n {:flags=>\"layer_apply\", :x=>-26, :y=>28}\n ])","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Overlay(new Layer().PublicId(\"sample\")).Width(182).Height(198).Chain() .Height(2.0).Width(1.0).Crop(\"pad\").Chain() .Overlay(new Layer().PublicId(\"radial_ipdlli\")).Effect(\"displace\").Y(-8).Chain() .Effect(\"trim\").Chain() .Flags(\"layer_apply\").X(-26).Y(28)).BuildImageTag(\"glass.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Overlay(new Layer().PublicId(\"sample\")).Width(182).Height(198).Chain()\n .Height(2.0).Width(1.0).Crop(\"pad\").Chain()\n .Overlay(new Layer().PublicId(\"radial_ipdlli\")).Effect(\"displace\").Y(-8).Chain()\n .Effect(\"trim\").Chain()\n .Flags(\"layer_apply\").X(-26).Y(28)).BuildImageTag(\"glass.jpg\")","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('glass.jpg').transformation(Transformation()\n\t.addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"));","codeSnippet":"cloudinary.image('glass.jpg').transformation(Transformation()\n\t.addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"));","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setOverlay(\"sample\").setWidth(182).setHeight(198).chain() .setHeight(2.0).setWidth(1.0).setCrop(\"pad\").chain() .setOverlay(\"radial_ipdlli\").setEffect(\"displace\").setY(-8).chain() .setEffect(\"trim\").chain() .setFlags(\"layer_apply\").setX(-26).setY(28)).generate(\"glass.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setOverlay(\"sample\").setWidth(182).setHeight(198).chain()\n .setHeight(2.0).setWidth(1.0).setCrop(\"pad\").chain()\n .setOverlay(\"radial_ipdlli\").setEffect(\"displace\").setY(-8).chain()\n .setEffect(\"trim\").chain()\n .setFlags(\"layer_apply\").setX(-26).setY(28)).generate(\"glass.jpg\")!, cloudinary: cloudinary)","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().overlay(new Layer().publicId(\"sample\")).width(182).height(198).chain() .height(2.0).width(1.0).crop(\"pad\").chain() .overlay(new Layer().publicId(\"radial_ipdlli\")).effect(\"displace\").y(-8).chain() .effect(\"trim\").chain() .flags(\"layer_apply\").x(-26).y(28)).generate(\"glass.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .overlay(new Layer().publicId(\"sample\")).width(182).height(198).chain()\n .height(2.0).width(1.0).crop(\"pad\").chain()\n .overlay(new Layer().publicId(\"radial_ipdlli\")).effect(\"displace\").y(-8).chain()\n .effect(\"trim\").chain()\n .flags(\"layer_apply\").x(-26).y(28)).generate(\"glass.jpg\");","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('glass.jpg').transformation(Transformation()\n\t.addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"));","codeSnippet":"cloudinary.image('glass.jpg').transformation(Transformation()\n\t.addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"));","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"glass.jpg\")\n\t addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\") \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"glass.jpg\")\n\t addTransformation(\"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\") \n}.generate()","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"glass.jpg\", {transformation: [ {overlay: new cloudinary.Layer().publicId(\"sample\"), width: 182, height: 198}, {height: \"2.0\", width: \"1.0\", crop: \"pad\"}, {overlay: new cloudinary.Layer().publicId(\"radial_ipdlli\"), effect: \"displace\", y: -8}, {effect: \"trim\"}, {flags: \"layer_apply\", x: -26, y: 28} ]})","codeSnippet":"$.cloudinary.image(\"glass.jpg\", {transformation: [\n {overlay: new cloudinary.Layer().publicId(\"sample\"), width: 182, height: 198},\n {height: \"2.0\", width: \"1.0\", crop: \"pad\"},\n {overlay: new cloudinary.Layer().publicId(\"radial_ipdlli\"), effect: \"displace\", y: -8},\n {effect: \"trim\"},\n {flags: \"layer_apply\", x: -26, y: 28}\n ]})","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","codeSnippet":"new CloudinaryImage(\"glass.jpg\").addTransformation(\n \"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28\/glass.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"overlay":"sample","width":"182","height":"198"},{"crop_mode":"pad","height":"2.0","width":"1.0"},{"overlay":"radial_ipdlli","effect":"displace","y":"-8"},{"effect":"trim"},{"flags":"layer_apply","x":"-26","y":"28"}],"transformation_string":"l_sample,w_182,h_198\/c_pad,h_2.0,w_1.0\/l_radial_ipdlli,e_displace,y_-8\/e_trim\/fl_layer_apply,x_-26,y_28","url_suffix":"","version":"","secure":true,"public_id":"glass.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image","error":{}}" with-url="true" > 加载代码示例

细节见云化产品个性化演示上coppen

去除图像背景,例如照片,先激活AI清除背景附加上云式戴斯板

取图像后台代码

\"baseball_no_bg\",\n :background_removal => 'cloudinary_ai',\n :notification_url => \"https:\/\/mysite.example.com\/hooks\")","codeSnippet":"Cloudinary::Uploader.upload(\"baseball.jpg\",\n :public_id => \"baseball_no_bg\",\n :background_removal => 'cloudinary_ai',\n :notification_url => \"https:\/\/mysite.example.com\/hooks\")"},{"sdkId":"php","framework":"php","language":"php","displayName":"PHP","packageName":"cloudinary_php","packageVersion":"1.x","packageStatus":"legacy","rawCodeSnippet":"\\Cloudinary\\Uploader::upload(\"baseball.jpg\", \n array(\n \"public_id\" => \"baseball_no_bg\",\n \"background_removal\" => \"cloudinary_ai\",\n \"notification_url\" => \"https:\/\/mysite.example.com\/hooks\"));","codeSnippet":"\\Cloudinary\\Uploader::upload(\"baseball.jpg\", \n array(\n \"public_id\" => \"baseball_no_bg\",\n \"background_removal\" => \"cloudinary_ai\",\n \"notification_url\" => \"https:\/\/mysite.example.com\/hooks\"));"},{"sdkId":"python","framework":"python","language":"python","displayName":"Python","packageName":"cloudinary","packageVersion":"1.x","packageStatus":"","rawCodeSnippet":"cloudinary.uploader.upload(\"baseball.jpg\",\n public_id = \"baseball_no_bg\",\n background_removal = \"cloudinary_ai\",\n notification_url = \"https:\/\/mysite.example.com\/hooks\")","codeSnippet":"cloudinary.uploader.upload(\"baseball.jpg\",\n public_id = \"baseball_no_bg\",\n background_removal = \"cloudinary_ai\",\n notification_url = \"https:\/\/mysite.example.com\/hooks\")"},{"sdkId":"nodejs","framework":"nodejs","language":"javascript","displayName":"Node.js","packageName":"cloudinary","packageVersion":"1.x","packageStatus":"","rawCodeSnippet":"cloudinary.v2.uploader.upload(\"baseball.jpg\", \n { public_id: \"baseball_no_bg\",\n background_removal: \"cloudinary_ai\",\n notification_url: \"https:\/\/mysite.example.com\/hooks\" }),\n function(error, result){console.log(result);});","codeSnippet":"cloudinary.v2.uploader.upload(\"baseball.jpg\", \n { public_id: \"baseball_no_bg\",\n background_removal: \"cloudinary_ai\",\n notification_url: \"https:\/\/mysite.example.com\/hooks\" }),\n function(error, result){console.log(result);});"},{"sdkId":"java","framework":"java","language":"java","displayName":"Java","packageName":"cloudinary","packageVersion":"1.x","packageStatus":"","rawCodeSnippet":"cloudinary.uploader().upload(\"baseball.jpg\", \n ObjectUtils.asMap(\n \"public_id\", \"baseball_no_bg\",\n \"background_removal\", \"cloudinary_ai\",\n \"notification_url\", \"https:\/\/mysite.example.com\/hooks\"));","codeSnippet":"cloudinary.uploader().upload(\"baseball.jpg\", \n ObjectUtils.asMap(\n \"public_id\", \"baseball_no_bg\",\n \"background_removal\", \"cloudinary_ai\",\n \"notification_url\", \"https:\/\/mysite.example.com\/hooks\"));"},{"sdkId":"csharp","framework":"csharp","language":"java","displayName":".NET","packageName":"CloudinaryDotNet","packageVersion":"1.x","packageStatus":"","rawCodeSnippet":"var uploadParams = new ImageUploadParams(){\n File = new FileDescription(@\"baseball.jpg\"),\n PublicId = \"baseball_no_bg\",\n BackgroundRemoval = \"cloudinary_ai\",\n NotificationUrl = \"https:\/\/mysite.example.com\/hooks\"};\nvar uploadResult = cloudinary.Upload(uploadParams);","codeSnippet":"var uploadParams = new ImageUploadParams(){\n File = new FileDescription(@\"baseball.jpg\"),\n PublicId = \"baseball_no_bg\",\n BackgroundRemoval = \"cloudinary_ai\",\n NotificationUrl = \"https:\/\/mysite.example.com\/hooks\"};\nvar uploadResult = cloudinary.Upload(uploadParams);"}]" parsed-url="[]" with-url="false" > 加载代码示例

上方代码notification_url端点接收Post应用请求后背景清除完全举个例子

{fo_kinary_ai},fo_statiment_i>,pject_url's/res/res.clivary.com/demo/image/upload/v1511/bng

比较看

以上:	化为这些

默认时,不管编程语言如何,云性自动在所有变换图像上实现某些优化提高用户经验后,在向用户传送前,进一步优化视觉媒体,向用户URL添加数项参数

上头q_aut参数引导云化选择最优质量压缩级和编码设置后生成图像为保存带宽而缩小尺寸,具有极佳视觉质量示例URL

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [ {effect: \"shadow:40\", quality: \"auto\"}, {angle: 60} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [\n {effect: \"shadow:40\", quality: \"auto\"},\n {angle: 60}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[ {'effect': \"shadow:40\", 'quality': \"auto\"}, {'angle': 60} ])","codeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[\n {'effect': \"shadow:40\", 'quality': \"auto\"},\n {'angle': 60}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40))\n\t->delivery(Delivery::quality(\n\tQuality::auto()))\n\t->rotate(Rotate::byAngle(60));","codeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40))\n\t->delivery(Delivery::quality(\n\tQuality::auto()))\n\t->rotate(Rotate::byAngle(60));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array( array(\"effect\"=>\"shadow:40\", \"quality\"=>\"auto\"), array(\"angle\"=>60) )))","codeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array(\n array(\"effect\"=>\"shadow:40\", \"quality\"=>\"auto\"),\n array(\"angle\"=>60)\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().effect(\"shadow:40\").quality(\"auto\").chain() .angle(60)).imageTag(\"180_yacaar.png\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .effect(\"shadow:40\").quality(\"auto\").chain()\n .angle(60)).imageTag(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[ {:effect=>\"shadow:40\", :quality=>\"auto\"}, {:angle=>60} ])","codeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[\n {:effect=>\"shadow:40\", :quality=>\"auto\"},\n {:angle=>60}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Effect(\"shadow:40\").Quality(\"auto\").Chain() .Angle(60)).BuildImageTag(\"180_yacaar.png\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Effect(\"shadow:40\").Quality(\"auto\").Chain()\n .Angle(60)).BuildImageTag(\"180_yacaar.png\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.quality(\n\tQuality.auto()))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.quality(\n\tQuality.auto()))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setEffect(\"shadow:40\").setQuality(\"auto\").chain() .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setEffect(\"shadow:40\").setQuality(\"auto\").chain()\n .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().effect(\"shadow:40\").quality(\"auto\").chain() .angle(60)).generate(\"180_yacaar.png\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .effect(\"shadow:40\").quality(\"auto\").chain()\n .angle(60)).generate(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.quality(\n\tQuality.auto()))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.quality(\n\tQuality.auto()))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40) })\n\t delivery(Delivery.quality(\n\tQuality.auto()))\n\t rotate(Rotate.byAngle(60)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40) })\n\t delivery(Delivery.quality(\n\tQuality.auto()))\n\t rotate(Rotate.byAngle(60)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [ {effect: \"shadow:40\", quality: \"auto\"}, {angle: 60} ]})","codeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [\n {effect: \"shadow:40\", quality: \"auto\"},\n {angle: 60}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(quality(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/e_shadow:40,q_auto\/a_60\/180_yacaar.png","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"effect":"shadow:40","quality":"auto"},{"angle":"60"}],"transformation_string":"e_shadow:40,q_auto\/a_60","url_suffix":"","version":"","secure":true,"public_id":"180_yacaar.png","extension":"png","format":"png","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

上头f_aut参数引导云分析图像内容并选择最佳交付格式云形图像向 Chrome浏览器提供WebP图像,JPEG-XR图像向InternetExplorer浏览器提供并保留所有其他浏览器原创格式高品质算法判定某些图像最优格式为PNG-8或PNG-24时,

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [ {effect: \"shadow:40\"}, {angle: 60} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('180_yacaar.png', {transformation: [\n {effect: \"shadow:40\"},\n {angle: 60}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[ {'effect': \"shadow:40\"}, {'angle': 60} ])","codeSnippet":"CloudinaryImage(\"180_yacaar.png\").image(transformation=[\n {'effect': \"shadow:40\"},\n {'angle': 60}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40))\n\t->delivery(Delivery::format(\n\tFormat::auto()))\n\t->rotate(Rotate::byAngle(60));","codeSnippet":"(new ImageTag('180_yacaar.png'))\n\t->effect(Effect::shadow()->strength(40))\n\t->delivery(Delivery::format(\n\tFormat::auto()))\n\t->rotate(Rotate::byAngle(60));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array( array(\"effect\"=>\"shadow:40\"), array(\"angle\"=>60) )))","codeSnippet":"cl_image_tag(\"180_yacaar.png\", array(\"transformation\"=>array(\n array(\"effect\"=>\"shadow:40\"),\n array(\"angle\"=>60)\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().effect(\"shadow:40\").chain() .angle(60)).imageTag(\"180_yacaar.png\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .effect(\"shadow:40\").chain()\n .angle(60)).imageTag(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[ {:effect=>\"shadow:40\"}, {:angle=>60} ])","codeSnippet":"cl_image_tag(\"180_yacaar.png\", :transformation=>[\n {:effect=>\"shadow:40\"},\n {:angle=>60}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Effect(\"shadow:40\").Chain() .Angle(60)).BuildImageTag(\"180_yacaar.png\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Effect(\"shadow:40\").Chain()\n .Angle(60)).BuildImageTag(\"180_yacaar.png\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.format(\n\tFormat.auto()))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.format(\n\tFormat.auto()))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setEffect(\"shadow:40\").chain() .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setEffect(\"shadow:40\").chain()\n .setAngle(60)).generate(\"180_yacaar.png\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().effect(\"shadow:40\").chain() .angle(60)).generate(\"180_yacaar.png\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .effect(\"shadow:40\").chain()\n .angle(60)).generate(\"180_yacaar.png\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.format(\n\tFormat.auto()))\n\t.rotate(Rotate.byAngle(60)));","codeSnippet":"cloudinary.image('180_yacaar.png').transformation(Transformation()\n\t.effect(Effect.shadow().strength(40))\n\t.delivery(Delivery.format(\n\tFormat.auto()))\n\t.rotate(Rotate.byAngle(60)));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40) })\n\t delivery(Delivery.format(\n\tFormat.auto()))\n\t rotate(Rotate.byAngle(60)) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"180_yacaar.png\")\n\t effect(Effect.shadow() { strength(40) })\n\t delivery(Delivery.format(\n\tFormat.auto()))\n\t rotate(Rotate.byAngle(60)) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [ {effect: \"shadow:40\"}, {angle: 60} ]})","codeSnippet":"$.cloudinary.image(\"180_yacaar.png\", {transformation: [\n {effect: \"shadow:40\"},\n {angle: 60}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","codeSnippet":"new CloudinaryImage(\"180_yacaar.png\")\n .effect(shadow().strength(40))\n .delivery(format(auto()))\n .rotate(byAngle(60));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/e_shadow:40,f_auto\/a_60\/180_yacaar.png","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"effect":"shadow:40","format":"auto"},{"angle":"60"}],"transformation_string":"e_shadow:40,f_auto\/a_60","url_suffix":"","version":"","secure":true,"public_id":"180_yacaar.png","extension":"png","format":"png","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

由云形旋转或清除图像背景更多细节查一查相关云文件和这个文章内容并描述如何在云形上执行其他图像变换