DSL Demo — same chart in four representations

Each section below is a separate representation of the same visualization IR. All four parse to the same in-memory object, exercised by round-trip-representations.test.js. The HTML form here is the cut-1 author surface; JSON, YAML, and Turtle are data-exchange forms.

1. HTML form

The <slc-chart> tree is parsed by parseIntermediateRepresentation.

2. JSON form

Round-trips through renderJsonIntermediateRepresentation and parseJsonIntermediateRepresentation.


  


  

    
3. YAML form

    
Round-trips through renderYamlIntermediateRepresentation and parseYamlIntermediateRepresentation.

    

  


  

    
4. Turtle form

    
Round-trips through renderTurtleIntermediateRepresentation and parseTurtleIntermediateRepresentation.