Xojo Conferences
XDCMay2019MiamiUSA

Platforms to show: All Mac Windows Linux Cross-Platform

/ChartDirector/multiaxes
Function:
Required plugins for this example: MBS ChartDirector Plugin
You find this example project in your Plugins Download as a Xojo project file within the examples folder: /ChartDirector/multiaxes
This example is the version from Sun, 17th Mar 2012.
Project "multiaxes.rbp"
Class App Inherits Application
Const kEditClear = "&Löschen"
Const kFileQuit = "Beenden"
Const kFileQuitShortcut = ""
End Class
Class PicWindow Inherits Window
EventHandler Sub Open() // Data for the chart dim Data0(-1) as double = array(1700, 3900, 2900, 3800, 4100, 4600, 2900, 4100, 4400, 5700, 5900, 5200, 3700, 3400, 5100, 5600, 5600, 6000, 7000, 7600, 6300, 6700, 7500, 6400, 8800.0) dim Data1(-1) as double = array(500, 550, 670, 990, 820, 730, 800, 720, 730, 790, 860, 800, 840, 680, 740, 890, 680, 790, 730, 770, 840, 820, 800, 840, 670.0) dim Data2(-1) as double = array(46, 68, 35, 33, 38, 20, 12, 18, 15, 23, 30, 24, 28, 15, 21, 26, 46, 42, 38, 25, 23, 32, 24, 20, 25.0) dim Data3(-1) as double = array(0.84, 0.82, 0.82, 0.38, 0.25, 0.52, 0.54, 0.52, 0.38, 0.51, 0.46, 0.29, 0.5, 0.55, 0.47, 0.34, 0.52, 0.33, 0.21, 0.3, 0.25, 0.15, 0.18, 0.22, 0.14) // Labels for the chart dim labels(-1) as string = array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24") // Create a XYChart object of size 600 x 300 pixels, with a grey (eeeeee) // background, a black border, and 1 pixel 3D border effect dim c as new CDXYChartMBS(600, 300, &heeeeee, &h000000, 1) // Add a title box to the chart using 15 pts Arial Bold Italic font, with blue // (aaaaff) background c.addTitle("Multiple Axes Demonstration", "arialbi.ttf", 15).setBackground(&haaaaff) // Set the plotarea at (100, 70) and of size 400 x 180 pixels, with white // background. Turn on both horizontal and vertical grid lines with light grey // color (cccccc) c.setPlotArea(100, 70, 400, 180, &hffffff).setGridColor(&hcccccc, &hcccccc) // Add a legend box at (300, 70) (top center of the chart) with horizontal // layout. Use 8 pts Arial Bold font. Set the background and border color to // Transparent. dim legendBox as CDLegendBoxMBS legendBox = c.addLegend(300, 70, false, "arialbd.ttf", 8) legendBox.setAlignment(CDXYChartMBS.kBottomCenter) legendBox.setBackground(CDXYChartMBS.kTransparent, CDXYChartMBS.kTransparent) // Set the labels on the x axis. call c.xAxis.setLabels(labels) // Display 1 out of 3 labels on the x-axis. c.xAxis.setLabelStep(3) // Add a title to the x-axis call c.xAxis.setTitle("Hour of Day") // Add a title on top of the primary (left) y axis. c.yAxis.setTitle("Power"+endofline.unix+"(Watt)").setAlignment(CDXYChartMBS.kTopLeft2) // Set the axis, label and title colors for the primary y axis to red (c00000) to // match the first data set c.yAxis.setColors(&hcc0000, &hcc0000, &hcc0000) // Add a title on top of the secondary (right) y axis. c.yAxis2.setTitle("Load"+endofline.unix+"(Mbps)").setAlignment(CDXYChartMBS.kTopRight2) // Set the axis, label and title colors for the secondary y axis to green // (00800000) to match the second data set c.yAxis2.setColors(&h008000, &h008000, &h008000) // Add the third y-axis at 50 pixels to the left of the plot area dim leftaxis as CDAxisMBS leftAxis = c.addAxis(CDXYChartMBS.kLeft, 50) // Add a title on top of the third y axis. call leftAxis.setTitle("Temp"+endofline.unix+"(C)").setAlignment(CDXYChartMBS.kTopLeft2) // Set the axis, label and title colors for the third y axis to blue (0000cc) to // match the third data set leftAxis.setColors(&h0000cc, &h0000cc, &h0000cc) // Add the fouth y-axis at 50 pixels to the right of the plot area dim rightaxis as CDAxisMBS rightAxis = c.addAxis(CDXYChartMBS.kRight, 50) // Add a title on top of the fourth y axis. rightAxis.setTitle("Error"+endofline.unix+"(%)").setAlignment(CDXYChartMBS.kTopRight2) // Set the axis, label and title colors for the fourth y axis to purple (880088) // to match the fourth data set rightAxis.setColors(&h880088, &h880088, &h880088) // Add a line layer to for the first data set using red (c00000) color, with a // line width of 2 pixels dim layer0 as CDLineLayerMBS layer0 = c.addLineLayer(data0, &hcc0000, "Power") layer0.setLineWidth(2) // Add a line layer to for the second data set using green (00c0000) color, with // a line width of 2 pixels. Bind the layer to the secondary y-axis. dim layer1 as CDLineLayerMBS layer1 = c.addLineLayer(data1, &h008000, "Load") layer1.setLineWidth(2) layer1.setUseYAxis2 // Add a line layer to for the third data set using blue (0000cc) color, with a // line width of 2 pixels. Bind the layer to the third y-axis. dim layer2 as CDLineLayerMBS layer2 = c.addLineLayer(data2, &h0000cc, "Temperature") layer2.setLineWidth(2) layer2.setUseYAxis(leftAxis) // Add a line layer to for the fourth data set using purple (880088) color, with // a line width of 2 pixels. Bind the layer to the fourth y-axis. dim layer3 as CDLineLayerMBS layer3 = c.addLineLayer(data3, &h880088, "Error Rate") layer3.setLineWidth(2) layer3.setUseYAxis(rightAxis) // Output the chart Backdrop=c.makeChartPicture End EventHandler
End Class
MenuBar MenuBar1
MenuItem FileMenu = "&Ablage"
MenuItem FileQuit = "#App.kFileQuit"
MenuItem EditMenu = "&Bearbeiten"
MenuItem EditUndo = "&Rückgängig"
MenuItem UntitledMenu1 = "-"
MenuItem EditCut = "&Ausschneiden"
MenuItem EditCopy = "&Kopieren"
MenuItem EditPaste = "&Einfügen"
MenuItem EditClear = "#App.kEditClear"
MenuItem UntitledMenu0 = "-"
MenuItem EditSelectAll = "&Alles auswählen"
End MenuBar
End Project

Feedback, Comments & Corrections

The items on this page are in the following plugins: MBS ChartDirector Plugin.




Links
MBS Xojo Plugins