在许多移动和网络应用中,这是一个常见挑战: 如何允许用户上传自己的图像,同时自动修改图像以适应固定图形设计?
经典实例是用户上传剖面图片,但他们不提供头像(这正是我们真正需要从中获取的东西),而是上传全体图片并带后台附加对象显性图像需要裁剪到剖面图片大小,同时聚焦用户脸部
实现此目标的一个方法就是允许用户裁剪图像本身作为上传过程的一部分即便如此,通常需要在不同背景中使用图像,大小和位置不同,用户裁剪无法帮助我们制作所有这些不同版本
更高级方法人脸检测新建软件工具API识别图像表情并自动裁剪图像,聚焦人脸实际上面向检测裁剪云管理法和API最受欢迎特征
但现在我们想向前跨出一步:自动裁剪千张图片,聚焦非人脸对象举例说 电子商务产品 食品 动物 或比算法更难检测
取这三张食品板图像-许多像这些图像上传到食品网站用户,如云信客户由美市,奇班多市并与吃:
网站需要自动生成大小缩图版这些照片,智能裁剪显示食物板主段绝对需要智能裁剪 基于照片最吸引人的部分比长相检测裁剪还大技术挑战
这正是imaga使用智能裁剪技术-建立系统可检测到图像中最有吸引力的部分并自动聚焦于它Imagari图像管理解决方案中整合Imaga, 你可以测试它作为免费级的一部分
读看云化如何自动裁剪复杂图像聚焦图片最吸引人的部分,并自动生成美丽的缩略图,单行代码
继续举食物网站的例子 使用云形和Imaga自动生成食物板缩图网站图形设计需要200x90缩略图上图显示
云形模式调用填充
允许您裁剪图像到某些维度,同时自动填充空间并产生裁剪结果可指定重力
向云形表示收成应面向哪个方向
动态URL代码填充
模式并置重力北边
:
上方代码生成动态URL,用户访问该URL时图像转换并飞送可直接创建此URL, 或使用云端客户库用单行代码做同一件事, 使用所有常用语言和框架, 包括PHP、Ruby on Rails和Norde.js点击文章代码样本中的标签用语言或框架选择查看代码
结果如下:
可见结果远非最优特别是汤照片完全不显示汤板中心点
重力加这次结果更好,但仍不够好
下图使用南边
重力并不足以建成专业食品网站
幸好有Imagaad通过设置裁剪
URL中的参数imagga标度
并具体说明二零零零九年维度,更美的缩略图动态生成
imagga裁剪图像URL
上图由Imagga智能裁剪技术生成 自动聚焦原创图像中最重要的部分
注释 :URL上显示并产生Imaga变换,图象变换参数前有专用签名/``s--MwkAA0qt--``/
.云形程序要求此代码激活Imaga添加查看如何添加到 URL,见文档记录.云形中也可以使用Imaga而不使用签名eager变换.
用户加载照片常有主对象最相干,背景不那么有趣,在许多情况下不应在网站显示下图中主对象小猫 环绕小猫有绿草
<\/Image>","codeSnippet":"
\n\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(\"kitten.jpg\");","codeSnippet":"new CloudinaryImage(\"kitten.jpg\");","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\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(\"kitten.jpg\");","codeSnippet":"new CloudinaryImage(\"kitten.jpg\");","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":"
<\/cl-image>","codeSnippet":"
\n\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(\"kitten.jpg\");","codeSnippet":"new CloudinaryImage(\"kitten.jpg\");","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('kitten.jpg').toHtml();","codeSnippet":"cloudinary.imageTag('kitten.jpg').toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"kitten.jpg\").image()","codeSnippet":"CloudinaryImage(\"kitten.jpg\").image()","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('kitten.jpg'));","codeSnippet":"(new ImageTag('kitten.jpg'));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"kitten.jpg\")","codeSnippet":"cl_image_tag(\"kitten.jpg\")","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().imageTag(\"kitten.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation().imageTag(\"kitten.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"kitten.jpg\")","codeSnippet":"cl_image_tag(\"kitten.jpg\")","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.BuildImageTag(\"kitten.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.BuildImageTag(\"kitten.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('kitten.jpg').transformation(Transformation());","codeSnippet":"cloudinary.image('kitten.jpg').transformation(Transformation());","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().generate(\"kitten.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().generate(\"kitten.jpg\")!, 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().generate(\"kitten.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().generate(\"kitten.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('kitten.jpg').transformation(Transformation());","codeSnippet":"cloudinary.image('kitten.jpg').transformation(Transformation());","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"kitten.jpg\") \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"kitten.jpg\") \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(\"kitten.jpg\")","codeSnippet":"$.cloudinary.image(\"kitten.jpg\")","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(\"kitten.jpg\");","codeSnippet":"new CloudinaryImage(\"kitten.jpg\");","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\/kitten.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[],"transformation_string":"","url_suffix":"","version":"","secure":true,"public_id":"kitten.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" >
加载代码示例
绿色背景照片非常好, 当显示相册或新闻馈送时, 你可能想强调小猫本身
通过设置裁剪
URL中的参数imagga_crop
不具体说明宽度或高度,Imaga智能增殖图像保持相关部分可见性,同时去除无关性元素
URL和样本代码可用于嵌入HTML图像标签
hith[智能裁剪小猫相https://res.www.aaaalireno.com/demo/image/upload/s–1tQspuaM–/c_imagga_crop/kitten.jpg洪布:https://res.www.aaaalireno.com/demo/image/upload/s–cJcagalH–/c_imagga_crop/c_scale,w_200/kitten.jpg)
原创图像850x565,裁剪版462x441上方图像中,我们也向下缩为200像素宽度,以更好地适应此文章
举个例子,这次肥猫照片上也有相同的问题:猫周围绿色背景模糊
<\/Image>","codeSnippet":"
\n\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(\"fat_cat.jpg\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\");","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\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(\"fat_cat.jpg\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":"
<\/cl-image>","codeSnippet":"
\n\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(\"fat_cat.jpg\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('fat_cat.jpg').toHtml();","codeSnippet":"cloudinary.imageTag('fat_cat.jpg').toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image()","codeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image()","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('fat_cat.jpg'));","codeSnippet":"(new ImageTag('fat_cat.jpg'));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\")","codeSnippet":"cl_image_tag(\"fat_cat.jpg\")","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().imageTag(\"fat_cat.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation().imageTag(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\")","codeSnippet":"cl_image_tag(\"fat_cat.jpg\")","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.BuildImageTag(\"fat_cat.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.BuildImageTag(\"fat_cat.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation());","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation());","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().generate(\"fat_cat.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().generate(\"fat_cat.jpg\")!, 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().generate(\"fat_cat.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().generate(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation());","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation());","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\") \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\") \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(\"fat_cat.jpg\")","codeSnippet":"$.cloudinary.image(\"fat_cat.jpg\")","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(\"fat_cat.jpg\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\");","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\/fat_cat.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[],"transformation_string":"","url_suffix":"","version":"","secure":true,"public_id":"fat_cat.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" >
加载代码示例
添加C#imagga#crop
URL自动裁剪照片聚焦猫,使用Imagaad-on
<\/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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('fat_cat.jpg', {crop: \"imagga_crop\", signUrl: true}).toHtml();","codeSnippet":"cloudinary.imageTag('fat_cat.jpg', {crop: \"imagga_crop\", signUrl: true}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(crop=\"imagga_crop\", sign_url=True)","codeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(crop=\"imagga_crop\", sign_url=True)","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::imaggaCrop())\n\t->sign();","codeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::imaggaCrop())\n\t->sign();","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"crop\"=>\"imagga_crop\", \"sign_url\"=>true))","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"crop\"=>\"imagga_crop\", \"sign_url\"=>true))","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().crop(\"imagga_crop\")).signed(true).imageTag(\"fat_cat.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation().crop(\"imagga_crop\")).signed(true).imageTag(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", :crop=>\"imagga_crop\", :sign_url=>true)","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", :crop=>\"imagga_crop\", :sign_url=>true)","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().Crop(\"imagga_crop\")).Signed(true).BuildImageTag(\"fat_cat.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Crop(\"imagga_crop\")).Signed(true).BuildImageTag(\"fat_cat.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.setSignature(\"MR9UyfCL\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.setSignature(\"MR9UyfCL\"));","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().setCrop(\"imagga_crop\")).generate(\"fat_cat.jpg\", signUrl: true)!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setCrop(\"imagga_crop\")).generate(\"fat_cat.jpg\", signUrl: true)!, 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().crop(\"imagga_crop\")).signed(true).generate(\"fat_cat.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation().crop(\"imagga_crop\")).signed(true).generate(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.setSignature(\"MR9UyfCL\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.setSignature(\"MR9UyfCL\"));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.imaggaCrop())\n\t signature() \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.imaggaCrop())\n\t signature() \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(\"fat_cat.jpg\", {crop: \"imagga_crop\"})","codeSnippet":"$.cloudinary.image(\"fat_cat.jpg\", {crop: \"imagga_crop\"})","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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .setSignature(\"MR9UyfCL\");","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\/s--MR9UyfCL--\/c_imagga_crop\/fat_cat.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"crop_mode":"imagga_crop"}],"transformation_string":"c_imagga_crop","url_suffix":"","version":"","secure":true,"public_id":"fat_cat.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"MR9UyfCL","private_cdn":false,"result_asset_type":"image"}" with-url="true" >
加载代码示例
智能裁剪通常不是故事尾声 通常需要额外变换
边做边做同一种代码 上面用来告诉云人智能裁剪照片 并稍加修改以产生更多效果简单例子如下:让我们假设我们的图形设计要求猫重缩为200x200像素,带白空间嵌套并环绕边界
光靠使用即可实现程序板
裁剪模式 :
<\/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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('fat_cat.jpg', {signUrl: true, transformation: [ {crop: \"imagga_crop\"}, {border: \"1px_solid_rgb:aaa\", height: 200, width: 200, crop: \"pad\"} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('fat_cat.jpg', {signUrl: true, transformation: [\n {crop: \"imagga_crop\"},\n {border: \"1px_solid_rgb:aaa\", height: 200, width: 200, crop: \"pad\"}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(sign_url=True, transformation=[ {'crop': \"imagga_crop\"}, {'border': \"1px_solid_rgb:aaa\", 'height': 200, 'width': 200, 'crop': \"pad\"} ])","codeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(sign_url=True, transformation=[\n {'crop': \"imagga_crop\"},\n {'border': \"1px_solid_rgb:aaa\", 'height': 200, 'width': 200, 'crop': \"pad\"}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::imaggaCrop())\n\t->resize(Resize::pad()->width(200)\n->height(200))\n\t->border(Border::solid(1,Color::rgb(\"aaa\")))\n\t->sign();","codeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::imaggaCrop())\n\t->resize(Resize::pad()->width(200)\n->height(200))\n\t->border(Border::solid(1,Color::rgb(\"aaa\")))\n\t->sign();","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"sign_url\"=>true, \"transformation\"=>array( array(\"crop\"=>\"imagga_crop\"), array(\"border\"=>\"1px_solid_rgb:aaa\", \"height\"=>200, \"width\"=>200, \"crop\"=>\"pad\") )))","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"sign_url\"=>true, \"transformation\"=>array(\n array(\"crop\"=>\"imagga_crop\"),\n array(\"border\"=>\"1px_solid_rgb:aaa\", \"height\"=>200, \"width\"=>200, \"crop\"=>\"pad\")\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().crop(\"imagga_crop\").chain() .border(\"1px_solid_rgb:aaa\").height(200).width(200).crop(\"pad\")).signed(true).imageTag(\"fat_cat.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .crop(\"imagga_crop\").chain()\n .border(\"1px_solid_rgb:aaa\").height(200).width(200).crop(\"pad\")).signed(true).imageTag(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", :sign_url=>true, :transformation=>[ {:crop=>\"imagga_crop\"}, {:border=>\"1px_solid_rgb:aaa\", :height=>200, :width=>200, :crop=>\"pad\"} ])","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", :sign_url=>true, :transformation=>[\n {:crop=>\"imagga_crop\"},\n {:border=>\"1px_solid_rgb:aaa\", :height=>200, :width=>200, :crop=>\"pad\"}\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().Crop(\"imagga_crop\").Chain() .Border(\"1px_solid_rgb:aaa\").Height(200).Width(200).Crop(\"pad\")).Signed(true).BuildImageTag(\"fat_cat.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Crop(\"imagga_crop\").Chain()\n .Border(\"1px_solid_rgb:aaa\").Height(200).Width(200).Crop(\"pad\")).Signed(true).BuildImageTag(\"fat_cat.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.resize(Resize.pad().width(200)\n.height(200))\n\t.border(Border.solid(1,Color.rgb(\"aaa\")))\n\t.setSignature(\"XzUAIh3B\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.resize(Resize.pad().width(200)\n.height(200))\n\t.border(Border.solid(1,Color.rgb(\"aaa\")))\n\t.setSignature(\"XzUAIh3B\"));","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().setCrop(\"imagga_crop\").chain() .setBorder(\"1px_solid_rgb:aaa\").setHeight(200).setWidth(200).setCrop(\"pad\")).generate(\"fat_cat.jpg\", signUrl: true)!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setCrop(\"imagga_crop\").chain()\n .setBorder(\"1px_solid_rgb:aaa\").setHeight(200).setWidth(200).setCrop(\"pad\")).generate(\"fat_cat.jpg\", signUrl: true)!, 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().crop(\"imagga_crop\").chain() .border(\"1px_solid_rgb:aaa\").height(200).width(200).crop(\"pad\")).signed(true).generate(\"fat_cat.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .crop(\"imagga_crop\").chain()\n .border(\"1px_solid_rgb:aaa\").height(200).width(200).crop(\"pad\")).signed(true).generate(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.resize(Resize.pad().width(200)\n.height(200))\n\t.border(Border.solid(1,Color.rgb(\"aaa\")))\n\t.setSignature(\"XzUAIh3B\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.resize(Resize.pad().width(200)\n.height(200))\n\t.border(Border.solid(1,Color.rgb(\"aaa\")))\n\t.setSignature(\"XzUAIh3B\"));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.imaggaCrop())\n\t resize(Resize.pad() { width(200)\n height(200) })\n\t border(Border.solid(1,Color.rgb(\"aaa\")))\n\t signature() \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.imaggaCrop())\n\t resize(Resize.pad() { width(200)\n height(200) })\n\t border(Border.solid(1,Color.rgb(\"aaa\")))\n\t signature() \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(\"fat_cat.jpg\", {transformation: [ {crop: \"imagga_crop\"}, {border: \"1px_solid_rgb:aaa\", height: 200, width: 200, crop: \"pad\"} ]})","codeSnippet":"$.cloudinary.image(\"fat_cat.jpg\", {transformation: [\n {crop: \"imagga_crop\"},\n {border: \"1px_solid_rgb:aaa\", height: 200, width: 200, crop: \"pad\"}\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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(pad().width(200).height(200))\n .border(solid(1, \"#aaa\"))\n .setSignature(\"XzUAIh3B\");","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\/s--XzUAIh3B--\/c_imagga_crop\/bo_1px_solid_rgb:aaa,c_pad,h_200,w_200\/fat_cat.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"crop_mode":"imagga_crop"},{"border":"1px_solid_rgb:aaa","crop_mode":"pad","height":"200","width":"200"}],"transformation_string":"c_imagga_crop\/bo_1px_solid_rgb:aaa,c_pad,h_200,w_200","url_suffix":"","version":"","secure":true,"public_id":"fat_cat.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"XzUAIh3B","private_cdn":false,"result_asset_type":"image"}" with-url="true" >
加载代码示例
相同的代码加多参数使图像圆形,加绿边框,加色饱和度,应用锐化效果并添加标志水印,同时修改亮度和尺寸所有这些图像变换均由云形完成,用户先存取图像
<\/Image>","codeSnippet":"
\n\t
\n\t
\n\t
\n\t
\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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","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\t
\n\t
\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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","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-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\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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('fat_cat.jpg', {signUrl: true, transformation: [ {crop: \"imagga_crop\"}, {width: 200, crop: \"scale\"}, {border: \"5px_solid_rgb:19340b\", radius: \"max\"}, {effect: \"saturation:100\"}, {effect: \"sharpen\"}, {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('fat_cat.jpg', {signUrl: true, transformation: [\n {crop: \"imagga_crop\"},\n {width: 200, crop: \"scale\"},\n {border: \"5px_solid_rgb:19340b\", radius: \"max\"},\n {effect: \"saturation:100\"},\n {effect: \"sharpen\"},\n {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(sign_url=True, transformation=[ {'crop': \"imagga_crop\"}, {'width': 200, 'crop': \"scale\"}, {'border': \"5px_solid_rgb:19340b\", 'radius': \"max\"}, {'effect': \"saturation:100\"}, {'effect': \"sharpen\"}, {'effect': \"brightness:-90\", 'flags': \"relative\", 'overlay': \"cloudinary_icon\", 'opacity': 25, 'width': \"0.4\", 'crop': \"scale\"} ])","codeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(sign_url=True, transformation=[\n {'crop': \"imagga_crop\"},\n {'width': 200, 'crop': \"scale\"},\n {'border': \"5px_solid_rgb:19340b\", 'radius': \"max\"},\n {'effect': \"saturation:100\"},\n {'effect': \"sharpen\"},\n {'effect': \"brightness:-90\", 'flags': \"relative\", 'overlay': \"cloudinary_icon\", 'opacity': 25, 'width': \"0.4\", 'crop': \"scale\"}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::imaggaCrop())\n\t->resize(Resize::scale()->width(200))\n\t->border(Border::solid(5,Color::rgb(\"19340b\"))\n\t->roundCorners(\n\tRoundCorners::max())\n\t)\n\t->adjust(Adjust::saturation()->level(100))\n\t->adjust(Adjust::sharpen())\n\t->overlay(Overlay::source(\n\tSource::image(\"cloudinary_icon\")\n\t->transformation((new Transformation())\n\t->resize(Resize::scale()->width(0.4)\n\t->relative()\n\t)\n\t->adjust(Adjust::opacity(25))\n\t->adjust(Adjust::brightness()->level(-90)))\n\t))\n\t->sign();","codeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::imaggaCrop())\n\t->resize(Resize::scale()->width(200))\n\t->border(Border::solid(5,Color::rgb(\"19340b\"))\n\t->roundCorners(\n\tRoundCorners::max())\n\t)\n\t->adjust(Adjust::saturation()->level(100))\n\t->adjust(Adjust::sharpen())\n\t->overlay(Overlay::source(\n\tSource::image(\"cloudinary_icon\")\n\t->transformation((new Transformation())\n\t->resize(Resize::scale()->width(0.4)\n\t->relative()\n\t)\n\t->adjust(Adjust::opacity(25))\n\t->adjust(Adjust::brightness()->level(-90)))\n\t))\n\t->sign();","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"sign_url\"=>true, \"transformation\"=>array( array(\"crop\"=>\"imagga_crop\"), array(\"width\"=>200, \"crop\"=>\"scale\"), array(\"border\"=>\"5px_solid_rgb:19340b\", \"radius\"=>\"max\"), array(\"effect\"=>\"saturation:100\"), array(\"effect\"=>\"sharpen\"), array(\"effect\"=>\"brightness:-90\", \"flags\"=>\"relative\", \"overlay\"=>\"cloudinary_icon\", \"opacity\"=>25, \"width\"=>\"0.4\", \"crop\"=>\"scale\") )))","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"sign_url\"=>true, \"transformation\"=>array(\n array(\"crop\"=>\"imagga_crop\"),\n array(\"width\"=>200, \"crop\"=>\"scale\"),\n array(\"border\"=>\"5px_solid_rgb:19340b\", \"radius\"=>\"max\"),\n array(\"effect\"=>\"saturation:100\"),\n array(\"effect\"=>\"sharpen\"),\n array(\"effect\"=>\"brightness:-90\", \"flags\"=>\"relative\", \"overlay\"=>\"cloudinary_icon\", \"opacity\"=>25, \"width\"=>\"0.4\", \"crop\"=>\"scale\")\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().crop(\"imagga_crop\").chain() .width(200).crop(\"scale\").chain() .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain() .effect(\"saturation:100\").chain() .effect(\"sharpen\").chain() .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).signed(true).imageTag(\"fat_cat.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .crop(\"imagga_crop\").chain()\n .width(200).crop(\"scale\").chain()\n .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain()\n .effect(\"saturation:100\").chain()\n .effect(\"sharpen\").chain()\n .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).signed(true).imageTag(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", :sign_url=>true, :transformation=>[ {:crop=>\"imagga_crop\"}, {:width=>200, :crop=>\"scale\"}, {:border=>\"5px_solid_rgb:19340b\", :radius=>\"max\"}, {:effect=>\"saturation:100\"}, {:effect=>\"sharpen\"}, {:effect=>\"brightness:-90\", :flags=>\"relative\", :overlay=>\"cloudinary_icon\", :opacity=>25, :width=>0.4, :crop=>\"scale\"} ])","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", :sign_url=>true, :transformation=>[\n {:crop=>\"imagga_crop\"},\n {:width=>200, :crop=>\"scale\"},\n {:border=>\"5px_solid_rgb:19340b\", :radius=>\"max\"},\n {:effect=>\"saturation:100\"},\n {:effect=>\"sharpen\"},\n {:effect=>\"brightness:-90\", :flags=>\"relative\", :overlay=>\"cloudinary_icon\", :opacity=>25, :width=>0.4, :crop=>\"scale\"}\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().Crop(\"imagga_crop\").Chain() .Width(200).Crop(\"scale\").Chain() .Border(\"5px_solid_rgb:19340b\").Radius(\"max\").Chain() .Effect(\"saturation:100\").Chain() .Effect(\"sharpen\").Chain() .Effect(\"brightness:-90\").Flags(\"relative\").Overlay(new Layer().PublicId(\"cloudinary_icon\")).Opacity(25).Width(0.4).Crop(\"scale\")).Signed(true).BuildImageTag(\"fat_cat.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Crop(\"imagga_crop\").Chain()\n .Width(200).Crop(\"scale\").Chain()\n .Border(\"5px_solid_rgb:19340b\").Radius(\"max\").Chain()\n .Effect(\"saturation:100\").Chain()\n .Effect(\"sharpen\").Chain()\n .Effect(\"brightness:-90\").Flags(\"relative\").Overlay(new Layer().PublicId(\"cloudinary_icon\")).Opacity(25).Width(0.4).Crop(\"scale\")).Signed(true).BuildImageTag(\"fat_cat.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.resize(Resize.scale().width(200))\n\t.border(Border.solid(5,Color.rgb(\"19340b\"))\n\t.roundCorners(\n\tRoundCorners.max())\n\t)\n\t.adjust(Adjust.saturation().level(100))\n\t.adjust(Adjust.sharpen())\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(0.4)\n\t.relative()\n\t)\n\t.adjust(Adjust.opacity(25))\n\t.adjust(Adjust.brightness().level(-90)))\n\t))\n\t.setSignature(\"e5VvY7Wl\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.imaggaCrop())\n\t.resize(Resize.scale().width(200))\n\t.border(Border.solid(5,Color.rgb(\"19340b\"))\n\t.roundCorners(\n\tRoundCorners.max())\n\t)\n\t.adjust(Adjust.saturation().level(100))\n\t.adjust(Adjust.sharpen())\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(0.4)\n\t.relative()\n\t)\n\t.adjust(Adjust.opacity(25))\n\t.adjust(Adjust.brightness().level(-90)))\n\t))\n\t.setSignature(\"e5VvY7Wl\"));","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().setCrop(\"imagga_crop\").chain() .setWidth(200).setCrop(\"scale\").chain() .setBorder(\"5px_solid_rgb:19340b\").setRadius(\"max\").chain() .setEffect(\"saturation:100\").chain() .setEffect(\"sharpen\").chain() .setEffect(\"brightness:-90\").setFlags(\"relative\").setOverlay(\"cloudinary_icon\").setOpacity(25).setWidth(0.4).setCrop(\"scale\")).generate(\"fat_cat.jpg\", signUrl: true)!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setCrop(\"imagga_crop\").chain()\n .setWidth(200).setCrop(\"scale\").chain()\n .setBorder(\"5px_solid_rgb:19340b\").setRadius(\"max\").chain()\n .setEffect(\"saturation:100\").chain()\n .setEffect(\"sharpen\").chain()\n .setEffect(\"brightness:-90\").setFlags(\"relative\").setOverlay(\"cloudinary_icon\").setOpacity(25).setWidth(0.4).setCrop(\"scale\")).generate(\"fat_cat.jpg\", signUrl: true)!, 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().crop(\"imagga_crop\").chain() .width(200).crop(\"scale\").chain() .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain() .effect(\"saturation:100\").chain() .effect(\"sharpen\").chain() .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).signed(true).generate(\"fat_cat.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .crop(\"imagga_crop\").chain()\n .width(200).crop(\"scale\").chain()\n .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain()\n .effect(\"saturation:100\").chain()\n .effect(\"sharpen\").chain()\n .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).signed(true).generate(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.addTransformation(\"c_imagga_crop\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\")\n\t.setSignature(\"e5VvY7Wl\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.addTransformation(\"c_imagga_crop\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\")\n\t.setSignature(\"e5VvY7Wl\"));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.imaggaCrop())\n\t resize(Resize.scale() { width(200) })\n\t border(Border.solid(5,Color.rgb(\"19340b\")) {\n\t roundCorners(\n\tRoundCorners.max())\n\t })\n\t adjust(Adjust.saturation() { level(100) })\n\t adjust(Adjust.sharpen())\n\t overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\") {\n\t transformation(Transformation {\n\t resize(Resize.scale() { width(0.4F)\n\t relative()\n\t })\n\t adjust(Adjust.opacity(25))\n\t adjust(Adjust.brightness() { level(-90) }) })\n\t }))\n\t signature() \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.imaggaCrop())\n\t resize(Resize.scale() { width(200) })\n\t border(Border.solid(5,Color.rgb(\"19340b\")) {\n\t roundCorners(\n\tRoundCorners.max())\n\t })\n\t adjust(Adjust.saturation() { level(100) })\n\t adjust(Adjust.sharpen())\n\t overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\") {\n\t transformation(Transformation {\n\t resize(Resize.scale() { width(0.4F)\n\t relative()\n\t })\n\t adjust(Adjust.opacity(25))\n\t adjust(Adjust.brightness() { level(-90) }) })\n\t }))\n\t signature() \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(\"fat_cat.jpg\", {transformation: [ {crop: \"imagga_crop\"}, {width: 200, crop: \"scale\"}, {border: \"5px_solid_rgb:19340b\", radius: \"max\"}, {effect: \"saturation:100\"}, {effect: \"sharpen\"}, {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"} ]})","codeSnippet":"$.cloudinary.image(\"fat_cat.jpg\", {transformation: [\n {crop: \"imagga_crop\"},\n {width: 200, crop: \"scale\"},\n {border: \"5px_solid_rgb:19340b\", radius: \"max\"},\n {effect: \"saturation:100\"},\n {effect: \"sharpen\"},\n {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"}\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(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(imaggaCrop())\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n )\n .setSignature(\"e5VvY7Wl\");","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\/s--e5VvY7Wl--\/c_imagga_crop\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\/fat_cat.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"crop_mode":"imagga_crop"},{"crop_mode":"scale","width":"200"},{"border":"5px_solid_rgb:19340b","radius":"max"},{"effect":"saturation:100"},{"effect":"sharpen"},{"crop_mode":"scale","effect":"brightness:-90","flags":"relative","overlay":"cloudinary_icon","opacity":"25","width":"0.4"}],"transformation_string":"c_imagga_crop\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4","url_suffix":"","version":"","secure":true,"public_id":"fat_cat.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"e5VvY7Wl","private_cdn":false,"result_asset_type":"image"}" with-url="true" >
加载代码示例
最后一个插图:应用相同的图像变换而不智能裁剪原创图片差别很大吧
<\/Image>","codeSnippet":"
\n\t
\n\t
\n\t
\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(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","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\t
\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(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","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-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":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(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('fat_cat.jpg', {transformation: [ {width: 200, crop: \"scale\"}, {border: \"5px_solid_rgb:19340b\", radius: \"max\"}, {effect: \"saturation:100\"}, {effect: \"sharpen\"}, {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('fat_cat.jpg', {transformation: [\n {width: 200, crop: \"scale\"},\n {border: \"5px_solid_rgb:19340b\", radius: \"max\"},\n {effect: \"saturation:100\"},\n {effect: \"sharpen\"},\n {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(transformation=[ {'width': 200, 'crop': \"scale\"}, {'border': \"5px_solid_rgb:19340b\", 'radius': \"max\"}, {'effect': \"saturation:100\"}, {'effect': \"sharpen\"}, {'effect': \"brightness:-90\", 'flags': \"relative\", 'overlay': \"cloudinary_icon\", 'opacity': 25, 'width': \"0.4\", 'crop': \"scale\"} ])","codeSnippet":"CloudinaryImage(\"fat_cat.jpg\").image(transformation=[\n {'width': 200, 'crop': \"scale\"},\n {'border': \"5px_solid_rgb:19340b\", 'radius': \"max\"},\n {'effect': \"saturation:100\"},\n {'effect': \"sharpen\"},\n {'effect': \"brightness:-90\", 'flags': \"relative\", 'overlay': \"cloudinary_icon\", 'opacity': 25, 'width': \"0.4\", 'crop': \"scale\"}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::scale()->width(200))\n\t->border(Border::solid(5,Color::rgb(\"19340b\"))\n\t->roundCorners(\n\tRoundCorners::max())\n\t)\n\t->adjust(Adjust::saturation()->level(100))\n\t->adjust(Adjust::sharpen())\n\t->overlay(Overlay::source(\n\tSource::image(\"cloudinary_icon\")\n\t->transformation((new Transformation())\n\t->resize(Resize::scale()->width(0.4)\n\t->relative()\n\t)\n\t->adjust(Adjust::opacity(25))\n\t->adjust(Adjust::brightness()->level(-90)))\n\t));","codeSnippet":"(new ImageTag('fat_cat.jpg'))\n\t->resize(Resize::scale()->width(200))\n\t->border(Border::solid(5,Color::rgb(\"19340b\"))\n\t->roundCorners(\n\tRoundCorners::max())\n\t)\n\t->adjust(Adjust::saturation()->level(100))\n\t->adjust(Adjust::sharpen())\n\t->overlay(Overlay::source(\n\tSource::image(\"cloudinary_icon\")\n\t->transformation((new Transformation())\n\t->resize(Resize::scale()->width(0.4)\n\t->relative()\n\t)\n\t->adjust(Adjust::opacity(25))\n\t->adjust(Adjust::brightness()->level(-90)))\n\t));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"transformation\"=>array( array(\"width\"=>200, \"crop\"=>\"scale\"), array(\"border\"=>\"5px_solid_rgb:19340b\", \"radius\"=>\"max\"), array(\"effect\"=>\"saturation:100\"), array(\"effect\"=>\"sharpen\"), array(\"effect\"=>\"brightness:-90\", \"flags\"=>\"relative\", \"overlay\"=>\"cloudinary_icon\", \"opacity\"=>25, \"width\"=>\"0.4\", \"crop\"=>\"scale\") )))","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", array(\"transformation\"=>array(\n array(\"width\"=>200, \"crop\"=>\"scale\"),\n array(\"border\"=>\"5px_solid_rgb:19340b\", \"radius\"=>\"max\"),\n array(\"effect\"=>\"saturation:100\"),\n array(\"effect\"=>\"sharpen\"),\n array(\"effect\"=>\"brightness:-90\", \"flags\"=>\"relative\", \"overlay\"=>\"cloudinary_icon\", \"opacity\"=>25, \"width\"=>\"0.4\", \"crop\"=>\"scale\")\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().width(200).crop(\"scale\").chain() .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain() .effect(\"saturation:100\").chain() .effect(\"sharpen\").chain() .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).imageTag(\"fat_cat.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .width(200).crop(\"scale\").chain()\n .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain()\n .effect(\"saturation:100\").chain()\n .effect(\"sharpen\").chain()\n .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).imageTag(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"fat_cat.jpg\", :transformation=>[ {:width=>200, :crop=>\"scale\"}, {:border=>\"5px_solid_rgb:19340b\", :radius=>\"max\"}, {:effect=>\"saturation:100\"}, {:effect=>\"sharpen\"}, {:effect=>\"brightness:-90\", :flags=>\"relative\", :overlay=>\"cloudinary_icon\", :opacity=>25, :width=>0.4, :crop=>\"scale\"} ])","codeSnippet":"cl_image_tag(\"fat_cat.jpg\", :transformation=>[\n {:width=>200, :crop=>\"scale\"},\n {:border=>\"5px_solid_rgb:19340b\", :radius=>\"max\"},\n {:effect=>\"saturation:100\"},\n {:effect=>\"sharpen\"},\n {:effect=>\"brightness:-90\", :flags=>\"relative\", :overlay=>\"cloudinary_icon\", :opacity=>25, :width=>0.4, :crop=>\"scale\"}\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().Width(200).Crop(\"scale\").Chain() .Border(\"5px_solid_rgb:19340b\").Radius(\"max\").Chain() .Effect(\"saturation:100\").Chain() .Effect(\"sharpen\").Chain() .Effect(\"brightness:-90\").Flags(\"relative\").Overlay(new Layer().PublicId(\"cloudinary_icon\")).Opacity(25).Width(0.4).Crop(\"scale\")).BuildImageTag(\"fat_cat.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Width(200).Crop(\"scale\").Chain()\n .Border(\"5px_solid_rgb:19340b\").Radius(\"max\").Chain()\n .Effect(\"saturation:100\").Chain()\n .Effect(\"sharpen\").Chain()\n .Effect(\"brightness:-90\").Flags(\"relative\").Overlay(new Layer().PublicId(\"cloudinary_icon\")).Opacity(25).Width(0.4).Crop(\"scale\")).BuildImageTag(\"fat_cat.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.scale().width(200))\n\t.border(Border.solid(5,Color.rgb(\"19340b\"))\n\t.roundCorners(\n\tRoundCorners.max())\n\t)\n\t.adjust(Adjust.saturation().level(100))\n\t.adjust(Adjust.sharpen())\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(0.4)\n\t.relative()\n\t)\n\t.adjust(Adjust.opacity(25))\n\t.adjust(Adjust.brightness().level(-90)))\n\t)));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.resize(Resize.scale().width(200))\n\t.border(Border.solid(5,Color.rgb(\"19340b\"))\n\t.roundCorners(\n\tRoundCorners.max())\n\t)\n\t.adjust(Adjust.saturation().level(100))\n\t.adjust(Adjust.sharpen())\n\t.overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\")\n\t.transformation(new Transformation()\n\t.resize(Resize.scale().width(0.4)\n\t.relative()\n\t)\n\t.adjust(Adjust.opacity(25))\n\t.adjust(Adjust.brightness().level(-90)))\n\t)));","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().setWidth(200).setCrop(\"scale\").chain() .setBorder(\"5px_solid_rgb:19340b\").setRadius(\"max\").chain() .setEffect(\"saturation:100\").chain() .setEffect(\"sharpen\").chain() .setEffect(\"brightness:-90\").setFlags(\"relative\").setOverlay(\"cloudinary_icon\").setOpacity(25).setWidth(0.4).setCrop(\"scale\")).generate(\"fat_cat.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setWidth(200).setCrop(\"scale\").chain()\n .setBorder(\"5px_solid_rgb:19340b\").setRadius(\"max\").chain()\n .setEffect(\"saturation:100\").chain()\n .setEffect(\"sharpen\").chain()\n .setEffect(\"brightness:-90\").setFlags(\"relative\").setOverlay(\"cloudinary_icon\").setOpacity(25).setWidth(0.4).setCrop(\"scale\")).generate(\"fat_cat.jpg\")!, 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().width(200).crop(\"scale\").chain() .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain() .effect(\"saturation:100\").chain() .effect(\"sharpen\").chain() .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).generate(\"fat_cat.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .width(200).crop(\"scale\").chain()\n .border(\"5px_solid_rgb:19340b\").radius(\"max\").chain()\n .effect(\"saturation:100\").chain()\n .effect(\"sharpen\").chain()\n .effect(\"brightness:-90\").flags(\"relative\").overlay(new Layer().publicId(\"cloudinary_icon\")).opacity(25).width(0.4).crop(\"scale\")).generate(\"fat_cat.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.addTransformation(\"c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\"));","codeSnippet":"cloudinary.image('fat_cat.jpg').transformation(Transformation()\n\t.addTransformation(\"c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\"));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.scale() { width(200) })\n\t border(Border.solid(5,Color.rgb(\"19340b\")) {\n\t roundCorners(\n\tRoundCorners.max())\n\t })\n\t adjust(Adjust.saturation() { level(100) })\n\t adjust(Adjust.sharpen())\n\t overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\") {\n\t transformation(Transformation {\n\t resize(Resize.scale() { width(0.4F)\n\t relative()\n\t })\n\t adjust(Adjust.opacity(25))\n\t adjust(Adjust.brightness() { level(-90) }) })\n\t })) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"fat_cat.jpg\")\n\t resize(Resize.scale() { width(200) })\n\t border(Border.solid(5,Color.rgb(\"19340b\")) {\n\t roundCorners(\n\tRoundCorners.max())\n\t })\n\t adjust(Adjust.saturation() { level(100) })\n\t adjust(Adjust.sharpen())\n\t overlay(Overlay.source(\n\tSource.image(\"cloudinary_icon\") {\n\t transformation(Transformation {\n\t resize(Resize.scale() { width(0.4F)\n\t relative()\n\t })\n\t adjust(Adjust.opacity(25))\n\t adjust(Adjust.brightness() { level(-90) }) })\n\t })) \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(\"fat_cat.jpg\", {transformation: [ {width: 200, crop: \"scale\"}, {border: \"5px_solid_rgb:19340b\", radius: \"max\"}, {effect: \"saturation:100\"}, {effect: \"sharpen\"}, {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"} ]})","codeSnippet":"$.cloudinary.image(\"fat_cat.jpg\", {transformation: [\n {width: 200, crop: \"scale\"},\n {border: \"5px_solid_rgb:19340b\", radius: \"max\"},\n {effect: \"saturation:100\"},\n {effect: \"sharpen\"},\n {effect: \"brightness:-90\", flags: \"relative\", overlay: new cloudinary.Layer().publicId(\"cloudinary_icon\"), opacity: 25, width: \"0.4\", crop: \"scale\"}\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(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","codeSnippet":"new CloudinaryImage(\"fat_cat.jpg\")\n .resize(scale().width(200))\n .border(solid(5, \"#19340b\").roundCorners(max()))\n .adjust(saturation().level(100))\n .adjust(sharpen())\n .overlay(\n source(\n image(\"cloudinary_icon\").transformation(\n new Transformation()\n .resize(scale().width(0.4).relative())\n .adjust(opacity(25))\n .adjust(brightness().level(-90))\n )\n )\n );","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\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\/fat_cat.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"crop_mode":"scale","width":"200"},{"border":"5px_solid_rgb:19340b","radius":"max"},{"effect":"saturation:100"},{"effect":"sharpen"},{"crop_mode":"scale","effect":"brightness:-90","flags":"relative","overlay":"cloudinary_icon","opacity":"25","width":"0.4"}],"transformation_string":"c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4","url_suffix":"","version":"","secure":true,"public_id":"fat_cat.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" >
加载代码示例
尾注-当使用上述URL生成云中即时图像时,源图像和生成图像都存储云中,用快速存取CDN传送用户并自动优化压缩文件大小使用云化实现智能图像变换时 最优存储并发送图像给世界用户
智能裁剪是网站或移动应用所必不可缺的,它涉及用户加载图像云化基于脸部检测裁剪,加之Imagga智能裁剪,允许你用单行代码自动执行裁剪-并同时保证图像以最优方式存储和交付
自己试一试签名免费云式账号并抓取Imagga裁剪和缩放.附加文件Imagaad来.
万一你有什么反馈或建议,我们会很高兴