With this simple code:
function onUpdate(dc) {
var width = dc.getWidth();
var height = dc.getHeight();
var backgroundColor = getBackgroundColor();
var valueColor = backgroundColor == Graphics.COLOR_WHITE ? Graphics.COLOR_BLACK : Graphics.COLOR_WHITE;
var labelColor = backgroundColor == Graphics.COLOR_WHITE ? Graphics.COLOR_DK_GRAY : Graphics.COLOR_LT_GRAY;
var valueSize = Graphics.FONT_NUMBER_HOT;
var labelSize = Graphics.FONT_TINY;
dc.setColor(backgroundColor, backgroundColor);
dc.fillRectangle(0, 0, width, height);
dc.setColor(Graphics.COLOR_BLACK, Graphics.COLOR_TRANSPARENT);
dc.drawText(width/2 , height/2, valueSize-1, "!", Graphics.TEXT_JUSTIFY_CENTER);
}
Both the simulator and the device (Vivoactive HR) produce this:

What is happening here? I've also tried "!".toString() instead of just passing "!"