# Integrated Visualization Editing via Parameterized Declarative Templates ## Supplementary Materials This repository contains all of the supplementary materials for our paper, Integrated Visualization Editing via Parameterized Declarative Templates. These consist of interactivity demonstrations, components used in our study, and code components. **Interactivity Demonstration** 1. The video figure for our paper, which demonstrates (on a high-level) the usage of our system 2. A brief tutorial on how to use our system, used as tutorial on the page itself (ivy tutorial final.mp4) **Study Components** 1. The survey instrument used to conduct our usability study (Study Insturment.pdf) 2. The templates from the templatization of the Vega-Lite gallery (ivy-templatization-files.json) 3. The happieness data set used in the study, as well as the files for creating a new version (happiness.zip) 4. The excel workbook for analyzing the compression ratios (Ivy-Vl-Analysis.xlsx), and the code for preparing that workbook (ivy-vl-analysis.zip) **Code Components** 1. A live connection to the most up to date version of the code-base (hosted on github) 2. Code artifact (frozen at a time prior to submission), see instructions below for usage ## Code Artifact The code for our application Ivy (client and server) as well as a collection of example templates. Before interacting with application it is recommended that you watch the video supplementary material for a tour of the application functionality, although a tour is present in the application. The client folder contains the code to run the application, while the server folder contains code to run the community template server. Our application can be run entirely locally (server and client both run locally). It is not strictly necessary to use the server, as it just allows you to publish created templates into a local database and view the template instances. If you do not wish to set up the server you can use our cloud-hosted server (instructions below). If you are having trouble setting up the application, we have also deployed a copy of it at https://ivy-vis.netlify.app/ This url is untracked and is completely anonymous. Although it should be noted that this is a living link, and the application may be updated with new functionality or bug fixes, beyond that which is captured in this repository. ### Set up - Client You must first have node installed, with a version >= 9 (12 preferred). Please consult a trusted source for the appropriate instructions for installing node on your operation system. Next, Navigate to the client folder and install the dependencies and start the application, like so: ```sh # if using yarn yarn yarn start # or if using npm npm install npm run start ``` The application will now be available at http://localhost:8080/. The initial distribution comes with a small set of templates (9). In this repo we include a collection of example-templates that we created in the process of building our application. If you wish to use the local server go to the next section. If you wish to use the cloud hosted server, navigate to client/src/constants/config.json file, and set the USE_LOCAL constant to false. ### Set up - Server Just as before, please have node version >=9 installed (12 preferred). Next install psql, installation instructions will vary based on operating system please consult https://www.postgresql.org/download/. Next to get the server running, in a new terminal tab run the following commands to turn on psql: ```sh psql ``` In a final tab run the following commands to install the server deps and run the server: ```sh # if using yarn yarn yarn migrate yarn start # or if using npm npm install npm run migrate npm run start ``` You should now be able to publish templates and instances as you like.