Betting Entertainment Tools

Widgets Demo

Vertical Timeline

A match.verticalTimeline brings light version of live timeline/key in-game events.

For the widget to render you need to provide matchId, other properties are optional.

Parameters
Name Type Attributes Default Description
props object <required>
matchId number <required>

Match ID.
disableWidgetHeader boolean false

When set to true, hides widget header.
disableMatchHeader boolean false

When set to true, hides match header.
sortByPeriods boolean false

When set to true, shows period navigation and events gets sorted by periods
filter string goals, cards, corners, substitutions, penalties, other

A comma-separated list of filtered timeline events. Valid values for soccer are goals, cards, corners, substitutions, penalties, other. Valid values for for basketball are score, other.
onTrack function

Function/event handler, see Tracking options
eventsLayoutOption string mixed

Accepts mixed, central or toSides. Determines the layout of events on vertical timeline. mixed is responsive layout (central alignment of events >= 400 and side to side alignment of events < 400), central is central alignment of events and toSide is alignment of elements to the sides.
Examples

HTML/Declarative

<div id="sr-widget" data-sr-widget="match.verticalTimeline" data-sr-match-id="20521319" data-sr-filter="goals, cards, penalties" data-sr-disable-widget-header="false"></div>
<script type="application/javascript" src="https://widgets.sir.sportradar.com/sportradar/widgetloader" async></script>

JS/Programmatic

<script>
    (function(a,b,c,d,e,f,g,h,i){a[e]||(i=a[e]=function(){(a[e].q=a[e].q||[]).push(arguments)},i.l=1*new Date,i.o=f,
    g=b.createElement(c),h=b.getElementsByTagName(c)[0],g.async=1,g.src=d,g.setAttribute("n",e),h.parentNode.insertBefore(g,h)
    )})(window,document,"script","https://widgets.sir.sportradar.com/sportradar/widgetloader","SIR", {
        language: 'en'
    });
    SIR('addWidget', '#sr-widget', 'match.verticalTimeline', {matchId: 20521319, filter:'goals, cards, penalties', disableWidgetHeader: false});
</script>
<div id="sr-widget"></div>