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
