BadgeRenderer
The BadgeRenderer
class is used and exposed by the Web SDK. Internally, it is used to visualize live data updates for different locations. Based on the type of live data updates we receive for a location, the badge may look different. The following example showcases the style of badge temperature
updates.
![](https://docsbeta.mapsindoors.com/~gitbook/image?url=https%3A%2F%2F2554025873-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FYZLXDaaclvaSK6Q7eigW%252Fuploads%252Fj676SGzHfJZOdW6ZyzFi%252FbadgeRenderer_temperature.png%3Falt%3Dmedia%26token%3D4279624d-322b-4d34-82ad-c35938e1c5d9&width=768&dpr=4&quality=100&sign=bdbd58ca&sv=1)
Customize the BadgeRenderer
Since the BadgeRenderer
is a public class, you have the option to customize and make use of it in your own application. (class definition)
Following the next example will allow you to update a location's icon with a custom badge.
Create a new instance of our
BadgeRenderer
class providing a config optionally including the following properties:
Name | Type | Description | Default Value |
---|---|---|---|
|
| The background color of the badge. |
|
|
| The font family is used for the text inside the badge. |
|
|
| The font size used for the text inside the badge. |
|
|
| The font-weight used for the text inside the badge. |
|
|
| The position of the badge in relation to the icon. Options are: |
|
|
| The size of the badge.
|
|
|
| The color of the outline of the badge. |
|
|
| The width of the outline of the badge. |
|
|
| The text inside the badge. |
|
|
| The color of the text inside the badge. |
|
Get the location's icon as an
Image
instance. You can use theMapsIndoors
instance for this.
Invoke the
overlay
method on thebadgeRenderer
object. Theoverlay
method takes 2 parameters.image - the image you want to modify. Please make sure that it is an instance of
Image
and not just a simple string URL.custom settings - This parameter offers the flexibility to override and tailor the badge configuration according to your specific requirements, thereby allowing customization beyond the default settings established during the instantiation of a new instance of the
BadgeRenderer
. You have the option to customize any of the properties described above for theBadgeRenderer
class.
Set the a new Display Rule for your location.
![](https://docsbeta.mapsindoors.com/~gitbook/image?url=https%3A%2F%2F2554025873-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FYZLXDaaclvaSK6Q7eigW%252Fuploads%252FUCHModLmC6ym36jIUE9u%252FbadgeRenderer_custom.png%3Falt%3Dmedia%26token%3De4c92443-b050-4913-83d1-0e97a01a183e&width=768&dpr=4&quality=100&sign=b26c61b4&sv=1)
Last updated