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/pareto
This example is the version from Fri, 9th Feb 2023.
Project "pareto.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 data(-1) as double = array(40, 15, 7, 5, 2.0)
// The labels for the chart
dim labels(-1) as string = array("Hard Disk", "PCB", "Printer", "CDROM", "Keyboard")
// Create a XYChart object of size 400 x 225 pixels. Use golden background color,
// with a 2 pixel 3D border.
dim c as new CDXYChartMBS(400, 225, CDXYChartMBS.goldColor, -1, 2)
// Add a title box using Arial Bold/11 pt font. Set the background color to
// metallic blue (9999FF). Use a 1 pixel 3D border.
dim t as CDTextBoxMBS
t=c.addTitle("Hardware Defects", "arialbd.ttf", 11)
t.setBackground(c.metalColor(&h9999ff), -1, 1)
// Set the plotarea at (50, 40) and of 300 x 150 pixels in size, with a silver
// background color.
call c.setPlotArea(50, 40, 300, 150, c.silverColor)
// Add a line layer for the pareto line
dim lineLayer as CDLineLayerMBS
lineLayer = c.addLineLayer
// Compute the pareto line by accumulating the data
dim lineData as new CDArrayMBS(data)
lineData.acc
// Set a scaling factor such as the maximum point of the line is scaled to 100
dim scaleFactor as Double
scaleFactor = 100 / lineData.max
// Add the pareto line using the scaled data. Use deep blue (0x80) as the line
// color, with light blue (0x9999ff) diamond symbols
dim d as CDDataSetMBS
lineData.mulvalue(scaleFactor)
d=lineLayer.addDataSet(linedata, &h000080)
call d.setDataSymbol(c.kDiamondSymbol, 9, &h9999ff)
// Set the line width to 2 pixel
lineLayer.setLineWidth(2)
// Add a multi-color bar layer using the given data.
dim colors(-1) as integer
dim barlayer as CDBarLayerMBS
barLayer = c.addBarLayer(data, colors)
// Bind the layer to the secondary (right) y-axis.
barLayer.setUseYAxis2
// Set soft lighting for the bars with light direction from the right
barLayer.setBorderColor(c.kTransparent, c.softLighting(c.kRight))
// Set the labels on the x axis.
call c.xAxis.setLabels(labels)
// Set the primary y-axis scale as 0 - 100 with a tick every 20 units
call c.yAxis.setLinearScale(0, 100, 20)
// Set the label format of the y-axis label to include a percentage sign
c.yAxis.setLabelFormat("{value}%")
// Add a title to the secondary y-axis
call c.yAxis2.setTitle("Frequency")
// Set the secondary y-axis label foramt to show no decimal point
c.yAxis2.setLabelFormat("{value|0}")
// Set the relationship between the two y-axes, which only differ by a scaling
// factor
c.syncYAxis(1.0 / scaleFactor)
// 2x for higher DPI displays
c.setOutputOptions("bmpscale=2")
pic = c.makeChartPicture
End EventHandler
EventHandler Sub Paint(g As Graphics, areas() As REALbasic.Rect)
If pic <> Nil Then
g.DrawPicture pic, 0, 0, g.Width, g.Height, 0, 0, pic.width, pic.height
End If
End EventHandler
Property pic As Picture
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.