Virtual World Match Football

UI - Visualization component

The Virtual World Match Football visualization component is delivered as an iframe with a responsive interface between 320px and 1280px.

Below URL provides an example as shown on Sportradar’s Virtual Sports Demonstratorarrow-up-right:

https://{domain}/virtualsport/stable/dist/entryPoints/vwmfUOF.html?product={product}&sport=vwmf&client_id={client_id}&environment={environment}

Below you will find a list of valid URL parameters:

Parameter
Required
Description

client_id

required

Identifies you as a bookmaker in our system. The id will be provided to you by your technical account manager.

product

required

Specifies the product which needs to be set to vwmf1, vwmf2 or vwmf3 for Virtual World Match Football.

environment

required

Specifies either staging or production environments.

lang

optional

Specifies the display language in the visualization component(ISO 639-1 specification).

Most European language are already available and other can be added on demand

style

optional

If needed, your technical account manager will provide you with a style parameter. If not provided, the default style will be applied and there is no further action needed from your side.

oddType

optional

Specifies the odds display format. The parameter does not have impact on how odds are calculated and only triggers a simple conversion from decimal odds to the specified odds format. If this is not specified, the default odds format will be decimal.

Virtual World Match Football market visualization

There are plenty of different Virtual World Match Football betting markets. This offers customers a huge variety of betting opportunities but also requires some categorization to guide users and improve the overall experience.

Cross-origin communication between UI and parent iframe

Cross-origin communication between the product’s iframe and the parent iframe is done via the JavaScript method window.postMessage().

The Virtual World Match Football iframe fires events via postMessage as described in the following sub-sections.

set-events

This set-events event is triggered when the product is loaded and when when the event changes. The corresponding return value is described in the following example:

rgs-height-change

The rgs-height-change event is triggered whenever the size of the iframe changes. The corresponding return value is described in the following example:

Example implementation

This example implementation can be used to listen to the events of the iframe and execute functions based on the received event type and event data.

Last updated

Was this helpful?