Resizing Images
You can use the GUI or code mode on OBS Console or make an API call to resize images. Images can be resized based on a specific rule or a fixed width, height, or percentage.
- A long side refers to the side with a larger ratio of its original size to its target size, and a short side refers to the side with a smaller ratio. Assume that the original size of an image is 400 × 200 pixels and it is resized to 100 × 100 pixels. The ratio of 400 pixels to 100 pixels is 4 and that of 200 pixels to 100 pixels is 2, so the long side is 400 pixels and the short side is 200 pixels.
- For a target image after resizing, its long side cannot exceed 9,999 pixels, and the product of its width and height cannot exceed 24,999,999 pixels.
- If you only specify the height or width for resizing, the target image keeps the same aspect ratio and format as the original image.
- By default, resizing is not allowed to scale up an image. If you want an image to become larger after resizing, you need to set limit to 0 to obtain the enlarged image, or the original image will be returned. To do this, use the following format:
Table 1 describes the parameters.
This operation is represented by resize.
Parameter |
Value Description |
Code Example |
---|---|---|
m |
Type of resizing. The value can be lfit (the default value), mfit, fill, pad, or fixed.
|
image/resize,m_lfit,h_100,w_100 |
p |
Percentage of the aspect ratio, in the range of 1 to 1000. If the value is:
|
image/resize,p_50 |
h |
Height of the target image, in the range of 1 to 9999. The product of the target image's width and height cannot exceed 24,999,999. |
image/resize,m_lfit,h_100 |
w |
Width of the target image, in the range of 1 to 9999. The product of the target image's width and height cannot exceed 24,999,999. |
image/resize,m_fixed,h_100,w_100 |
l |
The long side of the target image, in the range of 1 to 4096. The product of the target image's width and height cannot exceed 24,999,999. The long side has a specified value, and the short side is scaled based on the ratio. |
image/resize,l_100 |
s |
The short side of the target image, in the range of 1 to 4096. The product of the target image's width and height cannot exceed 24,999,999. The short side has a specified value, and the long side is scaled based on the ratio. |
image/resize,s_100 |
color |
Color for filling the blank area after resizing. This parameter can be used when you set m to pad. The value is a hexadecimal code, from 000000 to FFFFFF (default value, representing white). |
image/resize,m_pad,h_100,w_100,color_FF0000 |
limit |
Whether to limit the size of the target image when the target image is larger than the original one. The value can be 0 or 1 (default value).
|
image/resize,p_150,limit_0 |
If a resized image is aliased, you can add /marker,u_plus to the end of the image processing URL for optimization.
For example, the image processing URL is as follows:
After the parameter is added, the link is as follows:
Examples
- Set h to 100 and m to lfit (the default value) to process the width proportionally.
- Lock the aspect ratio and specify the short side to resize the image into 100 × 100 pixels.
https://hw-image-demo.obs.ap-southeast-1.myhuaweicloud.com/example.jpg?x-image-process=image/resize,m_lfit,h_100,w_100
- Set the long side size to 100 and scale the short side based on the ratio.
- Fix the width and height, center and crop the image, resize the image into 100 × 100 pixels.
https://hw-image-demo.obs.ap-southeast-1.myhuaweicloud.com/example.jpg?x-image-process=image/resize,m_fill,h_100,w_100
- Fix both the width and height to 100.
- Fix the width and height. Resize the image into 100 × 100 pixels by specifying the short side and fill the blank area with white.
https://hw-image-demo.obs.ap-southeast-1.myhuaweicloud.com/example.jpg?x-image-process=image/resize,m_pad,h_100,w_100
- Fix the width and height. Resize the image into 100 × 100 pixels by specifying the short side and fill the blank area with red.
https://hw-image-demo.obs.ap-southeast-1.myhuaweicloud.com/example.jpg?x-image-process=image/resize,m_pad,h_100,w_100,color_FF0000
- Scale up the image to 150% of its original size and set limit to 0 to obtain the enlarged image.
- Set p to 30 to scale down the image to 30% of its original size.
- Set an image's aspect ratio to 3:2.
https://hw-image-demo.obs.ap-southeast-1.myhuaweicloud.com/example.jpg?x-image-process=image/resize,m_ratio,w_3,h_2
Resizing an Image by Editing Code on OBS Console
- On the console homepage, click Service List in the upper left corner and choose Storage > Object Storage Service.
- In the bucket list, click the bucket you want to go to the Objects page.
- Click Upload Object to open the Upload Object dialog box.
- Click add files marked by red box in Figure 1 to open the local file browser.
- Select the image that you want to upload and click Open.
- Click Upload to upload the image. The uploaded image is displayed in the object list.
- In the navigation pane, choose Data Processing > Image Processing.
- Click Create to go to the style editing page.
- Set Style Name to style002 and choose Code for Edit Mode.
- In the code input box, type the following command for resizing.
Specify a rectangle whose width (indicated by w) and height (indicated by h) are both 100. Lock the aspect ratio, and obtain the smallest image in the extended area of the 100 × 100 rectangle.
image/resize,m_mfit,h_100,w_100
The style effect will be displayed on the right in real time. Figure 2 shows the final style effect.
- Click OK to save the style. The new style style002 will be displayed in the style list.
- In the navigation pane, choose Objects. Click mountain.jpg in the object list to go to the file details page.
- Click the Preview Image tab to preview the effect of the image with style style002 applied.
Figure 3 Preview Image
- In the image style card, click Copy Link. When Copied successfully. is prompted, you will have the address for accessing the image with the style applied.
Feedback
Was this page helpful?
Provide feedbackThank you very much for your feedback. We will continue working to improve the documentation.See the reply and handling status in My Cloud VOC.
For any further questions, feel free to contact us through the chatbot.
Chatbot