Structured Graphics ActiveX Control - Lecture - Dynamic HTML- Prof. Aishwarya Bhat, Lecture notes of Programming Languages

Download Structured Graphics ActiveX Control - Lecture - Dynamic HTML- Prof. Aishwarya Bhat and more Lecture notes Programming Languages in PDF only on Docsity!

Dynamic HTML

Structured Graphics ActiveX Control

17.1 Introduction

• (^) The Structured Graphics Control, like the Tabular Data Control, is an ActiveX control that can be added to web page with an object tag.
• (^) Like the TDC, the Structured Graphics Control is easily accessible through scripting.
• (^) Unlike the TDC, the Structured Graphics Control is meant primarily for visual presentations, not for displaying data and content.

17.2 Shape Primitives

• (^) The Structured Graphics Control allows you to create simple shapes by using methods that can be called via scripting or through param tags inside object tag.

For the SGC, the basic syntax of the tag is

• (^) The order of calls would be Line0001, Line0002, Line0003, and so on.
• (^) The 'xxxx' must be similar to 0001, and must proceed in an integer sequential manner, e.g. 0002, 0003, etc.
• (^) VALUE can be any available method and its parameters.

<param name = "Line0001"

value="SetLineColor(0,0,0)" />

RED BLUE GREEN Method SetLineColor (R, G, B) :

• (^) sets the color of lines and borders of shapes.
• (^) takes an RGB triplet in decimal notation as its three parameters

<param name = "Line0002"

value="SetLineStyle(1,1)" />

LINE SYTLE LINE WIDTH value 0 does not draw any lines or borders value 1 creates a solid line (the default) value 2 creates a dashed line specified in pixels NOTE: To create a dashed line with the SetLineStyle method, you must set the line width to 1.

<param name = "Line0004"

value = "SetFillStyle(1)" />

determines the style in which a shape is

filled with color.

In the example program (shape.html) a

value 1 fills shapes with the solid color.

There are 14 possible fill styles

1. X coordinate 2. Y coordinate 3. height 4. width

5. starting angle in degrees
6. size of the arc relative to the starting angle (in degrees)
7. the rotation of the arc

<param name = "Line0007" value = “Pie(-200,-125,100,100,45,135,0 )" />

1. X coordinate 2. Y coordinate 3. height 4. width

5. starting angle in degrees
6. size of the arc relative to the starting angle (in degrees)
7. the rotation of the arc NOTE: The Pie method takes the same parameters as does the Arc method, but it fills the arc with the color of the foreground, thus creates a pie shape.

Polygon(5, x

1

, y

1

, x

2

, y

2

, x

3

, y

3

,x

4

, y

4

, x

5

, y

5

<param name = "Line0009"

value="Rect( -185, 0, 60, 30, 25 )" />

1. X coordinate 2. Y coordinate 3. height 4. width 5. Rotation in degrees

<param name = "Line0011" value = "SetFont( 'Arial', 65, 400, 0, 0, 0 )” /> The SetFont method sets the font style to use when we use the Text method to place text.

1. font face
2. Font size in points
3. Font weight (boldness – ranging from 100 to 700)
4. Italic (0/1)
5. Underline (0/1)
6. Strikethrough (0/1)

1. Text to be placed.
2. X coordinate
3. Y coordinate
4. Rotation in degrees