Home|About|Gaming cabinet|Archives|How it works|Starter sites

GeezerVison is showing github.com — JavaScript.Diagram/src/Tutorial2.html at master · MindFusionComponents/JavaScript.Diagram

Expand file tree

/

Tutorial2.html

Copy path

More file actions

More file actions

Latest commit

History

History

54 lines (52 loc) · 1.96 KB

/

Tutorial2.html

Copy path

File metadata and controls

54 lines (52 loc) · 1.96 KB

Copy raw file

Download raw file

Open symbols panel

Edit and raw actions

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>MindFusion JsDiagram Sample - Tutorial 2</title>

<meta charset="utf-8" />

<link href="common/samples.css" rel="stylesheet" />

<script type="text/javascript" src="common/samples.js"></script>

</head>

<body>

<div id="header" style="height: 49px;">

<div style="float: left; margin-left: 5px;">

<a href="./index.html" style="margin-left: 10px;">Index</a>

</div>

<div style="float: right; margin-right: 5px;">

<a href="Tutorial2.js" style="margin-right: 10px;">View source</a>

<button id="expandButton" onclick="onExpandCollapse()">

&rsaquo;

</button>

</div>

</div>

<div id="info" style="top: 60px; bottom: 24px;">

<div id="infoTab" style="padding: 10px;">

<h1>

About this sample

</h1>

<p id="pinfo">

Demonstrates how to dynamically build a diagram from Json data. JSDiagram provides

a method to arrange diagram elements in tree-like hierarchies. You must run

this sample through a Web server, or otherwise the Ajax request will fail.

</p>

</div>

</div>

<div id="content" style="top: 60px; bottom: 24px;">

<div style="width: 100%; height: 100%; overflow: auto;">

<canvas id="diagram" width="2100" height="2100">

This page requires a browser that supports HTML 5 Canvas element.

</canvas>

</div>

</div>

<div id="footer" style="height: 24px;">

<span id="copyright"></span>

</div>

<script src="Scripts/collections.js" type="text/javascript"></script>

<script src="Scripts/drawing.js" type="text/javascript"></script>

<script src="Scripts/controls.js" type="text/javascript"></script>

<script src="Scripts/animations.js" type="text/javascript"></script>

<script src="Scripts/graphs.js" type="text/javascript"></script>

<script src="Scripts/diagramming.js" type="text/javascript"></script>

<script src="Tutorial2.js" type="text/javascript"></script>

</body>

</html>