0% found this document useful (0 votes)
58 views14 pages

ActiveX Control for 2D Graphing

The 2D Graph ActiveX Control is a customizable OCX control designed for plotting two-dimensional data, allowing for multiple plots with individual properties and various interactive features such as zooming and panning. It supports dynamic annotations, cursor tracking, and can save snapshots as bitmap files. The control requires registration as a COM component and can be integrated into applications that support ActiveX controls, with detailed customization options available for design and runtime.

Uploaded by

abarresan
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
58 views14 pages

ActiveX Control for 2D Graphing

The 2D Graph ActiveX Control is a customizable OCX control designed for plotting two-dimensional data, allowing for multiple plots with individual properties and various interactive features such as zooming and panning. It supports dynamic annotations, cursor tracking, and can save snapshots as bitmap files. The control requires registration as a COM component and can be integrated into applications that support ActiveX controls, with detailed customization options available for design and runtime.

Uploaded by

abarresan
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

3/26/2020 2D Graph ActiveX Control - CodeProject

14,476,055 members Sign in

Search for articles, questions,


articles Q&A forums stuff lounge ?

2D Graph ActiveX Control


Nikolai Teofilov Rate this: 4.89 (157 votes)
5 Aug 2003 MIT

An ActiveX control for 2D data visualisation

Download source files - 381 Kb


Download demo projects - 200 Kb
Download control binaries - 72 Kb

Introduction
This is a simple OCX control, which allows you to plot two-dimensional data. Despite the large set of controls that comes with VC++,
there is no out-of-the-box control that provides a simple and straightforward 2D data visualization. The ActiveX control tutorial by Kapil

[Link] 1/14
3/26/2020 2D Graph ActiveX Control - CodeProject

Chaturvedi inspired me to write my own control, mostly because I wanted to customize the source code when needed. Over time, the
functionality of the ActiveX control became more elaborate, and finally I made decision to publish what I have in hand.

What Can It Do?


The control is able to plot a large number of points and updating one or more plots on the graph with new data, replacing the old plot
with the new plot. Multiple plots with individual properties such as name, line and point style, width, could be customized at runtime. At
runtime, the control is capable of displaying its own property pages (double click on the control area or by invoking the ShowProperties
method) and showing short help as a result of the user pressing F1 while the control has the focus. By setting the TrackMode property
you should be able to switch between a different modes such as tracking cursor coordinates while moving (left mouse button pressed),
zooming, XY-, X-, and Y-panning. Finally the control snapshot could be copied to the clipboard, printed, or saved as a bitmap file.

What doesn't it do?


You cannot plot 3D data, but you can use the NTGraph3D ATL/STL/OpenGL activeX control to do that :-)!

What's New?
The Log Axes Mode works now, showing the log10 grid, and appropriated labels, it also converts the graph element's data
The control's snapshot could be now saved as a bitmap file, many thanks to Robert Harber for providing the code!
Added abilities to dynamically creating annotation labels, that can be on different colors, orientations, and also could be hidden
or visible.
Added "Annotations" property page that provides fully access to the annotation list in the real/design mode.
Added abilities to dynamically drawing of multiply cursors, with a different colors, crosshair styles, floating/fixed, or snapped to
the currently selected element!
Added "Cursors" property page that provides fully access to the cursor list in the real/design mode.
Added axis formatting, that allows a customization of the bottom and left axis labels.
Added "Format" property page that provides access to the axis format properties, and a templates for of commonly used data
formats such a: Numbers, Exponential, Symbolic, Date, and Time!
Added Time format for the graph axes. To use it, you should set the XTime/YTime property to True.
You also have to convert the date/time data to double format. The Date/Time format is implemented as a as a floating-point
value, measuring days from midnight, 30 December 1899. So, midnight, 31 December 1899 is represented by 1.0. Similarly, 6 AM,
1 January 1900 is represented by 2.25, and midnight, 29 December 1899 is 1.0. However, 6 AM, 29 December 1899 is 1.25.
For more info refer to MSDN for the class:COleDateTime!

How to test the control


You can use the ActiveX Control Test Container, and load the [Link] macro from the menu Tools\Macros... You can write your own
routines to test the control behavior (look at [Link] macro)

How to use the control


To use this OCX control, embed it in an application that supports the use of OCX controls. Microsoft Visual Basic applications, Office
applications and applications created with the Microsoft Developer Studio’s AppWizard can support the use of OCX controls. There are
two files required to use this control. They are:

