Canvas

Vos données, parlées nativement.

Chargez le JSON natif du plan, activez un flag pour les exports Pretix, ou enregistrez votre propre parseur pour le système hérité que personne n'ose toucher. Un appel replaceData échange tout le plan.

Découvrir les atouts

Ça vous parle ?

Le format propriétaire de l'incumbent

Dix ans de plans piégés dans le schéma d'un éditeur. Une interface parseur rejoint vos données où elles vivent.

Des scripts de migration ponctuels

Du code glue qui convertit une fois et pourrit. Les parseurs sont nommés, enregistrés et réutilisables.

Des bricolages swap-the-chart

Détruire et reconstruire le plan pour changer les données perd l'état et scintille. replaceData échange le plan sur place.

Une porte ouverte pour les données de plan

01Un format natif documentéBlocs, objets, point focal et étages. Le JSON du plan est le même contrat que Studio exporte.
02Pretix intégréPointez le flag parseur vers un export Pretix et les catégories deviennent des blocs automatiquement.
03Apportez votre parseurÉtendez ParserBase, enregistrez-le par nom, et votre format est de premier ordre.
04Plans interchangeables à chaudreplaceData charge un nouveau plan sans remonter. État et écouteurs survivent.
05Typé de bout en boutLes modèles de données de plan sont livrés en types TypeScript. Les données mal formées échouent à la compilation.
06Parité vérifiée par StudioLes exports de l'éditeur sont testés en or contre le moteur de rendu. Ce que vous tracez est ce qui s'affiche.

De données étrangères au plan en direct

parser.ts
import { ParserBase } from "seatmap-canvas";
 
// 1. Teach the map your legacy format
class LegacyCrmParser extends ParserBase {
  parse(raw) {
    // map rows → BlockData[] with your zone + price keys
  }
}
addParser("legacy-crm", LegacyCrmParser);
 
// 2. Swap charts in place, no remount, no flicker
seatmap.data.replaceData(crmExport);    // via your parser
seatmap.data.replaceData(pretixExport); // via the built-in Pretix parser
seatmap.data.replaceData(chartJson);    // native { blocks, objects, focal_point }
TypeScript · seatmap-canvasreplaceData

Alimentez-le avec votre format

JSON natif, Pretix ou votre parseur, dans la démo.