Is there any way to get a file of the flowchart itself?

Yotsubama

Hey, guys.

I was just wondering if there was a way to export the flowchart itself as well. I would like to have a visual representation of it all.

greyelf

I don't know of a built-in option that exports a story's Passage Map (aka flow-chart) but with a little effort you can create your own.

notes:
a. Although the following instructions were written for Chrome on Windows 10, the process can be used for other web-browsers on other operating systems but you will need to research the equivalent options/menu items.

b. These instructions may not work on a story with a larger number of passages because there is a limit on the amount of HTML a web-browser's HTML edit text area can contain before it is truncated.


1. Create/obtain a html temple contain the relevant CSS used by Twine 2 to format the Passage Map. I have attached a copy of one to this comment.

2. Locate the relevant HTML used to represent your Passage Map.
While viewing your story's Passage Map place your mouse cursor over the title section of the main Passage of your story (the one shown when your story starts), right mouse button click on the title to show a content menu and select the Inspect menu item which will result in the Elements section of the Developer Tools opening with the HTML representing the passage title being highlighted.

If you work your way up the hierarchy of HTML elements you will come to an element that starts with <div class="passages" and this is the element that contains the information you are going to need.

3. Place your mouse cursor over the <div class="passages" element, right mouse button click on it and select the Edit as HTML menu item which will result in a text box appearing containing the HTML representing the current element and it's children.

Use CTRL-A to select the contents of the text box, and CTRL-C to copy that contents into the clipboard.

4. Open a copy of your html template file in a Text Editor.
Once the file is open locate the body section and place your editor cursor within in. In the temple file I attached the relevant area is marked with a <!-- The .passages element and it's contents goes here --> HTML comment.

Use CTRL-V to paste the HTML from point 3 into the temple file, then save the file and view it using a web-browser. If done correctly you should see a copy of your Passage Map.