npm package: @ibm-wch-sdk/rendition-utils
Description: Software development kit to simplify the development of Angular based single page applications against Watson Content Hub.
Latest version: 6.0.524

<a name="_6413c217ac070f0cc888ef237e5f77bca091ed14c4a6b017e8102394c2fc842d"></a>
# ibm-wch-sdk-rendition-utils

Exposes framework independent APIs to support the implementation of [ibm-wch-sdk-ng](https://www.npmjs.com/package/ibm-wch-sdk-ng) and similar SDK.

## Details

Refer to the [documentation](#_4f5f0d570547cc32a6c26a19831659ff187906f3e173dec4cc7caa8b01b03375).

## Changes

[CHANGELOG](#_20bdb6f8aeaf2e57d73cf0f8f7596ac3a05ab33429cf49a686e6738debcd4512)

## Class documentation

Refer to the [documentation](#_28a07594e891c43454fa39c2c573639385bbf768c0897d05c3db61d89570388b).

<a name="_4f5f0d570547cc32a6c26a19831659ff187906f3e173dec4cc7caa8b01b03375"></a>
# Utils

TBD

<a name="_20bdb6f8aeaf2e57d73cf0f8f7596ac3a05ab33429cf49a686e6738debcd4512"></a>
# Changelog

## Current

### Added

* Initial version
<a name="_28a07594e891c43454fa39c2c573639385bbf768c0897d05c3db61d89570388b"></a>

#  @ibm-wch-sdk/rendition-utils

## Index

### External modules

* ["index"](#_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8)
* ["utils/empty.image"](#_68a8d2031a182aefbd8383d7852a85fb12cc4a2b4fd2fd43bef6a115a7ce4a29)
* ["utils/rendition.utils"](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)

---


<a name="_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8"></a>
[@ibm-wch-sdk/rendition-utils](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["index"](#_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8)

# External module: "index"

## Index

---


<a name="_68a8d2031a182aefbd8383d7852a85fb12cc4a2b4fd2fd43bef6a115a7ce4a29"></a>
[@ibm-wch-sdk/rendition-utils](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["utils/empty.image"](#_68a8d2031a182aefbd8383d7852a85fb12cc4a2b4fd2fd43bef6a115a7ce4a29)

# External module: "utils/empty.image"

## Index

### Variables

* [TRANSPARENT_PIXEL](#_68a8d2031a182aefbd8383d7852a85fb12cc4a2b4fd2fd43bef6a115a7ce4a29)

---

## Variables

<a id="transparent_pixel"></a>

### `<Const>` TRANSPARENT_PIXEL

**● TRANSPARENT_PIXEL**: *"data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw&#x3D;&#x3D;"* = "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="

*Defined in utils/empty.image.ts:1*

___


<a name="_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59"></a>
[@ibm-wch-sdk/rendition-utils](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["utils/rendition.utils"](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)

# External module: "utils/rendition.utils"

## Index

### Interfaces

* [Dimension](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)
* [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
* [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)

### Variables

* [DEFAULT_RENDITION](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [LOGGER](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [RENDITION_REGEXP](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_mathFloor](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_mathRound](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [jsonStringify](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)

### Functions

* [_appendQueryString](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_approx](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_binaryIndexOf](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_clip](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_compareByAspect](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_compareByWidth](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_compareByWidthAndHeight](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_compareNumbers](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_createDimension](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_createRenditionBean](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_equalsWidth](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_findBestAspects](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_findBestWidth](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_findByWidth](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_getDecodedQueryString](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_getRendition](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_getScaledImageFromRendition](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_getScaledImageFromRenditionBean](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_getSourceSet](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_parseNumber](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)
* [_round](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)

---

## Variables

<a id="default_rendition"></a>

### `<Const>` DEFAULT_RENDITION

**● DEFAULT_RENDITION**: *"default"* = "default"

*Defined in utils/rendition.utils.ts:8*

___
<a id="logger"></a>

### `<Const>` LOGGER

**● LOGGER**: *"RenditionDirective"* = "RenditionDirective"

*Defined in utils/rendition.utils.ts:4*

___
<a id="rendition_regexp"></a>

### `<Const>` RENDITION_REGEXP

**● RENDITION_REGEXP**: *`RegExp`* =  /resize=(\d+)(?:px)?:(\d+)(?:px)?&crop=(\d+)(?:px)?:(\d+)(?:px)?;(\d+)(?:px)?,(\d+)(?:px)?/

*Defined in utils/rendition.utils.ts:287*

Regular expression to detect the renditions settings. Make sure to not use the 'g' flag!

___
<a id="_mathfloor"></a>

### `<Const>` _mathFloor

**● _mathFloor**: *`floor`* =  Math.floor

*Defined in utils/rendition.utils.ts:51*

___
<a id="_mathround"></a>

### `<Const>` _mathRound

**● _mathRound**: *`round`* =  Math.round

*Defined in utils/rendition.utils.ts:52*

___
<a id="jsonstringify"></a>

### `<Const>` jsonStringify

**● jsonStringify**: *`stringify`* =  JSON.stringify

*Defined in utils/rendition.utils.ts:6*

___

## Functions

<a id="_appendquerystring"></a>

###  _appendQueryString

▸ **_appendQueryString**(aBaseUrl: *`string`*, aQueryString: *`string`*): `string`

*Defined in utils/rendition.utils.ts:62*

Appends a query string to a base URL that may or may not have a query part. If it has a query, the previous query is removed

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aBaseUrl | `string` |  current base URL |
| aQueryString | `string` |  string to append |

**Returns:** `string`
the resulting URL

___
<a id="_approx"></a>

###  _approx

▸ **_approx**(aNumber: *`number`*): `number`

*Defined in utils/rendition.utils.ts:76*

Approximate a floating number to a fixed number of decimals

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aNumber | `number` |  number to approximate |

**Returns:** `number`
the approximated number

___
<a id="_binaryindexof"></a>

###  _binaryIndexOf

▸ **_binaryIndexOf**<`T`,`K`>(aSearchElement: *`K`*, aArray: *`T`[]*, aCmp: *`function`*): `number`

*Defined in utils/rendition.utils.ts:118*

Executes a binary search for an element

**Type parameters:**

#### T 
#### K 
**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aSearchElement | `K` |  element to look for |
| aArray | `T`[] |  array to search |
| aCmp | `function` |  comparision function |

**Returns:** `number`
the index

___
<a id="_clip"></a>

###  _clip

▸ **_clip**(aValue: *`number`*, aMin: *`number`*, aMax: *`number`*): `number`

*Defined in utils/rendition.utils.ts:334*

Clips a value against the given boundaries

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aValue | `number` |  the value to clip |
| aMin | `number` |  the min value |
| aMax | `number` |  the max value |

**Returns:** `number`
the clipped value

___
<a id="_comparebyaspect"></a>

###  _compareByAspect

▸ **_compareByAspect**(aLeft: *[RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*, aRight: *[RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*): `number`

*Defined in utils/rendition.utils.ts:161*

Compares renditions by aspect

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aLeft | [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  left value to compare |
| aRight | [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  right value to compare |

**Returns:** `number`
comparison result

___
<a id="_comparebywidth"></a>

###  _compareByWidth

▸ **_compareByWidth**(aLeft: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*, aRight: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*): `number`

*Defined in utils/rendition.utils.ts:172*

Compares renditions by width

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aLeft | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  left value to compare |
| aRight | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  right value to compare |

**Returns:** `number`
comparison result

___
<a id="_comparebywidthandheight"></a>

###  _compareByWidthAndHeight

▸ **_compareByWidthAndHeight**(aLeft: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*, aRight: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*): `number`

*Defined in utils/rendition.utils.ts:187*

Compares renditions by width

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aLeft | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  left value to compare |
| aRight | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  right value to compare |

**Returns:** `number`
comparison result

___
<a id="_comparenumbers"></a>

###  _compareNumbers

▸ **_compareNumbers**(aLeft: *`number`*, aRight: *`number`*): `number`

*Defined in utils/rendition.utils.ts:150*

Safe number comparison

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aLeft | `number` |  left value to compare |
| aRight | `number` |  right value to compare |

**Returns:** `number`
comparison result

___
<a id="_createdimension"></a>

###  _createDimension

▸ **_createDimension**(aWidth: *`number`*, aHeight: *`number`*): [Dimension](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)

*Defined in utils/rendition.utils.ts:26*

Constructs a dimensions object based on width and height

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aWidth | `number` |  the width |
| aHeight | `number` |  the height |

**Returns:** [Dimension](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)
the dimension object

___
<a id="_createrenditionbean"></a>

###  _createRenditionBean

▸ **_createRenditionBean**(aTargetAspect: *`number`*, aRendition: *`Rendition`*, aImage: *`Image`*): [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)

*Defined in utils/rendition.utils.ts:88*

Constructs the rendition bean based on the actual rendition

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aTargetAspect | `number` |  desired target aspect |
| aRendition | `Rendition` |  the rendition |
| aImage | `Image` |

**Returns:** [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
the bean

___
<a id="_equalswidth"></a>

###  _equalsWidth

▸ **_equalsWidth**(aLeft: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*, aRight: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*): `boolean`

*Defined in utils/rendition.utils.ts:202*

Tests if the width of two renditions is equal

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aLeft | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  left rendition |
| aRight | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  right rendition |

**Returns:** `boolean`
true if equal

___
<a id="_findbestaspects"></a>

###  _findBestAspects

▸ **_findBestAspects**(aRenditions: *[RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)[]*, aLogger: *`Logger`*): [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)[]

*Defined in utils/rendition.utils.ts:230*

Returns a list of renditions with the best matching aspect ratio

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aRenditions | [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)[] |  the renditions |
| aLogger | `Logger` |  the logger |

**Returns:** [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)[]
the renditions with the best matching aspect ratio

___
<a id="_findbestwidth"></a>

###  _findBestWidth

▸ **_findBestWidth**(aWidth: *`number`*, aRenditions: *[RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)[]*, aLogger: *`Logger`*): [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) \| `undefined`

*Defined in utils/rendition.utils.ts:257*

Find the rendition with the best width, i.e. the closest width that is larger than the given width

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aWidth | `number` |  desired width |
| aRenditions | [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)[] |  renditions |
| aLogger | `Logger` |  the logger |

**Returns:** [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) \| `undefined`
the selected rendition

___
<a id="_findbywidth"></a>

###  _findByWidth

▸ **_findByWidth**(aLeft: *`number`*, aRight: *`Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*): `number`

*Defined in utils/rendition.utils.ts:216*

Compares renditions by width

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aLeft | `number` |  left value to compare |
| aRight | `Rendition` \| [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  right value to compare |

**Returns:** `number`
comparison result

___
<a id="_getdecodedquerystring"></a>

###  _getDecodedQueryString

▸ **_getDecodedQueryString**(aUrl: *`string`*): `string` \| `undefined`

*Defined in utils/rendition.utils.ts:295*

Checks if the URL has a query string and decodes it if so.

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aUrl | `string` |  the URL |

**Returns:** `string` \| `undefined`
the decoded query string or undefined

___
<a id="_getrendition"></a>

###  _getRendition

▸ **_getRendition**(aDstWidth: *`number`*, aDstHeight: *`number`*, aImage: *`Image`*, aLogger: *`Logger`*): [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)

*Defined in utils/rendition.utils.ts:516*

Builds a query string for the Akamai rendition service such that the resulting image matches the desired dimensions. The algorithm first finds the renditions with the best matching aspect ratio. Out of the result set it then selects the nearest rendition that is large or equal in size, because that most likely represents the desired excerpt best. It then fixes the aspect ration and computes the new transform.

In case the image would be scaled up, we return the identity scaling and let the browser scale the image.

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aDstWidth | `number` |  desired image width |
| aDstHeight | `number` |  desired image height |
| aImage | `Image` |  the image |
| aLogger | `Logger` |  the logger |

**Returns:** [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)
the URL string

___
<a id="_getscaledimagefromrendition"></a>

###  _getScaledImageFromRendition

▸ **_getScaledImageFromRendition**(aRenditionName: *`string`*, aImage: *`Image`*, aLogger: *`Logger`*): [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)

*Defined in utils/rendition.utils.ts:480*

Returns the scaled image given the rendition name explicitly

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aRenditionName | `string` |  the name of the rendition |
| aImage | `Image` |  the image |
| aLogger | `Logger` |  the actual logger |

**Returns:** [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)
the scaled image

___
<a id="_getscaledimagefromrenditionbean"></a>

###  _getScaledImageFromRenditionBean

▸ **_getScaledImageFromRenditionBean**(aDstWidth: *`number`*, aDstHeight: *`number`*, aBean: *[RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)*, aLogger: *`Logger`*): [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)

*Defined in utils/rendition.utils.ts:353*

Builds a query string for the Akamai rendition service such that the resulting image matches the desired dimensions. The algorithm first finds the renditions with the best matching aspect ratio. Out of the result set it then selects the nearest rendition that is large or equal in size, because that most likely represents the desired excerpt best. It then fixes the aspect ration and computes the new transform.

In case the image would be scaled up, we return the identity scaling and let the browser scale the image.

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aDstWidth | `number` |  desired image width |
| aDstHeight | `number` |  desired image height |
| aBean | [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28) |  the rendition bean |
| aLogger | `Logger` |  the logger |

**Returns:** [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)
the URL string

___
<a id="_getsourceset"></a>

###  _getSourceSet

▸ **_getSourceSet**(aImage: *`Image`*, aOrigin: *`string`*): `string`

*Defined in utils/rendition.utils.ts:554*

Computes the source set from the available renditions

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aImage | `Image` |  the image |
| aOrigin | `string` |  the origin |

**Returns:** `string`
the source set

___
<a id="_parsenumber"></a>

###  _parseNumber

▸ **_parseNumber**(aValue: *`string`*): `number`

*Defined in utils/rendition.utils.ts:312*

Parses a string into a number

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aValue | `string` |  the value to parse |

**Returns:** `number`
the decoded string

___
<a id="_round"></a>

###  _round

▸ **_round**(aValue: *`number`*): `number`

*Defined in utils/rendition.utils.ts:322*

Rounding function

**Parameters:**

| Name | Type | Description |
| ------ | ------ | ------ |
| aValue | `number` |  the value to round |

**Returns:** `number`
the rounded value

___


<a name="_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0"></a>

#  @ibm-wch-sdk/rendition-utils

## Index

### External modules

* ["index"](#_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8)
* ["utils/empty.image"](#_68a8d2031a182aefbd8383d7852a85fb12cc4a2b4fd2fd43bef6a115a7ce4a29)
* ["utils/rendition.utils"](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59)

---


<a name="_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a"></a>
[@ibm-wch-sdk/rendition-utils](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["utils/rendition.utils"](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59) > [Dimension](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)

# Interface: Dimension

Exposes the concept of a dimension

## Hierarchy

**Dimension**

## Index

### Properties

* [h](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)
* [w](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)

---

## Properties

<a id="h"></a>

###  h

**● h**: *`number`*

*Defined in utils/rendition.utils.ts:15*

___
<a id="w"></a>

###  w

**● w**: *`number`*

*Defined in utils/rendition.utils.ts:14*

___


<a name="_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28"></a>
[@ibm-wch-sdk/rendition-utils](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["utils/rendition.utils"](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59) > [RenditionBean](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)

# Interface: RenditionBean

## Hierarchy

**RenditionBean**

## Index

### Properties

* [aspect](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
* [diff](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
* [height](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
* [image](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
* [rendition](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)
* [width](#_38103dd122cd7485e1581ce7f95ce2e94011e0903c88952be6db7bb53cbb5e28)

---

## Properties

<a id="aspect"></a>

###  aspect

**● aspect**: *`number`*

*Defined in utils/rendition.utils.ts:44*

___
<a id="diff"></a>

###  diff

**● diff**: *`number`*

*Defined in utils/rendition.utils.ts:47*

___
<a id="height"></a>

###  height

**● height**: *`number`*

*Defined in utils/rendition.utils.ts:46*

___
<a id="image"></a>

###  image

**● image**: *`Image`*

*Defined in utils/rendition.utils.ts:42*

___
<a id="rendition"></a>

###  rendition

**● rendition**: *`Rendition`*

*Defined in utils/rendition.utils.ts:43*

___
<a id="width"></a>

###  width

**● width**: *`number`*

*Defined in utils/rendition.utils.ts:45*

___


<a name="_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d"></a>
[@ibm-wch-sdk/rendition-utils](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["utils/rendition.utils"](#_88832324698fcaec35ab9f5e41d8938726f6bf7a1a05936a57d278e533ea6a59) > [ScaledImage](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)

# Interface: ScaledImage

## Hierarchy

**ScaledImage**

## Index

### Properties

* [container](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)
* [image](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)
* [img](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)
* [url](#_f8ac443bd66ce787ae8695c85541b16ae5f5f4d45bcbb941ecce9d4d5f72e74d)

---

## Properties

<a id="container"></a>

###  container

**● container**: *[Dimension](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)*

*Defined in utils/rendition.utils.ts:37*

___
<a id="image"></a>

###  image

**● image**: *`Image`*

*Defined in utils/rendition.utils.ts:35*

___
<a id="img"></a>

###  img

**● img**: *[Dimension](#_adf783623b628909d5d8b6e035204933be8a0ed87c71fd23850f61c71e0c0b4a)*

*Defined in utils/rendition.utils.ts:36*

___
<a id="url"></a>

###  url

**● url**: *`string`*

*Defined in utils/rendition.utils.ts:38*

___