Introduction | Your first interface | Building a model | Advanced features | Resources | |

## 4.1 Building a graph | |

This part shows you how to build a graph using eSim Builder. The model and interfaces used in this section can be downloaded here: trainingGraph.zip. There are three different types of graph that will be covered (interface in brackets): - xy graph (
`trainingGraphxy.jsm` ) - input graph (
`trainingGraphInput.jsm` ) - bar graph (
`trainingGraphBar.jsm` )
## xy graphAn xy graph displays a 2- or 3-dimensional array of numeric data. This example shows a 2-dimensional array, where the second dimension always has a value of 2, storing the x- and y- coordinates of the points on the graph. So the first point will be plotted at (-10,-99), the second at (-9,-89) and so on until the final point at (10,101). The applet below uses an xy graph to display two lines. As an example, the equations of these lines are both calculated based a specific number. Move the slider to see how a change in the number leads to a change in the graph. You can resize a graph by setting the More than one array of data can be added to the graph using the Series Editor ( Both the ## Input graphAn input graph will accept a 2-dimensional array of (real numeric) data from users by allowing them to click on points on a graph. The graph below shows an example of this - notice that points can be dragged as well as placed. The table on the right shows how the array of numbers defining the graph is being updated dynamically. If you right-click on the graph you can clear the values. The The ## Bar graphThe bar graph is used to display a 2-dimensional series of numeric data. The number of elements in the first dimension tells you how many data points will be on the graph, the number in the second dimension tells you how many bars for each point. In our example there are four data points and two sets of data (January and February) for each point. In the example below, the bar values are also displayed in a table. You can try changing these values (remember to press 'Enter') to see how this affects the graph. Changing the Setting the | |