If you're building a full self-service platform, you'll want your users to be able to draw their own floor plans without intervention from your own team.
Seats supports this by a combination of two features: an embeddable Designer, and workspaces.
Embeddable Designer: you can embed the designer tool in your web page in much the same fashion as you can embed an interactive floor plan.
Workspaces: you can create a workspace for each of your users, so that they have their own secret key, and a separate set of floor plans, so that they can't see or edit each other's floor plans. Check the Workspaces API documentation for more information on how to create, update and retrieve workspaces.
Embedding the designer
secretKey: 'workspace secret key',
chartKey: 'your chart key'
chart.js URL depends on the region of your account:
The easiest way to show this component is to use the official wrapper package:
- React: https://github.com/seatsio/seatsio-react
- Vue: https://github.com/seatsio/seatsio-vue
- Angular: https://github.com/seatsio/seatsio-angular
- Android: https://github.com/seatsio/seatsio-android
Type definitions for seats.io are available at https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/seatsio
You need to provide the secret key (of your workspace). Be sure to keep this key a secret: anyone who has access to this key can edit seating charts and can book seats. So please don't push it to code repositories and only use it in pages served over https.
You can find the secret key on the workspace settings page.
This is an optional parameter. If you provide it, the designer will load the specified chart in edit mode. If you don’t, a new chart will be created automatically.
You can further configure the embedded Designer with extra configuration parameters and callbacks.