diff --git a/examples/01-basic.html b/examples/01-basic.html
index 3fb6493..c68bb45 100644
--- a/examples/01-basic.html
+++ b/examples/01-basic.html
@@ -20,7 +20,7 @@
value: 10
},
{
- color: 'yellow',
+ color: 'orange',
value: 30
}
],
diff --git a/src/index.ts b/src/index.ts
index 8b88f11..b5e20d7 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -10,13 +10,13 @@ import * as _ from 'lodash';
const SPACE_BETWEEN_CIRCLES = 2;
const CIRCLES_ROUNDING = 0.15; //radians
-const BACKGROUND_COLOR = 'rgba(38, 38, 38, 0.2)';
+const BACKGROUND_COLOR = 'rgba(38, 38, 38, 0.1)';
const DEFAULT_INNER_RADIUS = 48;
const DEFAULT_OUTER_RADIUS = 72;
const STOPS_CIRCLE_WIDTH = 4;
-const VALUE_TEXT_FONT_SIZE = 14;
+const VALUE_TEXT_FONT_SIZE = 16;
const DEFAULT_VALUE_TEXT_Decimals = 2;
-const VALUE_TEXT_MARGIN = 16;
+const VALUE_TEXT_MARGIN = 10;
const DEFAULT_GAUGE_OPTIONS: GaugeOptions = {
usePanning: false,
@@ -195,12 +195,14 @@ export class ChartwerkGaugePod extends ChartwerkPod 10 && this._valueText.length <= 12) {
+ } else if(this._valueText.length > 6 && this._valueText.length <= 10) {
return VALUE_TEXT_FONT_SIZE - 2;
- } else {
+ } else if(this._valueText.length > 10 && this._valueText.length <= 12) {
return VALUE_TEXT_FONT_SIZE - 4;
+ } else {
+ return VALUE_TEXT_FONT_SIZE - 6;
}
}