Embed table or graph with ACP

Initially AWP was developed with a tabbed user interface where graphs and tables would appears by clicking on their respective tabs at the top of AWP. From doing some AWP web applications, we found it was very nice to have diagrams and tables to appear directly diagram.

We have implemented two ways for tables and graphs to be displayed on the diagram. One is by making input or output nodes large and AWP will then then display the table or graph in the input/output node. The other approach for embedding tables and graphs is to create a "frame node(s)" which will be displaying the tables and graphs.

Tall input or output nodes

To show a table or graph embedded in a diagram in AWP, you simply make its input node for an edit table -- or output node for result table or graph -- tall: In Analytica, drag a corner of the node so that its height is more than four times its initial default height. (The default height of an input or output node is 26 pixels -- if it uses the default 11-point font size. So, "tall" in this case, means more than 104 pixes -- more for a larger font.)

AWP uses the table or graph format last used in the last version of the model you saved in DTA. So, if you want AWP to show a graph (not result table), you should view it that way -- and set any graph style options you want -- before you save the model. Similarly, for an Edit table, choose the pivot (which index is rows and which columns) before you save the model. Similarly, AWP uses the uncertainty view -- mid, mean, statistics, pdf, cdf, or sample -- that you last viewed in DTA. (This information is stored in the Valuestate attribute for the original node.)

AWP automatically sizes a graph to fit the frame (node size) you have specified. This usually works well if you make the frame large enough. If an edit table or result table is larger than frame, it shows whatever fits, along with scroll bars to let the user see other parts of the table.

Example usage

Here's how the modeler creates the output node in DTA:

Setting up embedded graph in dta.png

Here's the result displayed on the diagram in AWP:

Embedded result graph in awp.png

Text Area Input Node

If you make an text input node in desktop Analytica tall, AWP will insert a text area control which is multi-line. This allows you handle multi-line input e.g. from copying and pasting which the single text input does not support.

Designate a frame node

During the work on one of AWP's first web application, we used a special text node designated to be the frame node who's boundary specifies the rectangle where to display the edit table, result table, or graph of any selected node. It also (optionally) displays the title and description of the selected variable at the top of the frame, and highlights the displayed node, so you know what you are looking at. This scheme turns out to be very convenient, since the author needs specify a single area, and the end user can quickly see the table or result of any node selected in a diagram or form containing inputs and outputs. It is especially handy in AWP where the user is viewing the model via a Web browser, and cannot easily position multiple windows to view diagrams and results at the same time, as they can in Desktop Analytica.

In AWP you can also display multiple tables and graphs on the diagram by specifying multiple frame nodes. Using this apporach you can setup AWP so you can see a table and corresponding graph at the same time. Or see multiple graphs for comparison.

Instructions for using frame nodes to embed graphs and tables in the diagram

If a model author wants to display edit tables, or results in multiple frames, AWP needs to know which frame to use for which node. This is done by specifying an AWP_attrib for each node and/or specifying an Awp_attrib for the module, containing FrameNode:Textnode1 to specify that it use Textnode1 as the frame.

Example 1: Use one frame node to display tables and graphs on the diagram 

  Module M
  Awp_Attrib: FrameNode:TextNode1

Example 2: Using two frame nodes, one for inputs and one for outputs

In this example let's say you have a diagram with two node's that are defined as edit tables with identifiers Inputdata1 and Inputdata2. And you have two nodes which display the graphical results of evaluating the model called Result1 and Result2.

You might one to have one frame node for handling the input data for the two edit tables and another input node for displaying the result graph one at a time.

So in this case you would have two frame nodes. You can specify which node is to use as follows: 

  Variable Inputdata1
  Awp_Attrib: FrameNode:TextNode1

  Variable Inputdata2
  Awp_Attrib: FrameNode:TextNode1

  Variable Result1
  Awp_Attrib: FramerNode:TextNode2


Example 3: Using two frame nodes, where one is a module level framenode

Imagine you had a diagram with two input tables and say 5 output nodes for viewing the model's results. In this case, you decide you want to use one framenode for displaying the edit tables and another frame node for displaying the results. In this case, it makes sense to set the Awp_attrib for the two input tables, and then setting a module level Awp_attrib which will be used by all the output nodes. 

  Variable Inputdata1
  Awp_Attrib: FrameNode:TextNode1

  Variable Inputdata2
  Awp_Attrib: FrameNode:TextNode1

  Module M
  Awp_Attrib: FramerNode:TextNode2

Since the output nodes do not have an Awp_attrib specifying a framenode, they will use the framenode specified in the module's Awp_attrib.

Example 4: Using two frame nodes, both specified at the module level


Another option is to cycle through any available frames -- the first node clicked would use the first frame. The second uses the second frame. If there are only two frames in the diagram, the third node will reuse the first frame. And so on. Normally, the author would lay out two or more frames of the same size.

The following settings will result in tables and graphs being displayed in Textnode1 and Textnode2: 

 Module M
 Awp_Attrib: FramerNode:TextNode1&TextNode2

What is displayed?

Title and description: The title of the node is displayed in bold at the top of the frame node, with description below it. If Description contains more text than will fit in the top 1/3 of the framenode, it shows only what will fit in the top 1/3, with a scroller to see more.

When Diagram window is opened, and no node has been selected, it shows the title and description of any Frame node, which is useful for initial explanation of the diagram/module and how to use it.

Font size: It uses the font style and size specified for the frame node with the title in bold -- initially the title and description specified for the frame, and then the title and description for the selected variable. It should allow web links (as in other descriptions) to appear in the description text.

FrameOptions:

  • Show_title [on by default], so to suppress the title use Show_title:no
  • Show_description:nn : Where nn is a number between 0 and 100, where it uses up to nn% of the vertical space available to show the description, showing vertical scroller if that isn't enough to show the entire description. if nn=0, it shows no description (and no scroller). Default if not mentioned, is Show_description:33
  • Graph: Shows graph
  • Table: Shows table
  • Graph_over_table: Graph above table.
  • Table_over_graph: Table above graph.

Example, to have the result graph show over the result table, and to allow the description to use up to 50% of the frame node area you would specify the following: 

 Text Textnode1
 Awp_attrib:  Show_description:50 Graph_over_table
Comments


You are not allowed to post comments.