[Link] -The help file for this control.


[Link] -The NTGraph controls code and data.

Before the ActiveX control can be used in your application, it must be registered as a COM Component in the system registry. This is a
self registering control. This means that to register the control in the system registry you only need to have an application load the
control and call the control’s exported function DllRegisterServer. You can use the REGSVR32 utility or have your setup program do this.

[Link] 2/14
3/26/2020 2D Graph ActiveX Control - CodeProject

How to use the REGSVR32 utility?


Copy [Link] to your directory and type:

regsvr32 [Link]
regsvr32 /u [Link] (Unregister server)

Customizing The Control


You can change the properties of this control during design time, or in run time to affect how the control will plot the data.
Use the new control property pages:

Graph Property Page

Elements Property Page

[Link] 3/14
3/26/2020 2D Graph ActiveX Control - CodeProject

Annotations Property Page

Cursors Property Page

[Link] 4/14
3/26/2020 2D Graph ActiveX Control - CodeProject

Format Property Page

You can include the control in your project by following the standard steps for ActiveX controls:

1. Create MFC Dialog project or MDI/SDI project with View class derived from CFormView
2. Choose menu Project|Add To Project|Components and Controls...
3. Open the Registered ActiveX Control gallery
4. Choose the NTGraph Control and click Insert
5. Visual C++ will generate the class CNTGraph
6. Then you can define variable of the type as CNTGraph.

The control's customization options are straightforward:

Hide Copy Code

// Customize Graph Properties

m_Graph.SetBackColor (RGB(0,0,0));
m_Graph.SetAxisColor (RGB(0,255,0));
[Link] 5/14
3/26/2020 2D Graph ActiveX Control - CodeProject
m_Graph.SetLabelColor (RGB(128,255,255));

// Control's Frame and Plot area options


