Platforms to show: All Mac Windows Linux Cross-Platform
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/missingpoints
This example is the version from Sun, 17th Mar 2012.
Project "missingpoints.xojo_binary_project"
Class App Inherits Application
Const kEditClear = "&Löschen"
Const kFileQuit = "Beenden"
Const kFileQuitShortcut = ""
End Class
Class PicWindow Inherits Window
EventHandler Sub Open()
// The data for the chart
dim data0(-1) as double = array(42.0, 49, CDXYChartMBS.kNoValue, 38, 64, 56, 29, 41, 44, 57)
dim data1(-1) as double = array(65.0, 75, 47, 34, 42, 49, 73, CDXYChartMBS.kNoValue, 90, 69, 66, 78)
dim data2(-1) as double = array(CDXYChartMBS.kNoValue, CDXYChartMBS.kNoValue, 25, 28, 38, 20, 22, CDXYChartMBS.kNoValue, 25, 33, 30, 24)
dim labels(-1) as string = array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec")
// Create a XYChart object of size 600 x 360 pixels. Set background color to
// brushed silver, with a 2 pixel 3D border. Use rounded corners.
dim c as new CDXYChartMBS(600, 360, CDXYChartMBS.brushedSilverColor, CDXYChartMBS.kTransparent, 2)
c.setRoundedFrame
// Add a title using 18 pts Times New Roman Bold Italic font. #Set top/bottom
// margins to 6 pixels.
dim title as CDTextBoxMBS = c.addTitle("Product Line Global Revenue", "timesbi.ttf", 18)
title.setMargin(0, 0, 6, 6)
// Add a separator line just under the title
call c.addLine(10, title.getHeight, c.getWidth - 11, title.getHeight, CDXYChartMBS.kLineColor)
// Add a legend box where the top-center is anchored to the horizontal center of
// the chart, just under the title. Use horizontal layout and 10 points Arial
// Bold font, and transparent background and border.
dim legendBox as CDLegendBoxMBS = c.addLegend(c.getWidth / 2, title.getHeight, false, "arialbd.ttf", 10)
legendBox.setAlignment(CDXYChartMBS.kTopCenter)
legendBox.setBackground(CDXYChartMBS.kTransparent, CDXYChartMBS.kTransparent)
// Tentatively set the plotarea at (70, 75) and of 460 x 240 pixels in size. Use
// transparent border and black (000000) grid lines
call c.setPlotArea(70, 75, 460, 240, -1, -1, CDXYChartMBS.kTransparent, &h000000, -1)
// Set the x axis labels
call c.xAxis.setLabels(labels)
// Show the same scale on the left and right y-axes
c.syncYAxis
// Set y-axis tick density to 30 pixels. ChartDirector auto-scaling will use this
// as the guideline when putting ticks on the y-axis.
c.yAxis.setTickDensity(30)
// Set all axes to transparent
c.xAxis.setColors(CDXYChartMBS.kTransparent)
c.yAxis.setColors(CDXYChartMBS.kTransparent)
c.yAxis2.setColors(CDXYChartMBS.kTransparent)
// Set the x-axis margins to 15 pixels, so that the horizontal grid lines can
// extend beyond the leftmost and rightmost vertical grid lines
c.xAxis.setMargin(15, 15)
// Set axis label style to 8pts Arial Bold
call c.xAxis.setLabelStyle("arialbd.ttf", 8)
call c.yAxis.setLabelStyle("arialbd.ttf", 8)
call c.yAxis2.setLabelStyle("arialbd.ttf", 8)
// Add axis title using 10pts Arial Bold Italic font
call c.yAxis.setTitle("Revenue in USD millions", "arialbi.ttf", 10)
call c.yAxis2.setTitle("Revenue in USD millions", "arialbi.ttf", 10)
// Add the first line. The missing data will be represented as gaps in the line
// (the default behaviour)
dim layer0 as CDLineLayerMBS = c.addLineLayer
layer0.addDataSet(data0, &hff0000, "Quantum Computer").setDataSymbol(CDXYChartMBS.kGlassSphere2Shape, 11)
layer0.setLineWidth(3)
// Add the second line. The missing data will be represented by using dash lines
// to bridge the gap
dim layer1 as CDLineLayerMBS = c.addLineLayer
layer1.addDataSet(data1, &h00ff00, "Atom Synthesizer").setDataSymbol(CDXYChartMBS.kGlassSphere2Shape, 11)
layer1.setLineWidth(3)
layer1.setGapColor(c.dashLineColor(&h00ff00))
// Add the third line. The missing data will be ignored - just join the gap with
// the original line style.
dim layer2 as CDLineLayerMBS = c.addLineLayer
layer2.addDataSet(data2, &hff6600, "Proton Cannon").setDataSymbol(CDXYChartMBS.kGlassSphere2Shape, 11)
layer2.setLineWidth(3)
layer2.setGapColor(CDXYChartMBS.kSameAsMainColor)
// layout the legend so we can get the height of the legend box
call c.layoutLegend
// Adjust the plot area size, such that the bounding box (inclusive of axes) is
// 15 pixels from the left edge, just under the legend box, 16 pixels from the
// right edge, and 25 pixels from the bottom edge.
c.packPlotArea(15, legendBox.getTopY + legendBox.getHeight, c.getWidth - 16, c.getHeight - 25)
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
The items on this page are in the following plugins: MBS ChartDirector Plugin.