<%@ Page Title="" Language="VB" AutoEventWireup="false" CodeFile="DefaultVB.aspx.vb" Inherits="Telerik.Web.Examples.Diagram.Overview.DefaultVB" %>
<!DOCTYPE html>
<
head
runat
=
"server"
>
<
title
>Telerik ASP.NET Example</
title
>
<
link
href
=
"styles.css"
rel
=
"stylesheet"
/>
<
script
src
=
"scripts.js"
type
=
"text/javascript"
></
script
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
runat
=
"server"
ID
=
"RadScriptManager1"
/>
<
telerik:RadSkinManager
ID
=
"RadSkinManager1"
runat
=
"server"
ShowChooser
=
"true"
/>
<
div
class
=
"demo-container no-bg"
>
<
telerik:RadDiagram
ID
=
"theDiagram"
runat
=
"server"
Width
=
"1200"
Height
=
"700"
Skin
=
"Metro"
>
<
ClientEvents
OnLoad
=
"diagram_load"
/>
<
ShapeDefaultsSettings
Visual
=
"visualizeShape"
>
<
StrokeSettings
Color
=
"#fff"
/>
</
ShapeDefaultsSettings
>
<
ShapesCollection
>
<
telerik:DiagramShape
Id
=
"start"
Type
=
"start"
X
=
"30"
Y
=
"70"
>
<
FillSettings
Color
=
"#cf3737"
/>
<
ContentSettings
Text
=
"I have\na problem"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q1"
Type
=
"question"
X
=
"170"
Y
=
"50"
Width
=
"140"
Height
=
"140"
>
<
FillSettings
Color
=
"#ffbe33"
/>
<
ContentSettings
Text
=
"Can I solve it\nalone"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q1Yes"
Type
=
"text"
X
=
"260"
Y
=
"40"
>
<
ContentSettings
Text
=
"Yes"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q1No"
Type
=
"text"
X
=
"330"
Y
=
"100"
>
<
ContentSettings
Text
=
"No"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q2"
Type
=
"question"
Width
=
"140"
Height
=
"140"
X
=
"350"
Y
=
"50"
>
<
FillSettings
Color
=
"#ffbe33"
/>
<
ContentSettings
Text
=
"I found\na solution in\nthe forums"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q2Yes"
Type
=
"text"
X
=
"440"
Y
=
"40"
>
<
ContentSettings
Text
=
"Yes"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q2No"
Type
=
"text"
X
=
"510"
Y
=
"100"
>
<
ContentSettings
Text
=
"No"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q3"
Type
=
"question"
Width
=
"140"
Height
=
"140"
X
=
"530"
Y
=
"50"
>
<
FillSettings
Color
=
"#ffbe33"
/>
<
ContentSettings
Text
=
"The latest\nproduct version\nsolves the\nproblem"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q3Yes"
Type
=
"text"
X
=
"620"
Y
=
"40"
>
<
ContentSettings
Text
=
"Yes"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q3No"
Type
=
"text"
X
=
"690"
Y
=
"100"
>
<
ContentSettings
Text
=
"No"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q4"
Type
=
"question"
Width
=
"140"
Height
=
"140"
X
=
"710"
Y
=
"50"
>
<
FillSettings
Color
=
"#ffbe33"
/>
<
ContentSettings
Text
=
"The problem\nis reproducible\nin the QSF"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q4Yes"
Type
=
"text"
X
=
"800"
Y
=
"208"
>
<
ContentSettings
Text
=
"Yes"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q4No"
Type
=
"text"
X
=
"870"
Y
=
"100"
>
<
ContentSettings
Text
=
"No"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"action1"
Type
=
"rectangle"
X
=
"730"
Y
=
"230"
>
<
ContentSettings
Text
=
"Open a\nsupport ticket\nand send the\ndemo link"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"action2"
Type
=
"rectangle"
X
=
"890"
Y
=
"70"
>
<
ContentSettings
Text
=
"Prepare\na sample\nproject"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"action3"
Type
=
"rectangle"
X
=
"890"
Y
=
"230"
>
<
ContentSettings
Text
=
"Open a\nsupport ticket\nand send your\nproject"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"action4"
Type
=
"rectangle"
X
=
"810"
Y
=
"390"
>
<
ContentSettings
Text
=
"Describe\ndetails"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"action5"
Type
=
"rectangle"
X
=
"810"
Y
=
"530"
>
<
ContentSettings
Text
=
"Submit the\nticket"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q5"
Type
=
"question"
Width
=
"140"
Height
=
"140"
X
=
"1030"
Y
=
"440"
>
<
FillSettings
Color
=
"#ffbe33"
/>
<
ContentSettings
Text
=
"The support\nofficer's response\nwas helpful"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q5Yes"
Type
=
"text"
X
=
"1120"
Y
=
"300"
>
<
ContentSettings
Text
=
"Yes"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"q5No"
Type
=
"text"
X
=
"1000"
Y
=
"450"
>
<
ContentSettings
Text
=
"No"
/>
<
StrokeSettings
Color
=
"#000"
/>
</
telerik:DiagramShape
>
<
telerik:DiagramShape
Id
=
"end"
Type
=
"end"
X
=
"1050"
Y
=
"70"
>
<
FillSettings
Color
=
"#49a046"
/>
<
ContentSettings
Text
=
"Problem\nsolved"
/>
</
telerik:DiagramShape
>
</
ShapesCollection
>
<
ConnectionsCollection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"start"
/>
<
ToSettings
ShapeId
=
"q1"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q1"
Connector
=
"Right"
/>
<
ToSettings
ShapeId
=
"q2"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q1"
Connector
=
"Top"
/>
<
ToSettings
ShapeId
=
"end"
Connector
=
"Top"
/>
<
PointsCollection
>
<
telerik:DiagramConnectionPoint
X
=
"240"
Y
=
"20"
/>
<
telerik:DiagramConnectionPoint
X
=
"1100"
Y
=
"20"
/>
</
PointsCollection
>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q2"
Connector
=
"Right"
/>
<
ToSettings
ShapeId
=
"q3"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q2"
Connector
=
"Top"
/>
<
ToSettings
ShapeId
=
"end"
Connector
=
"Top"
/>
<
PointsCollection
>
<
telerik:DiagramConnectionPoint
X
=
"420"
Y
=
"20"
/>
<
telerik:DiagramConnectionPoint
X
=
"1100"
Y
=
"20"
/>
</
PointsCollection
>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q3"
Connector
=
"Right"
/>
<
ToSettings
ShapeId
=
"q4"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q3"
Connector
=
"Top"
/>
<
ToSettings
ShapeId
=
"end"
Connector
=
"Top"
/>
<
PointsCollection
>
<
telerik:DiagramConnectionPoint
X
=
"600"
Y
=
"20"
/>
<
telerik:DiagramConnectionPoint
X
=
"1100"
Y
=
"20"
/>
</
PointsCollection
>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q4"
/>
<
ToSettings
ShapeId
=
"action1"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q4"
Connector
=
"Right"
/>
<
ToSettings
ShapeId
=
"action2"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"action2"
/>
<
ToSettings
ShapeId
=
"action3"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"action1"
/>
<
ToSettings
ShapeId
=
"action4"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"action3"
/>
<
ToSettings
ShapeId
=
"action4"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"action4"
/>
<
ToSettings
ShapeId
=
"action5"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"action5"
/>
<
ToSettings
ShapeId
=
"q5"
Connector
=
"Bottom"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q5"
Connector
=
"Top"
/>
<
ToSettings
ShapeId
=
"action4"
/>
</
telerik:DiagramConnection
>
<
telerik:DiagramConnection
>
<
FromSettings
ShapeId
=
"q5"
/>
<
ToSettings
ShapeId
=
"end"
/>
</
telerik:DiagramConnection
>
</
ConnectionsCollection
>
</
telerik:RadDiagram
>
<
div
id
=
"diagram-title-container"
>
<
div
id
=
"diagram-title"
>How to solve a problem</
div
>
<
div
id
=
"diagram-subtitle"
>Block diagram</
div
>
</
div
>
</
div
>
</
form
>
</
body
>
</
html
>