m_Graph.SetFrameColor((RGB(0,0,0));
m_Graph.SetPlotAreaColor(RGB(212,222,200));

m_Graph.SetFrameStyle(2) // (1) - Flat


// (2) - Scope (raised frame and sunken plot area borders)
// (3) - 3DFrame (a bitmap frame picture)

m_Graph.SetGridColor(RGB(192,192,192));
m_Graph.SetShowGrid (TRUE);

m_Graph.SetCursorColor (RGB(255,0,0));
m_Graph.SetTrackMode (1);

m_Graph.SetGraphTitle("XY Plot");
m_Graph.SetXLabel ("X Axis");
m_Graph.SetYLabel("Y Axis");
m_Graph.SetRange(0.,10,-1,1.);

You don't need to call the control Invalidate() function every time you change a Graph property. The changes are automatically
reflected on the control appearance.

To load the data into the control...

Hide Shrink Copy Code

//
//
// Customize Graph Elements
//
//
// The Graph elements are dynamically allocated!

// Element 0 is allocated by default


// Even after a call to the ClearGraph method,
// the Element-0 is automaticaly allocated.

m_Graph.SetElementLineColor(RGB(255,0,0));
m_Graph.SetElementLinetype(0);
m_Graph.SetElementWidth(1);

m_Graph.SetElementPointColor(RGB(0,0,255);
m_Graph.SetElementPointSymbol(3);
m_Graph.SetElementSolidPoint(TRUE);

// Allocate a new element: Element-1


m_Graph.AddElement();

m_Graph.SetElementColor (RGB(0,255,0));
m_Graph.SetElementLinewidth(1);
m_Graph.SetElementLinetype(2);

// Allocate a new element: Element-2


m_Graph.AddElement();

m_Graph.SetElementColor (RGB(0,0,255));
m_Graph.SetElementLinetype(3);

// Now change again the properties of Element-1


m_Graph.SetElement(1);

[Link] 6/14
3/26/2020 2D Graph ActiveX Control - CodeProject

m_Graph.SetElementColor (RGB(0,0,255));
...

//
// Load Data int the Graph Elements
//

double y;
for (int i = 0; i < NumberOfElements; i++)
{
for (int x = 0; x < NumberOfPoints; x++)
{
y = (double)rand() / RAND_MAX * 10.0;
y = y / 3 + 10.0 / 2 * i + 1;
m_Graph.PlotXY(x, y, i);
// or PlotY(double data, long ElementID)
}
}

The same story for Visual Basic Users:


Hide Copy Code

With NTGraph1
.PlotAreaColor = vbBlack
.FrameStyle = Frame
.Caption = ""
.XLabel = ""
.YLabel = ""

.ClearGraph 'delete all elements and create a new one


.ElementLineColor = RGB(255, 255, 0)
.AddElement ' Add second elements
.ElementLineColor = vbGreen

For X = 0 To 100
Y = Sin(X / 3.15) * Rnd - 1
.PlotY Y, 0
Y = Cos(X / 3.15) * Rnd + 1
.PlotXY X, Y, 1
.SetRange 0, 100, -3, 3
Next X
End With

NTGraph Properties:

Graph

short Appearance
BSTR Caption
short Appearance
BSTR Caption
BSTR XLabel
BSTR YLabel
OLE_COLOR ControlFrameColor
OLE_COLOR PlotAreaColor
OLE_COLOR AxisColor
[Link] 7/14
3/26/2020 2D Graph ActiveX Control - CodeProject

OLE_COLOR GridColor
OLE_COLOR LabelColor
OLE_COLOR CursorColor
IPictureDisp* ControlFramePicture
IPictureDisp* PlotAreaPicture
IFontDisp*LabelFont
IFontDisp* TickFont
IFontDisp* TitleFont
IFontDisp* IdentFont
FrameType FrameStyle
short XGridNumber
short YGridNumber
boolean ShowGrid
boolean XLog
boolean YLog
double XCursor
double YCursor

Elements

short Element
short ElementCount
OLE_COLOR ElementLineColor
OLE_COLOR ElementPointColor
LineType ElementLinetype
short ElementWidth
SymbolType ElementPointSymbol
boolean ElementSolidPoint
boolean ElementShow
TrackModeState TrackMode
BSTR ElementName
boolean ElementIdent

Annotations

short Annotation
short AnnoCount
BSTR AnnoLabelCaption
double AnnoLabelX
double AnnoLabelY
OLE_COLOR AnnoLabelColor
boolean AnnoLabelHorizontal
boolean AnnoVisible

Cursors

short Cursor
short CursorCount
[Link] 8/14
3/26/2020 2D Graph ActiveX Control - CodeProject

short CursorMode (0 - Fixed; 1 - Floating; 2 - Snapped to currentlly selected element)


double CursorX
double CursorY
OLE_COLOR CursorColor
short CursorStyle (0 - Crosshair; 1 - X hairline only; 2 - Y hairline only;)
boolean CursorVisible

Format

boolean XTime
boolean YTime
BSTR FormatAxisBottom
BSTR FormatAxisLeft

Methods

Graph

void SetRange(double xmin, double xmax, double ymin, double ymax)


void AutoRange()
void CopyToClipboard()
void PrintGraph()
void ShowProperties()

Elements

void AddElement()
void DeleteElement(short ElementID)
void ClearGraph()
double GetElementXValue(short index, short ElementID)
void SetElementXValue(short index, short ElementID, double newValue)
double GetElementYValue(short index, short ElementID)
void SetElementYValue(short index, short ElementID, double newValue)
void PlotXY(double X, double Y, short ElementID)
void PlotY(double Y, short ElementID)

Annotations

void AddAnnotation()
void DeleteAnnotation(short AnnotationID)

Cursors

void AddCursor()
void DeleteCursor(short CursorID)

Tracking Mode constants


[Link] 9/14
3/26/2020 2D Graph ActiveX Control - CodeProject

None = 0
Track = 1 Track cursor position (hold mouse button pressed)
Cursor = 2 Cursor position by single click
Zoom = 3 Unzoom (right mouse button click)
PanXY = 4
PanX = 5
PanY = 6

Frame Style Constants


Flat = 0
Scope = 1 (raised frame and sunken plot area borders)
3DFrame = 2 (a bitmap frame picture)

Line style constants


Solid = 0
Dash = 1
Dot = 2
DashDot = 3
DashDotDot = 4
Null = 5
XYStep = 6
YXStep = 7
Bars = 8
Stick = 9

Symbol style constants


Nosym = 0
Dots = 1
Rectangles = 2
Diamonds = 3
Asterisk = 4
DownTriangles = 5
UpTriangles = 6
LeftTriangles = 7
RightTriangles = 8

Yep, that's it!


Enjoy!

Send mail to nteofilov@[Link] with questions or comments about this article.

History
22 Nov 2002 - v1.0 Initial release

01 Dec 2002 - v1.1

Added new method copy2clipboard.


Added the ability to draw elements with a different number of points. (by [Link])
New method added by [Link] to Show/Hide the Graph Element
Bug fix. Thanks to [Link] for help.
[Link] 10/14
3/26/2020 2D Graph ActiveX Control - CodeProject

Fixed some drawing problems. Thanks to Judd.


Added custom font support.
Zoom Mode: Not implemented yet, but reserved.

26 Jan 2003 - v2.0 (Flicker Free versiton of the control)

Thanks to Keith Rule for the class CMemDC


ZoomMode Implemented.
Added tooltip, showing current cursor position.
Added new method Autorange.
Added new property ElementLinewidth.
Added new property ElementLinetype.
Fixed some drawing problems.
Added ([Link]) a brief info on how to add the control to your web page.

09 Mar 2003 - v2.1

PanMode Implemented.
Modified SetElementColor, SetElementLinewidth, SetElementLinetype, so that they accept as a first
parameter the ElementID.
Fixed some drawing problems. Should be clean now.
GDI leak Fixed.

01 Jun 2003 - v3.0 New release!

Thanks to Chris Maunder for Colour Picker control

02 Aug 2003 - v4.0 Final release!

Thanks to Robert Harber for the useful discussions, ideas and code.
Thanks to tagi1 for fixing the printing font problem.
Thanks to Judd for testing the control.

Note that since there are significant changes in the last release you should remove (first unregister and than delete) all old versions of
the control from your projects! The VBA users who use the control inside of Office applications should also remove the following file
[Link] in the Temp directory of your computer. This file is automatically created by the Office application and saves
properties of the former created control instances. You have to delete this file before you insert the new version of the control, in order
to get correctly names in the property browser.

License
This article, along with any associated source code and files, is licensed under The MIT License

Share

About the Author

[Link] 11/14
3/26/2020 2D Graph ActiveX Control - CodeProject

Nikolai Teofilov
No Biography provided
Researcher
Germany

Comments and Discussions

You must Sign In to use this message board.

Search Comments

First Prev Next

Multi-language support.
thenndral 29-Apr-18 21:53

Get extents of window.


bakerjw1 26-Mar-18 3:33

My vote of 4
Member 13021998 24-Feb-17 8:36

Cant control element visiblity


Nick B Dacek 18-Jul-16 7:40

Multi-threaded NTGraph worked with 32 bit; fixed ASSERT problem with 64 bit compile
Member 3003782 30-Mar-16 9:39

Cannot use in x64 project?


Member 12252024 24-Feb-16 14:22

Is there a bug in NTGraph?


Member 11978923 2-Feb-16 2:04

VS2015
Member 10290644 24-Jul-15 14:32

Re: VS2015
Member 10290644 13-Aug-15 18:51

Re: VS2015
Bold 22-Oct-15 5:20

[Link] 12/14
3/26/2020 2D Graph ActiveX Control - CodeProject

make elements visible or not


Roman Gaisin 25-Sep-14 16:16

Re: make elements visible or not


Nick B Dacek 18-Jul-16 7:36

Have a Quenstion. for Asking Lincense.


Member 10740596 22-Apr-14 15:27

how to know the last point plotted?


[Link] 14-Apr-14 4:12

[Link] registration problem solved


saraswathisrinath 9-Feb-14 22:16

How To Register [Link] in Win 8 + VS2012


saraswathisrinath 7-Feb-14 23:36

Using NTGraph in educational apps


Arturo Lennon 17-Jun-13 19:00

possible to add a Costum point ?


Alina K 6-Feb-13 3:04

Converting Cursor Coordinates to Plot Coordinates


Sandthief 12-Nov-12 10:58

Crash on multi core cpu computer


licheer 10-Oct-12 5:39

can not using in Win 64 bit ???


shizuoka2010 18-Sep-12 19:40

Re: can not using in Win 64 bit ???


Nenad Medić 14-Nov-12 7:02

CPU usage
realtimedev 28-Aug-12 10:20

Re: CPU usage


Member 11958509 17-Sep-15 13:19

VS 2010???
boblogan 15-Jul-12 21:45

Refresh 1 2 3 4 5 6 7 8 9 10 11 Next »

General News Suggestion Question Bug Answer Joke Praise Rant Admin

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink Layout: fixed | fluid Article Copyright 2002 by Nikolai Teofilov


Advertise Everything else Copyright © CodeProject, 1999-
Privacy 2020
Cookies
Terms of Use Web04 2.8.200307.1

[Link] 13/14
3/26/2020 2D Graph ActiveX Control - CodeProject

[Link] 14/14

Common questions

Powered by AI

The 2D Graph ActiveX Control allows for plotting a large number of points and can update multiple plots on the graph with new data, replacing the old plot with a new plot . It supports multiple plots with customizable properties such as name, line and point style, and width, which can be adjusted at runtime . Additionally, the control enables users to display its own property pages and provide help assistance via F1 when in focus. It supports different modes including tracking cursor coordinates, zooming, and XY-, X-, Y-panning. The functionality also includes saving graph snapshots as bitmap files and dynamically creating annotation labels and drawing multiple cursors with customization options .

Customization of the 2D Graph ActiveX Control can be performed both during design-time and runtime using property pages . During design-time, the control's properties like background color, axis color, frame style, and plot area color can be set using provided methods such as SetBackColor, SetAxisColor, and SetFrameColor . At runtime, properties can be altered dynamically with access to property pages like Graph, Elements, Annotations, Cursors, and Format Property Pages. This allows the user to switch modes, format axes, modify annotation labels, and adjust cursor behavior .

Throughout its development, several improvements were made to the 2D Graph ActiveX Control, including flicker-free display, implementation of ZoomMode, and new methods like auto-range and copy to clipboard . Additional features such as element and cursor management, pan modes, and custom font support enhanced its functionality . The final release was motivated by significant contributions and testing efforts from users like Robert Harber and Judd, along with essential bug fixes such as for GDI leaks . These iterative improvements helped stabilize and extend the control's capabilities.

The 2D Graph ActiveX Control supports several track modes, each with unique functionality. The 'None' mode represents no tracking, while 'Track' mode allows tracking of cursor position when the mouse button is pressed. 'Cursor' mode updates cursor position with a single click. There is also 'Zoom', which modifies scaling by mouse right-click, and modes such as 'PanXY', 'PanX', and 'PanY', which allow panning of both axes or individually along the X or Y axis, respectively . These modes offer versatile control for interacting with the graph data display.

Testing the NTGraph ActiveX control involves using the ActiveX Control Test Container, where you load the Test.dsm macro from the menu Tools\Macros . You can create custom routines to check the control's behavior by referencing the Test.dsm macro. This provides an environment where the control functions can be manipulated and tested, allowing for verification of its features and any potential issue debugging through interactive use and observation .

The 2D Graph ActiveX Control supports multiple graph elements by enabling the dynamic allocation of these elements. The control initially allocates Element-0 by default, and even after a call to the ClearGraph method, Element-0 is automatically reallocated. Additional elements can be added using the AddElement method, and each element's properties, such as color, line type, and width, can be individually set using corresponding methods like SetElementLineColor and SetElementLinetype . Program management of elements is flexible, allowing modifications of properties for specific elements programmatically at runtime.

VBA users upgrading to a new version of the NTGraph ActiveX Control must remove all old versions first by unregistering them and then deleting them from their projects . Additionally, the NTGRAPHLib.exd file, typically stored in the Temp directory, should be deleted because it caches property values of the previous control instance, potentially leading to incorrect property names in the new version . This ensures that the latest control is correctly registered and functions as expected within Office applications.

To handle time-format data within the 2D Graph ActiveX Control, the XTime and YTime properties need to be set to True . The data must be converted to a double format reflecting time measurement as floating-point values, where the date/time is calculated in days from midnight, December 30, 1899. For example, midnight on December 31, 1899 is represented as 1.0, and 6 AM on January 1, 1900, is 2.25 . This system ensures that time-series data is correctly displayed on the graph axes with proper date/time formatting.

To integrate the NTGraph Control into a new MFC project using Visual C++, first create a project such as an MFC Dialog or MDI/SDI project with a View class derived from CFormView. Navigate to Project|Add To Project|Components and Controls and open the Registered ActiveX Control gallery. Select NTGraph Control and click Insert. Visual C++ will generate a CNTGraph class, which can then be used to define variables of this type within the project . This process integrates the control and allows its functionalities to be used in the MFC application.

To register the NTGraph.ocx file, one can use the REGSVR32 utility, a command-line program used to register and unregister OLE controls like DLLs and ActiveX controls in the Windows Registry. To register NTGraph.ocx, the file should be copied to the desired directory, and the command 'regsvr32 NTGraph.ocx' should be executed in the command prompt. To unregister, the command 'regsvr32 /u NTGraph.ocx' is used . This process helps make the control available for use within applications by registering it as a COM component.

You might also like