Platforms to show: All Mac Windows Linux Cross-Platform
/ChartDirector/ChartDirector Control for Web 2021
Function:
Required plugins for this example: MBS Images Plugin, MBS ChartDirector Plugin, MBS Main Plugin
You find this example project in your Plugins Download as a Xojo project file within the examples folder: /ChartDirector/ChartDirector Control for Web 2021
This example is the version from Mon, 2nd May 2021.
Function:
Required plugins for this example: MBS Images Plugin, MBS ChartDirector Plugin, MBS Main Plugin
You find this example project in your Plugins Download as a Xojo project file within the examples folder: /ChartDirector/ChartDirector Control for Web 2021
This example is the version from Mon, 2nd May 2021.
Project "ChartDirector Control for Web 2021.xojo_binary_project"
Class App Inherits WebApplication
End Class
Class ChartDirectorControl Inherits WebImageViewer
Event ItemClicked(XLabel As String, X As Integer, DataSet As Integer, DataSetName As String, Value As Double, Title As String, Sector As Integer, Label As String)
End Event
Event Opening()
End Event
Event Render(Factor As Double, Width As Integer, Height As Integer) As CDBaseChartMBS
End Event
EventHandler Sub Opening()
// Call overridden superclass method
RaiseEvent Opening
Redraw
End EventHandler
EventHandler Sub Pressed(x as Integer, y as Integer)
Dim HotSpotID As Integer
// Check if over a hotspot; Nil check prevents spurious NilObjectExceptions
If (ImageMapHandler <> Nil) Then HotSpotID = ImageMapHandler.getHotSpot(X, Y)
If (HotSpotID > 0) Then
// Click
SendClickEvent
If ShowValueOnClick Then
DrawItemInfo(X, Y)
End If
End If
End EventHandler
Private Sub CleanUp()
// Finalize redraw
If (NeedClear = True) Then
NeedClear = False
self.Picture = LastWebPicture
End If
End Sub
Function CurrentPicture() As Picture
// Return the currently displayed chart image
Return (LastPicture)
End Function
Private Sub DrawItemInfo(X As Integer, Y As Integer)
Dim Index As Integer
Dim Key, KeyValue As String
Dim XLabel As String
Dim XValue As String
Dim DataSet As String
Dim DataSetName As String
Dim Value As String
Dim Title As String
Dim Sector As String
Dim Label As String
// Error check
If (ImageMapHandler = Nil) Then Return
// Do key/value pair priming calls
Index = 0
Key = ImageMapHandler.getKey(Index)
KeyValue = ImageMapHandler.getValue(Index)
Do
// NOTE: This is not the complete supported list of parameters; Refer to ChartDirector documentation on 'Parameter Substitution and Formatting' for additional parameters
Select Case Key
Case "xlabel"
XLabel = KeyValue
Case "x"
XValue = KeyValue
Case "dataset"
DataSet = KeyValue
Case "datasetname"
DataSetName = KeyValue
Case "value"
Value = KeyValue
Case "title"
Title = KeyValue
Case "sector"
Sector = KeyValue
Case "label"
Label = KeyValue
End Select
Index = Index + 1
// Get next key/value pair
Key = ImageMapHandler.getKey(Index)
KeyValue = ImageMapHandler.getValue(Index)
Loop Until Key.Len = 0
// Compose label graphic
If (Label <> "") Then Value = Label + ": " + Value
Dim B As Picture = New Picture(LastPicture.Width, LastPicture.Height)
dim f as integer = 2
B.VerticalResolution = LastPicture.VerticalResolution
b.HorizontalResolution = LastPicture.HorizontalResolution
Dim G As Graphics = B.Graphics
g.TextSize = 12 * f
Dim W As Integer = 6 + G.StringWidth(Value) / f
Dim H As Integer = 20
// Add some space between the cursor position and the initial label drawing position
X = X + 10
Y = Y + 10
// If we are too close to the right, we need to move our label drawing position left
If (X + W > G.Width) Then X = X - 20 - W
// If we are too close to the bottom, we need to move our label drawing position up
If (Y + H > G.Height) Then Y = Y - 20 - H
// Draw in the current composited chart image
B.Graphics.DrawPicture(LastPicture, 0, 0)
if LastPicture.Mask <> nil and b.mask <> nil then
B.Mask.Graphics.DrawPicture(LastPicture.Mask, 0, 0)
end if
// Draw the label graphic
G.ForeColor = &cCCCC00
G.FillRect(X*f, Y*f, W*f, H*f)
G.ForeColor = &c000000
G.DrawString(Value, f*(X + 3), f*(Y + 15))
// Update the composited chart image
// this should convert normally and handle resolution
'Self.Picture = B
// work around
Dim temp As New Picture(Me.Width, Me.Height)
LastWebPicture = temp
LastWebPicture.Data = B.ToData(Global.Picture.Formats.JPEG, Global.Picture.QualityHigh)
Self.Picture = LastWebPicture
NeedClear = True
End Sub
Sub Redraw()
// Trigger chart rendering (actual chart configuration and data plotting)
Current = Render(1.0, me.Width, me.Height)
If Current = Nil Then
// If there is no valid chart object returned, clear the drawing region
LastPicture = nil
LastWebPicture = nil
Self.Picture = Nil
Else
// Get the chart image based on the returned chart object
LastPicture = Current.makeChartPicture
// Support overlay picture drawing
If (OverlayPicture <> Nil) Then
LastPicture.Graphics.DrawPicture(OverlayPicture, (me.Width - OverlayPicture.Width) / 2, (me.Height - OverlayPicture.Height) / 2)
End If
// Support control border drawing
If (Border = True) Then
LastPicture.Graphics.PenHeight = 1
LastPicture.Graphics.PenWidth = 1
LastPicture.Graphics.ForeColor = &c000000
LastPicture.Graphics.DrawRect(0, 0, me.Width, me.Height)
LastPicture.Mask.Graphics.PenHeight = 1
LastPicture.Mask.Graphics.PenWidth = 1
LastPicture.Mask.Graphics.ForeColor = &c000000
LastPicture.Mask.Graphics.DrawRect(0, 0, Me.Width, Me.Height)
End If
// Draw composited chart image
// the plugin should set them, but looks like those properties are broken! Feedback 64625
LastPicture.HorizontalResolution = 144
LastPicture.VerticalResolution = 144
// this should convert normally and handle resolution
'LastWebPicture = LastPicture
// work around
Dim temp As New Picture(Me.Width, Me.Height)
LastWebPicture = temp
LastWebPicture.Data = LastPicture.ToData(Global.Picture.Formats.JPEG, Global.Picture.QualityHigh)
Self.Picture = LastWebPicture
// Process ImageMap data to support data point rollovers, etc.
ImageMapString = Current.getHTMLImageMap("myurl" )
ImageMapHandler = New CDImageMapHandlerMBS(ImageMapString)
End If
End Sub
Function RenderPicture(Factor As Double, Width As Integer, Height As Integer) As Picture
// Handle scaled redraw for printing
Dim C As CDBaseChartMBS = Render(factor, Width, Height)
'If (C <> Nil) Then Return (C.makeChartPicture)
// Error check
If (C = Nil) Then Return (Nil)
// Get in-memory version of the chart image in PNG format (supports transparency)
Dim S As String
S = C.makeChart(C.kPNG)
// Error check
If (S = "") Then Return (Nil)
// Generate RB Picture from chart image data
Dim P As Picture
P = PNGStringToPictureMBS(S, 0)
Return (P)
End Function
Sub Resized()
If LastPicture = Nil Or Self.Width <> LastPicture.Width Or Self.Height <> LastPicture.Height Then
redraw
End If
End Sub
Private Sub SendClickEvent()
Dim Index as integer
Dim Key, KeyValue As String
Dim XLabel As String
Dim XValue As String
Dim DataSet As String
Dim DataSetName As String
Dim Value As String
Dim Title As String
Dim Sector As String
Dim Label As String
// Error check
If (ImageMapHandler = Nil) Then Return
// Do key/value pair priming calls
Index = 0
Key = ImageMapHandler.getKey(Index)
KeyValue = ImageMapHandler.getValue(Index)
#if DebugBuild then
// so you can look on all values in debugger
dim debugDictionary as new Dictionary
#endif
Do
#if DebugBuild then
debugDictionary.value(key) = KeyValue
#endif
// NOTE: This is not the complete supported list of parameters; Refer to ChartDirector documentation on 'Parameter Substitution and Formatting' for additional parameters
Select Case Key
Case "xlabel"
XLabel = KeyValue
Case "x"
XValue = KeyValue
Case "dataset"
DataSet = KeyValue
Case "datasetname"
DataSetName = KeyValue
Case "value"
Value = KeyValue
Case "title"
Title = KeyValue
Case "sector"
Sector = KeyValue
Case "label"
Label = KeyValue
End Select
Index = Index + 1
// Get next key/value pair
Key = ImageMapHandler.getKey(Index)
KeyValue = ImageMapHandler.getValue(Index)
Loop Until Key.Len = 0
// Trigger click event
ItemClicked(XLabel, Val(XValue), Val(DataSet), DataSetName, Val(Value), Title, Val(Sector), Label)
End Sub
Note "About Properties"
AllowMove and AllowZoom must be enabled if you want to zoom and move.
You need to use the viewport in your render code.
If Border is true, a black line is drawn around the chart.
If CleanGraphicsBeforeDrawing is true then the graphics object is cleared
before something is drawn
The OverlayPicture defines a picture which is drawn on top of the chart
as a watermark.
RenderWithTransparency will do redraws slower. The chart is rendered as
PNG with mask and for every redraw we refresh the whole control.
This may look bad on Windows.
ZoomInRatio and ZoomOutRatio are used for zooming.
This is how much we zoom on each click.
Note "Notes for Render Event"
Use the Width and Height you get and not the control's.
Use the Factor to multiply all values so you get it properly scaled for printing.
Use the ViewPort for zooming and moving.
Property Border As Boolean
Property Private Current As CDBaseChartMBS
Property Private ImageMapHandler As CDImageMapHandlerMBS
Property ImageMapString As string
Last map for debugging.
Property Private LastPicture As Picture
Property Private LastWebPicture As WebPicture
Property Private NeedClear As Boolean
Property OverlayPicture As Picture
Property ShowValueOnClick As Boolean
End Class
End Project
See also:
The items on this page are in the following plugins: MBS ChartDirector Plugin.
Feedback: Report problem or ask question.
