A Reactive Document Using Tangle

The example below builds on the CookieExample.js file that comes with Tangle, a javascript library for creating explorable explanations. The library's author, Bret Victor, describes the philosophy behind this library in his essay Explorable Explanations. The original example includes the first sentence — I added the second sentence with Health Canada's daily recommended calorie intake. You can click on the blue data items with the dashed underline to manipulate the data. As you do so, the values change.

The Health Canada numbers are problematic since they rely on the average body mass index. My goal here was to play with the library starting from a simple example, not to provide a resource for calculating how many cookies you're allowed per day.

Example Reactive Document

When you eat cookies, you will consume calories. According to Health Canada, if you're a male female aged 2-3 4-5 6-7 8-9 10-11 12-13 14-16 17-18 19-30 31-50 51-70 71 and up with a sedentary a low active an active activity level, that's % of your daily suggested energy intake of calories.