MBS Xojo Conference
6/7th September 2018, Munich

## A chart similar to the one on Apple Watch

While we don't have the exact same chart ready to use like you see them on the Apple Watch, we can create similar charts with our MBS Xojo ChartDirector Plugin.

We take a pie chart and have it render. Than we pick the draw area and draw a few circles on top with some labels.

if you like you can modify it to draw several circle segments to have it look more like an Apple Watch with Move, Exercise and Stand chart.

The chart on the right is created by the code below:
' The data for the pie chart dim angles() as double ' The sum must be 360 angles.Append 270 angles.Append 90 // our colors dim colors() as integer colors.Append &HA00060 colors.Append &H3f0025 const midRadius = 80 const halfRingWidth = 20 dim chartWidth as integer = (midRadius + halfRingWidth + 10) * 2 dim chartHeight as integer = chartWidth dim cX as integer = chartWidth / 2 dim cY as integer = chartHeight / 2 // start with a pie chart dim c as new CDPieChartMBS(chartWidth, chartHeight, &H004060) Call c.setDonutSize(cX, cY, midRadius + halfRingWidth, midRadius - halfRingWidth) ' Set the pie data and the pie labels Call c.setData(angles) Call c.setLabelFormat(" ") Call c.setColors(c.kDataColor, colors) // generate chart dim d as CDDrawAreaMBS = c.makeChart() // and draw some circles Call d.circle(cX, cY - midRadius, halfRingWidth, halfRingWidth, colors(0), colors(0)) dim endX as double = cX + midRadius * Sin(angles(0) * 3.1416 / 180) dim endY as double = cY - midRadius * Cos(angles(0) * 3.1416 / 180) Call d.circle(endX, endY, halfRingWidth, halfRingWidth, colors(0), colors(0)) Call d.circle(endX, endY, halfRingWidth - 5, halfRingWidth - 5, &HEEEEEE, &HEEEEEE) Call c.addText(endX, endY, "3", "arialbd.ttf", 20, colors(0), c.kCenter) Call d.circle(cX, cY, 40, 40, &HEEEEEE, &HEEEEEE) Call c.addText(cX, cY, "3", "arialbd.ttf", 40, colors(0), c.kCenter) Backdrop = c.makeChartPicture
20 02 16 - 00:10

Remember personal info?

Emoticons / Textile

 Notify: Yes, send me email when someone replies. Hide email: Yes, hide my email address.

Small print: All html tags except <b> and <i> will be removed from your comment. You can make links by just typing the url or mail-address.