Function: race()
race(
data,container?,options?):Promise<Race>
The main function that generates the racing bar chart.
Parameters
• data: string | Data[] | Promise<Data[]> | WideData[] | Promise<WideData[]>
The data for the race visualization can be one of:
1- Array of `Data` objects.
2- Array of `WideData` objects.
3- Promise that resolves to an array of `Data` objects.
4- Promise that resolves to an array of `WideData` objects.
5- String representing the file path to load the data from.
• container?: string | HTMLElement
Optional. The container element or selector.
If not provided, a new <div> element will be created and appended to the document body.
• options?: Partial<Options> = {}
Optional. Configuration object for chart options. Defaults to an empty object.
Returns
Promise<Race>
The function returns a promise that resolves to an object that allows interaction with the chart.
See
- https://racing-bars.hatemhosny.dev/documentation/data/ for more information.
- https://racing-bars.hatemhosny.dev/api/internal/interfaces/Options/ for detailed options.
- https://racing-bars.hatemhosny.dev/documentation/api#race for more details.
Example
const data: Data[] | WideData[] | Promise<Data[]> | Promise<WideData[]> | string = [ ...fill with data... ];
const container = document.getElementById('race-container');
const options: Partial<Options> = {
width: 800,
height: 400,
};
const raceAPI = await race(data, container, options);
raceAPI.play();