Renderer methods
new seatsio.SeatingChart({...}).render(); returns a seating chart object with some methods you can access for use in your application.
var chart = new seatsio.SeatingChart({...}).render();
console.log(chart);
You can invoke these methods in two ways:
- Directly on the seatsio.SeatingChart object you created. This is recommended if you want to invoke one of these methods to react to a user action.
var chart = new seatsio.SeatingChart({...}).render();
$('#myButton').on('click', () => {
chart.clearSelection();
});
- Or on the object that's passed to the
onChartRenderedcallback, which you can provide in your chart config. This is the way to go when you want to invoke one of these methods right after the floor plan was fully loaded, and without any user action.
new seatsio.SeatingChart({
...,
onChartRendered: chart => {
chart.clearSelection();
},
...
}).render();
Tip
These methods will only work after a chart is fully rendered. That means this won't work:
var chart = new seatsio.SeatingChart({...}).render();
chart.clearSelection(); // WON'T WORK
That's because the render() method may still be doing a number of async operations in the background.
All methods
Rendering & lifecycle
| Method | Description |
|---|---|
chart.render() | Renders the chart and returns the chart object. |
chart.rerender() | Re-renders the chart to apply configuration changes (clears the current selection). |
chart.changeConfig() | Updates the chart configuration on the fly (colors, pricing, channels, …). |
chart.destroy() | Removes the chart from the page and cleans up. |
Selection
| Method | Description |
|---|---|
chart.trySelectObjects() | Selects objects, prompting for missing info (e.g. ticket type) when needed. |
chart.doSelectObjects() | Selects objects without prompting; fails if required info is missing. |
chart.deselectObjects() | Deselects the given objects. |
chart.clearSelection() | Deselects all currently selected objects. |
chart.listSelectedObjects() | Returns the currently selected objects. |
chart.holdBestAvailable() | Holds the best available objects matching the given criteria. |
Categories
| Method | Description |
|---|---|
chart.selectCategories() | Selects all selectable objects in the given categories. |
chart.deselectCategories() | Deselects all objects in the given categories. |
chart.listCategories() | Returns the chart's categories. |
Sessions
| Method | Description |
|---|---|
chart.startNewSession() | Starts a fresh session with a new hold token, clearing the current selection. |
View & navigation
| Method | Description |
|---|---|
chart.resetView() | Resets zoom and pan to the initial view. |
chart.zoomToObjects() | Zooms to the given objects. |
chart.zoomToSelectedObjects() | Zooms to the currently selected objects. |
chart.zoomToFilteredCategories() | Zooms to the currently filtered categories. |
chart.zoomToSection() | Zooms to the given section. |
chart.goToFloor() | Switches to a specific floor (multi-floor charts). |
chart.goToAllFloorsView() | Switches to the all-floors overview (multi-floor charts). |
Highlighting
| Method | Description |
|---|---|
chart.pulse() | Starts a pulsing animation on the given objects. |
chart.unpulse() | Stops the pulsing animation. |
Spotlight
| Method | Description |
|---|---|
chart.setSpotlightObjects() | Spotlights the given objects, dimming everything else (replaces any current spotlight). |
chart.setSpotlightOnSelection() | Spotlights the currently selected objects. |
chart.clearSpotlightObjects() | Clears the spotlight and exits the spotlight view. |
Lookup
| Method | Description |
|---|---|
chart.findObject() | Finds an object by label; rejects if it doesn't exist. |
chart.listZones() | Returns the chart's zones. |
Reporting
| Method | Description |
|---|---|
chart.getReportBySelectability() | Returns a report of the chart's objects grouped by selectability. |
chart.getReportBySelectabilityGroupedBy() | As above, additionally grouped by another property. |
Properties
The rendered chart also exposes two read-only properties:
chart.holdToken
(documented under Selection) and
chart.selectedObjects
(documented under Selection).