+ >
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
<slot name="optionImg" />
</template>
+ <template #optionSvg v-if="$slots.optionSvg">
+ <slot name="optionSvg" />
+ </template>
<template #optionTable v-if="$slots.optionTable">
<slot name="optionTable" />
</template>
@@ -766,13 +856,19 @@ function useTooltip(word, index) {
<slot name="chart-background"/>
</foreignObject>
- <g :transform="`translate(${cloudOrigin.x}, ${cloudOrigin.y})`">
- <g v-for="(word, index) in positionedWords">
+ <g :transform="`translate(${cloudOrigin.x}, ${cloudOrigin.y})`" :class="{ 'wc-finalized': cloudFinalized }">
+ <!-- One persistent group per word -->
+ <g
+ v-for="(word, index) in positionedWords"
+ :key="word.id"
+ class="vue-ui-word-cloud-word"
+ :transform="`translate(${word.x}, ${word.y})`"
+ >
<rect
v-if="word.minX !== undefined"
data-cy="datapoint-word"
- :x="word.x + word.minX"
- :y="word.y + (word.minY * 1.25)"
+ :x="word.minX"
+ :y="word.minY * 1.25"
:width="word.maxX - word.minX"
:height="word.maxY - word.minY"
fill="transparent"
@@ -784,12 +880,10 @@ function useTooltip(word, index) {
<text
:fill="word.color"
:font-weight="FINAL_CONFIG.style.chart.words.bold ? 'bold' : 'normal'"
- :key="index"
- :x="word.x"
- :y="word.y"
+ :x="0"
+ :y="0"
:font-size="word.fontSize"
:transform="`translate(${word.width / 2}, ${word.height / 2})`"
- :class="{ 'animated': FINAL_CONFIG.useCssAnimation && !loading }"
text-anchor="middle"
dominant-baseline="central"
paint-order="stroke fill"
@@ -798,10 +892,8 @@ function useTooltip(word, index) {
stroke-linecap="round"
stroke-linejoin="round"
:style="`
- animation-delay:${index * FINAL_CONFIG.animationDelayMs}ms !important;
pointer-events:none;
- fill-opacity:${(!selectedWord || selectedWord === word.id) ? 1 : FINAL_CONFIG.style.chart.words.hoverOpacity} !important;
- transition:fill-opacity 0.3s ease-in-out !important;
+ fill-opacity:${(!selectedWord || selectedWord === word.id || !cloudFinalized) ? 1 : FINAL_CONFIG.style.chart.words.hoverOpacity} !important;
`"
>
{{ word.name }}
@@ -906,19 +998,36 @@ function useTooltip(word, index) {
<style scoped lang="scss">
@import "../vue-data-ui.css";
+.vue-ui-word-cloud {
+ position: relative;
+}
+
+/* Don't animate everything by default */
.vue-ui-word-cloud * {
- transition: unset;
+ transition: none;
}
-.vue-ui-word-cloud {
- position: relative;
+/* This group moves when the algorithm updates x/y */
+.vue-ui-word-cloud-word {
+ will-change: transform;
+ transition: transform 0.25s ease-out;
+}
+
+/* SVG text stability */
+.vue-ui-word-cloud svg {
+ shape-rendering: geometricPrecision;
+ text-rendering: optimizeLegibility;
}
+.vue-ui-word-cloud text {
+ backface-visibility: hidden;
+}
+
+/* Neutralize any previous fade animation to avoid flicker */
text.animated {
- opacity:0;
+ opacity: 1;
user-select: none;
- animation: word-opacity 0.2s ease-in forwards;
- transform-origin: center;
+ animation: none !important;
}
@keyframes word-opacity {
@@ -962,4 +1071,14 @@ text.animated {
transform: rotate(-90deg)
}
}
-</style>
\ No newline at end of file
+
+.wc-finalized text {
+ transition: fill-opacity 0.25s ease-out;
+}
+
+.vue-ui-word-cloud[data-resizing="true"] .vue-ui-word-cloud-word,
+.vue-ui-word-cloud[data-relayout="true"] .vue-ui-word-cloud-word {
+ transition: none;
+}
+
+</style>
diff --git a/src/components/vue-ui-world.vue b/src/components/vue-ui-world.vue
index 968666a3..db30ddb9 100644
--- a/src/components/vue-ui-world.vue
+++ b/src/components/vue-ui-world.vue
@@ -800,7 +800,27 @@ defineExpose({
<PenAndPaper v-if="FINAL_CONFIG.userOptions.buttons.annotator && svgRef" :color="FINAL_CONFIG.style.chart.color"
:backgroundColor="FINAL_CONFIG.style.chart.backgroundColor" :active="isAnnotator" :svgRef="svgRef"
- @close="toggleAnnotator" />
+ @close="toggleAnnotator"
+ >
+ <template #annotator-action-close>
+ <slot name="annotator-action-close"/>
+ </template>
+ <template #annotator-action-color="{ color }">
+ <slot name="annotator-action-color" v-bind="{ color }"/>
+ </template>
+ <template #annotator-action-draw="{ mode }">
+ <slot name="annotator-action-draw" v-bind="{ mode }"/>
+ </template>
+ <template #annotator-action-undo="{ disabled }">
+ <slot name="annotator-action-undo" v-bind="{ disabled }"/>
+ </template>
+ <template #annotator-action-redo="{ disabled }">
+ <slot name="annotator-action-redo" v-bind="{ disabled }"/>
+ </template>
+ <template #annotator-action-delete="{ disabled }">
+ <slot name="annotator-action-delete" v-bind="{ disabled }"/>
+ </template>
+ </PenAndPaper>
<slot name="userConfig"></slot>
@@ -874,6 +894,9 @@ defineExpose({
<template #optionImg v-if="$slots.optionImg">
<slot name="optionImg" />
</template>
+ <template #optionSvg v-if="$slots.optionSvg">
+ <slot name="optionSvg" />
+ </template>
<template #optionTable v-if="$slots.optionTable">
<slot name="optionTable" />
</template>
diff --git a/src/components/vue-ui-xy-canvas.vue b/src/components/vue-ui-xy-canvas.vue
index 2344fdf0..1fe7fab2 100644
--- a/src/components/vue-ui-xy-canvas.vue
+++ b/src/components/vue-ui-xy-canvas.vue
@@ -51,10 +51,11 @@ import { useDateTime } from "../useDateTime";
import { useNestedProp } from "../useNestedProp";
import { useResponsive } from "../useResponsive";
import { useTimeLabels } from "../useTimeLabels";
+import { useThemeCheck } from "../useThemeCheck";
import { useUserOptionState } from "../useUserOptionState";
import { useChartAccessibility } from "../useChartAccessibility";
import img from "../img";
-import themes from "../themes.json";
+import themes from "../themes/vue_ui_xy_canvas.json";
import locales from '../locales/locales.json';
import Legend from "../atoms/Legend.vue"; // Must be ready in responsive mode
import Title from "../atoms/Title.vue"; // Must be ready in responsive mode
@@ -70,6 +71,7 @@ const NonSvgPenAndPaper = defineAsyncComponent(() => import('../atoms/NonSvgPenA
const BaseDraggableDialog = defineAsyncComponent(() => import('../atoms/BaseDraggableDialog.vue'));
const { vue_ui_xy_canvas: DEFAULT_CONFIG } = useConfig();
+const { isThemeValid, warnInvalidTheme } = useThemeCheck();
const props = defineProps({
dataset: {
@@ -219,13 +221,25 @@ function prepareConfig() {
let finalConfig = {};
- if (mergedConfig.theme) {
- finalConfig = {
- ...useNestedProp({
- userConfig: themes.vue_ui_xy_canvas[mergedConfig.theme] || props.config,
+ const theme = mergedConfig.theme;
+
+ if (theme) {
+ if (!isThemeValid.value(mergedConfig)) {
+ warnInvalidTheme(mergedConfig);
+ finalConfig = mergedConfig;
+ } else {
+ const fused = useNestedProp({
+ userConfig: themes[theme] || props.config,
defaultConfig: mergedConfig
- }),
- customPalette: themePalettes[mergedConfig.theme] || palette
+ });
+
+ finalConfig = {
+ ...useNestedProp({
+ userConfig: props.config,
+ defaultConfig: fused
+ }),
+ customPalette: mergedConfig.customPalette.length ? mergedConfig.customPalette : themePalettes[theme] || palette
+ }
}
} else {
finalConfig = mergedConfig;
@@ -1850,6 +1864,39 @@ function segregate(index) {
debounceCanvasResize();
}
+function validSeriesToToggle(name) {
+ if (!dsCopy.value.length) {
+ if (FINAL_CONFIG.value.debug) {
+ console.warn('VueUiXyCanvas - There are no series to show.');
+ }
+ return null;
+ }
+ const dp = dsCopy.value.find(d => d.name === name);
+ if (!dp) {
+ if (FINAL_CONFIG.value.debug) {
+ console.warn(`VueUiXyCanvas - Series name not found "${name}"`);
+ }
+ return null;
+ }
+ return dp;
+}
+
+function showSeries(name) {
+ const dp = validSeriesToToggle(name);
+ if (dp === null) return;
+ if (segregated.value.includes(dp.absoluteIndex)) {
+ segregate(dp.absoluteIndex);
+ }
+}
+
+function hideSeries(name) {
+ const dp = validSeriesToToggle(name);
+ if (dp === null) return;
+ if (!segregated.value.includes(dp.absoluteIndex)) {
+ segregate(dp.absoluteIndex);
+ }
+}
+
const legendSet = computed(() => {
return dsCopy.value.map((ds, i) => {
return {
@@ -2048,6 +2095,8 @@ defineExpose({
generateCsv,
generatePdf,
generateImage,
+ hideSeries,
+ showSeries,
toggleTable,
toggleLabels,
toggleStack,
diff --git a/src/components/vue-ui-xy.vue b/src/components/vue-ui-xy.vue
index c7bce320..e10ca7fd 100644
--- a/src/components/vue-ui-xy.vue
+++ b/src/components/vue-ui-xy.vue
@@ -63,11 +63,12 @@ import { useLoading } from '../useLoading.js';
import { useDateTime } from '../useDateTime.js';
import { useSvgExport } from '../useSvgExport.js';
import { useNestedProp } from '../useNestedProp';
+import { useThemeCheck } from '../useThemeCheck.js';
import { useTimeLabels } from '../useTimeLabels.js';
import { useTimeLabelCollision } from '../useTimeLabelCollider.js';
import img from '../img.js';
import Title from '../atoms/Title.vue';
-import themes from "../themes.json";
+import themes from "../themes/vue_ui_xy.json";
import Shape from '../atoms/Shape.vue';
import BaseScanner from '../atoms/BaseScanner.vue';
import SlicerPreview from '../atoms/SlicerPreview.vue'; // v3
@@ -105,7 +106,9 @@ const BaseDraggableDialog = defineAsyncComponent(() => import('../atoms/BaseDrag
const emit = defineEmits(['selectTimeLabel', 'selectX', 'selectLegend']);
const SLOTS = useSlots();
const instance = getCurrentInstance();
+
const { vue_ui_xy: DEFAULT_CONFIG } = useConfig();
+const { isThemeValid, warnInvalidTheme } = useThemeCheck();
const chart = ref(null);
const chartTitle = ref(null);
@@ -306,16 +309,27 @@ function prepareConfig() {
}
// ----------------------------------------------------------------------------
- if (mergedConfig.theme) {
- return {
- ...useNestedProp({
- userConfig: themes.vue_ui_xy[mergedConfig.theme] || props.config,
- defaultConfig: mergedConfig
- }),
- customPalette: themePalettes[mergedConfig.theme] || props.palette
- }
- } else {
- return mergedConfig
+ const theme = mergedConfig.theme;
+ if (!theme) return mergedConfig;
+
+ if (!isThemeValid.value(mergedConfig)) {
+ warnInvalidTheme(mergedConfig);
+ return mergedConfig;
+ }
+
+ const fused = useNestedProp({
+ userConfig: themes[theme] || props.config,
+ defaultConfig: mergedConfig
+ });
+
+ const finalConfig = useNestedProp({
+ userConfig: props.config,
+ defaultConfig: fused
+ });
+
+ return {
+ ...finalConfig,
+ customPalette: finalConfig.customPalette.length ? finalConfig.customPalette : themePalettes[theme] || palette
}
}
@@ -724,18 +738,18 @@ const drawingArea = computed(() => {
}
}
- const _width = width.value - _scaleLabelX - FINAL_CONFIG.value.chart.grid.labels.yAxis.crosshairSize - progressionLabelOffsetX - FINAL_CONFIG.value.chart.padding.left - FINAL_CONFIG.value.chart.padding.right;
+ const _width = width.value - _scaleLabelX - FINAL_CONFIG.value.chart.grid.labels.yAxis.crosshairSize - progressionLabelOffsetX - FINAL_CONFIG.value.chart.padding?.left - FINAL_CONFIG.value.chart.padding?.right;
const xPadding = FINAL_CONFIG.value.chart.grid.position === 'middle' ? 0 : _width / maxSeries.value / 2;
return {
- top: FINAL_CONFIG.value.chart.padding.top + topOffset,
- right: width.value - progressionLabelOffsetX - FINAL_CONFIG.value.chart.padding.right,
- bottom: height.value - timeLabelsY.value - FINAL_CONFIG.value.chart.padding.bottom - FINAL_CONFIG.value.chart.grid.labels.axis.xLabelOffsetY,
- left: _scaleLabelX + FINAL_CONFIG.value.chart.grid.labels.yAxis.crosshairSize - xPadding + FINAL_CONFIG.value.chart.padding.left,
- height: height.value - timeLabelsY.value - FINAL_CONFIG.value.chart.padding.top -FINAL_CONFIG.value.chart.padding.bottom - topOffset - FINAL_CONFIG.value.chart.grid.labels.axis.xLabelOffsetY,
+ top: FINAL_CONFIG.value.chart.padding?.top + topOffset,
+ right: width.value - progressionLabelOffsetX - FINAL_CONFIG.value.chart.padding?.right,
+ bottom: height.value - timeLabelsY.value - FINAL_CONFIG.value.chart.padding?.bottom - FINAL_CONFIG.value.chart.grid.labels.axis.xLabelOffsetY,
+ left: _scaleLabelX + FINAL_CONFIG.value.chart.grid.labels.yAxis.crosshairSize - xPadding + FINAL_CONFIG.value.chart.padding?.left,
+ height: height.value - timeLabelsY.value - FINAL_CONFIG.value.chart.padding?.top -FINAL_CONFIG.value.chart.padding?.bottom - topOffset - FINAL_CONFIG.value.chart.grid.labels.axis.xLabelOffsetY,
width: _width,
scaleLabelX: _scaleLabelX,
individualOffsetX
@@ -746,12 +760,12 @@ const gridVerticalLines = computed(() => {
const extra = FINAL_CONFIG.value.chart.grid.position === 'middle' ? 1 : 0
const count = maxSeries.value + extra
- const topY = forceValidValue(drawingArea.value.top)
- const bottomY = forceValidValue(drawingArea.value.bottom)
+ const topY = forceValidValue(drawingArea.value?.top)
+ const bottomY = forceValidValue(drawingArea.value?.bottom)
return Array.from({ length: count })
.map((_, i) => {
- const x = (drawingArea.value.width / maxSeries.value) * i + drawingArea.value.left + xPadding.value
+ const x = (drawingArea.value.width / maxSeries.value) * i + drawingArea.value?.left + xPadding.value
return `M${x},${topY} L${x},${bottomY}`
})
.join(' ')
@@ -768,13 +782,13 @@ const crosshairsX = computed(() => {
.map((label, i) => {
if (!label || !label.text) return null;
- const x = drawingArea.value.left + segmentWidth * i + segmentWidth / 2;
+ const x = drawingArea.value?.left + segmentWidth * i + segmentWidth / 2;
const y1 = alwaysAtZero
- ? zero.value - (zero.value === drawingArea.value.bottom ? 0 : size / 2)
- : drawingArea.value.bottom;
+ ? zero.value - (zero.value === drawingArea.value?.bottom ? 0 : size / 2)
+ : drawingArea.value?.bottom;
const y2 = alwaysAtZero
- ? zero.value + (size / (zero.value === drawingArea.value.bottom ? 1 : 2))
- : drawingArea.value.bottom + size;
+ ? zero.value + (size / (zero.value === drawingArea.value?.bottom ? 1 : 2))
+ : drawingArea.value?.bottom + size;
return `M${x},${y1} L${x},${y2}`;
})
@@ -1005,14 +1019,14 @@ function ratioToMax(v) {
const zero = computed(() => {
if (isNaN(ratioToMax(relativeZero.value))) {
- return drawingArea.value.bottom;
+ return drawingArea.value?.bottom;
} else {
- return drawingArea.value.bottom - (drawingArea.value.height * ratioToMax(relativeZero.value));
+ return drawingArea.value?.bottom - (drawingArea.value.height * ratioToMax(relativeZero.value));
}
});
function calcRectHeight(plot) {
- const zeroForPositiveValuesOnly = ![null, undefined].includes(FINAL_CONFIG.value.chart.grid.labels.yAxis.scaleMin) && FINAL_CONFIG.value.chart.grid.labels.yAxis.scaleMin > 0 && min.value >= 0 ? drawingArea.value.bottom : zero.value;
+ const zeroForPositiveValuesOnly = ![null, undefined].includes(FINAL_CONFIG.value.chart.grid.labels.yAxis.scaleMin) && FINAL_CONFIG.value.chart.grid.labels.yAxis.scaleMin > 0 && min.value >= 0 ? drawingArea.value?.bottom : zero.value;
if (plot.value >= 0) {
return checkNaN(zeroForPositiveValuesOnly - plot.y <= 0 ? 0.00001 : zeroForPositiveValuesOnly - plot.y);
@@ -1056,7 +1070,7 @@ function calcRectX(plot) {
function calcRectY(plot) {
if (plot.value >= 0) return plot.y;
- return [null, undefined, NaN, Infinity, -Infinity].includes(zero.value) ? drawingArea.bottom.value : zero.value;
+ return [null, undefined, NaN, Infinity, -Infinity].includes(zero.value) ? drawingArea?.bottom.value : zero.value;
}
function calcIndividualRectY(plot) {
@@ -1090,8 +1104,8 @@ function clientToSvgCoords(evt) {
const drawnH = vb.height * scale;
const offsetX = (rect.width - drawnW) / 2;
const offsetY = (rect.height - drawnH) / 2;
- const x = (evt.clientX - rect.left - offsetX) / scale + vb.x;
- const y = (evt.clientY - rect.top - offsetY) / scale + vb.y;
+ const x = (evt.clientX - rect?.left - offsetX) / scale + vb.x;
+ const y = (evt.clientY - rect?.top - offsetY) / scale + vb.y;
return { x, y, ok: true };
}
@@ -1233,6 +1247,39 @@ function segregate(legendItem) {
segregateStep.value += 1;
}
+function validSeriesToToggle(name) {
+ if (!absoluteDataset.value.length) {
+ if (FINAL_CONFIG.value.debug) {
+ console.warn('VueUiXy - There are no series to show.');
+ }
+ return null;
+ }
+ const dp = absoluteDataset.value.find(d => d.name === name);
+ if (!dp) {
+ if (FINAL_CONFIG.value.debug) {
+ console.warn(`VueUiXy - Series name not found "${name}"`);
+ }
+ return null;
+ }
+ return dp;
+}
+
+function showSeries(name) {
+ const dp = validSeriesToToggle(name);
+ if (dp === null) return;
+ if (segregatedSeries.value.includes(dp.id)) {
+ segregate({ id : dp.id });
+ }
+}
+
+function hideSeries(name) {
+ const dp = validSeriesToToggle(name);
+ if (dp === null) return;
+ if (!segregatedSeries.value.includes(dp.id)) {
+ segregate({ id: dp.id });
+ }
+}
+
const chartAriaLabel = computed(() => {
const titleText = FINAL_CONFIG.value.chart.title.text || 'Chart visualization';
const subtitleText = FINAL_CONFIG.value.chart.title.subtitle.text || '';
@@ -1442,24 +1489,24 @@ const annotationsY = computed(() => {
const textWidth = ctx.measureText(label.text).width;
const textHeight = label.fontSize;
- const xText = (label.position === 'start' ? left + label.padding.left : right - label.padding.right) + label.offsetX;
+ const xText = (label.position === 'start' ? left + label.padding?.left : right - label.padding?.right) + label.offsetX;
const baselineY = (yTop != null && yBottom != null)
? Math.min(yTop, yBottom)
: (yTop != null ? yTop : yBottom);
- const yText = baselineY - (label.fontSize / 3) + label.offsetY - label.padding.top;
+ const yText = baselineY - (label.fontSize / 3) + label.offsetY - label.padding?.top;
let rectX;
if (label.textAnchor === 'middle') {
- rectX = xText - (textWidth / 2) - label.padding.left;
+ rectX = xText - (textWidth / 2) - label.padding?.left;
} else if (label.textAnchor === 'end') {
- rectX = xText - textWidth - label.padding.right;
+ rectX = xText - textWidth - label.padding?.right;
} else {
- rectX = xText - label.padding.left;
+ rectX = xText - label.padding?.left;
}
- const rectY = yText - (textHeight * 0.75) - label.padding.top;
+ const rectY = yText - (textHeight * 0.75) - label.padding?.top;
const show = ![yTop, yBottom, rectY].includes(NaN);
return {
@@ -1476,8 +1523,8 @@ const annotationsY = computed(() => {
_box: {
x: rectX,
y: rectY,
- width: textWidth + label.padding.left + label.padding.right,
- height: textHeight + label.padding.top + label.padding.bottom,
+ width: textWidth + label.padding?.left + label.padding?.right,
+ height: textHeight + label.padding?.top + label.padding?.bottom,
fill: label.backgroundColor,
stroke: label.border.stroke,
rx: label.border.rx,
@@ -1548,16 +1595,16 @@ const barSet = computed(() => {
const yOffset = stacked ? usableHeight * flippedLowerRatio + gap * flippedIdx : 0;
const individualHeight = stacked ? usableHeight * datapoint.stackRatio : drawingArea.value.height;
- const zeroPosition = drawingArea.value.bottom - yOffset - ((individualHeight) * individualZero / individualMax);
- const autoScaleZeroPosition = drawingArea.value.bottom - yOffset - (individualHeight * autoScaleZero / autoScaleMax);
+ const zeroPosition = drawingArea.value?.bottom - yOffset - ((individualHeight) * individualZero / individualMax);
+ const autoScaleZeroPosition = drawingArea.value?.bottom - yOffset - (individualHeight * autoScaleZero / autoScaleMax);
const barLen = absoluteDataset.value.filter(ds => ds.type === 'bar').filter(s => !segregatedSeries.value.includes(s.id)).length;
const plots = datapoint.series.map((plot, j) => {
const yRatio = mutableConfig.value.useIndividualScale ? ((datapoint.absoluteValues[j] + individualZero) / individualMax) : ratioToMax(plot)
const x = mutableConfig.value.useIndividualScale && mutableConfig.value.isStacked
- ? drawingArea.value.left + (drawingArea.value.width / maxSeries.value * j)
- : drawingArea.value.left
+ ? drawingArea.value?.left + (drawingArea.value.width / maxSeries.value * j)
+ : drawingArea.value?.left
+ (slot.value.bar * i)
+ (slot.value.bar * j * barLen)
- (barSlot.value / 2)
@@ -1568,7 +1615,7 @@ const barSet = computed(() => {
yOffset: checkNaN(yOffset),
individualHeight: checkNaN(individualHeight),
x: checkNaN(x),
- y: drawingArea.value.bottom - yOffset - (individualHeight * yRatio),
+ y: drawingArea.value?.bottom - yOffset - (individualHeight * yRatio),
value: datapoint.absoluteValues[j],
zeroPosition: checkNaN(zeroPosition),
individualMax: checkNaN(individualMax),
@@ -1586,13 +1633,13 @@ const barSet = computed(() => {
const autoScalePlots = datapoint.series.map((_, j) => {
const x = mutableConfig.value.useIndividualScale && mutableConfig.value.isStacked
- ? drawingArea.value.left + (drawingArea.value.width / maxSeries.value * j)
- : (drawingArea.value.left - slot.value.bar / 2 + slot.value.bar * i) + (slot.value.bar * j * absoluteDataset.value.filter(ds => ds.type === 'bar').filter(s => !segregatedSeries.value.includes(s.id)).length);
+ ? drawingArea.value?.left + (drawingArea.value.width / maxSeries.value * j)
+ : (drawingArea.value?.left - slot.value.bar / 2 + slot.value.bar * i) + (slot.value.bar * j * absoluteDataset.value.filter(ds => ds.type === 'bar').filter(s => !segregatedSeries.value.includes(s.id)).length);
return {
yOffset: checkNaN(yOffset),
individualHeight: checkNaN(individualHeight),
x: checkNaN(x),
- y: checkNaN(drawingArea.value.bottom - checkNaN(yOffset) - ((checkNaN(individualHeight) * autoScaleRatiosToNiceScale[j]) || 0)),
+ y: checkNaN(drawingArea.value?.bottom - checkNaN(yOffset) - ((checkNaN(individualHeight) * autoScaleRatiosToNiceScale[j]) || 0)),
value: datapoint.absoluteValues[j],
zeroPosition: checkNaN(zeroPosition),
individualMax: checkNaN(individualMax),
@@ -1699,9 +1746,9 @@ const lineSet = computed(() => {
const yOffset = stacked ? usableHeight * flippedLowerRatio + gap * flippedIdx : 0;
const individualHeight = stacked ? usableHeight * datapoint.stackRatio : drawingArea.value.height;
- const zeroPosition = drawingArea.value.bottom - yOffset - ((individualHeight) * individualZero / individualMax);
+ const zeroPosition = drawingArea.value?.bottom - yOffset - ((individualHeight) * individualZero / individualMax);
- const autoScaleZeroPosition = drawingArea.value.bottom - yOffset - (individualHeight * autoScaleZero / autoScaleMax);
+ const autoScaleZeroPosition = drawingArea.value?.bottom - yOffset - (individualHeight * autoScaleZero / autoScaleMax);
const plots = datapoint.series.map((plot, j) => {
const yRatio = mutableConfig.value.useIndividualScale
@@ -1709,8 +1756,8 @@ const lineSet = computed(() => {
: ratioToMax(plot)
return {
- x: checkNaN((drawingArea.value.left + (slot.value.line / 2)) + (slot.value.line * j)),
- y: checkNaN(drawingArea.value.bottom - yOffset - (individualHeight * yRatio)),
+ x: checkNaN((drawingArea.value?.left + (slot.value.line / 2)) + (slot.value.line * j)),
+ y: checkNaN(drawingArea.value?.bottom - yOffset - (individualHeight * yRatio)),
value: datapoint.absoluteValues[j],
comment: datapoint.comments ? datapoint.comments.slice(slicer.value.start, slicer.value.end)[j] || '' : ''
}
@@ -1727,14 +1774,14 @@ const lineSet = computed(() => {
const autoScalePlots = datapoint.series.map((_, j) => {
if (![undefined, null].includes(datapoint.absoluteValues[j])) {
return {
- x: checkNaN((drawingArea.value.left + (slot.value.line / 2)) + (slot.value.line * j)),
- y: checkNaN(drawingArea.value.bottom - yOffset - ((individualHeight * autoScaleRatiosToNiceScale[j]) || 0)),
+ x: checkNaN((drawingArea.value?.left + (slot.value.line / 2)) + (slot.value.line * j)),
+ y: checkNaN(drawingArea.value?.bottom - yOffset - ((individualHeight * autoScaleRatiosToNiceScale[j]) || 0)),
value: datapoint.absoluteValues[j],
comment: datapoint.comments ? datapoint.comments.slice(slicer.value.start, slicer.value.end)[j] || '' : ''
}
} else {
return {
- x: checkNaN((drawingArea.value.left + (slot.value.line / 2)) + (slot.value.line * j)),
+ x: checkNaN((drawingArea.value?.left + (slot.value.line / 2)) + (slot.value.line * j)),
y: zeroPosition,
value: datapoint.absoluteValues[j],
comment: datapoint.comments ? datapoint.comments.slice(slicer.value.start, slicer.value.end)[j] || '' : ''
@@ -1794,7 +1841,7 @@ const lineSet = computed(() => {
scaleGroups.value[datapoint.scaleLabel].unique = activeSeriesWithStackRatios.value.filter(el => el.scaleLabel === datapoint.scaleLabel).length === 1
const areaZeroPosition = mutableConfig.value.useIndividualScale ? datapoint.autoScaling ? autoScaleZeroPosition : zeroPosition : zero.value;
- const adustedAreaZeroPosition = Math.max(Math.max(datapoint.autoScaling ? autoScaleZeroPosition : (scaleYLabels.at(-1) ? scaleYLabels.at(-1).y : 0), drawingArea.value.top), areaZeroPosition);
+ const adustedAreaZeroPosition = Math.max(Math.max(datapoint.autoScaling ? autoScaleZeroPosition : (scaleYLabels.at(-1) ? scaleYLabels.at(-1).y : 0), drawingArea.value?.top), areaZeroPosition);
return {
...datapoint,
@@ -1888,14 +1935,14 @@ const plotSet = computed(() => {
const yOffset = stacked ? usableHeight * flippedLowerRatio + gap * flippedIdx : 0;
const individualHeight = stacked ? usableHeight * datapoint.stackRatio : drawingArea.value.height;
- const zeroPosition = drawingArea.value.bottom - yOffset - ((individualHeight) * individualZero / individualMax);
- const autoScaleZeroPosition = drawingArea.value.bottom - yOffset - (individualHeight * autoScaleZero / autoScaleMax);
+ const zeroPosition = drawingArea.value?.bottom - yOffset - ((individualHeight) * individualZero / individualMax);
+ const autoScaleZeroPosition = drawingArea.value?.bottom - yOffset - (individualHeight * autoScaleZero / autoScaleMax);
const plots = datapoint.series.map((plot, j) => {
const yRatio = mutableConfig.value.useIndividualScale ? ((datapoint.absoluteValues[j] + Math.abs(individualZero)) / individualMax) : ratioToMax(plot)
return {
- x: checkNaN((drawingArea.value.left + (slot.value.plot / 2)) + (slot.value.plot * j)),
- y: checkNaN(drawingArea.value.bottom - yOffset - (individualHeight * yRatio)),
+ x: checkNaN((drawingArea.value?.left + (slot.value.plot / 2)) + (slot.value.plot * j)),
+ y: checkNaN(drawingArea.value?.bottom - yOffset - (individualHeight * yRatio)),
value: datapoint.absoluteValues[j],
comment: datapoint.comments ? datapoint.comments.slice(slicer.value.start, slicer.value.end)[j] || '' : ''
}
@@ -1911,8 +1958,8 @@ const plotSet = computed(() => {
const autoScalePlots = datapoint.series.map((_, j) => {
return {
- x: checkNaN((drawingArea.value.left + (slot.value.plot / 2)) + (slot.value.plot * j)),
- y: checkNaN(drawingArea.value.bottom - yOffset - ((individualHeight * autoScaleRatiosToNiceScale[j]) || 0)),
+ x: checkNaN((drawingArea.value?.left + (slot.value.plot / 2)) + (slot.value.plot * j)),
+ y: checkNaN(drawingArea.value?.bottom - yOffset - ((individualHeight * autoScaleRatiosToNiceScale[j]) || 0)),
value: datapoint.absoluteValues[j],
comment: datapoint.comments ? datapoint.comments.slice(slicer.value.start, slicer.value.end)[j] || '' : ''
}
@@ -2020,7 +2067,7 @@ const allScales = computed(() => {
return _source.flatMap((el, i) => {
let x = 0;
- x = mutableConfig.value.isStacked ? drawingArea.value.left : drawingArea.value.left / len * (i + 1);
+ x = mutableConfig.value.isStacked ? drawingArea.value?.left : drawingArea.value?.left / len * (i + 1);
const name = (mutableConfig.value.useIndividualScale && !mutableConfig.value.isStacked) ? el.unique ? el.name : el.groupName : el.name
@@ -2657,10 +2704,10 @@ function timeTagX() {
const W_FO = 200;
const sectionsX = Math.max(1, maxSeries.value);
const sectionX = drawingArea.value.width / sectionsX;
- const centerX = drawingArea.value.left + activeIndex.value * sectionX + sectionX / 2;
+ const centerX = drawingArea.value?.left + activeIndex.value * sectionX + sectionX / 2;
const desiredX = centerX - w / 2 - (W_FO - w) / 2;
- const minX = drawingArea.value.left - (W_FO - w) / 2;
- const _maxX = drawingArea.value.right - (W_FO + w) / 2;
+ const minX = drawingArea.value?.left - (W_FO - w) / 2;
+ const _maxX = drawingArea.value?.right - (W_FO + w) / 2;
const clamped = Math.max(minX, Math.min(desiredX, _maxX));
return checkNaN(clamped);
}
@@ -2909,6 +2956,8 @@ defineExpose({
generateImage,
generateSvg,
generateCsv,
+ hideSeries,
+ showSeries,
toggleStack,
toggleTable,
toggleLabels,
@@ -2926,7 +2975,26 @@ defineExpose({
@mouseenter="() => setUserOptionsVisibility(true)" @mouseleave="() => setUserOptionsVisibility(false)" @click="onSvgClick">
<PenAndPaper v-if="FINAL_CONFIG.chart.userOptions.buttons.annotator && svgRef" :svgRef="svgRef"
:backgroundColor="FINAL_CONFIG.chart.backgroundColor" :color="FINAL_CONFIG.chart.color"
- :active="isAnnotator" @close="toggleAnnotator" />
+ :active="isAnnotator" @close="toggleAnnotator">
+ <template #annotator-action-close>
+ <slot name="annotator-action-close"/>
+ </template>
+ <template #annotator-action-color="{ color }">
+ <slot name="annotator-action-color" v-bind="{ color }"/>
+ </template>
+ <template #annotator-action-draw="{ mode }">
+ <slot name="annotator-action-draw" v-bind="{ mode }"/>
+ </template>
+ <template #annotator-action-undo="{ disabled }">
+ <slot name="annotator-action-undo" v-bind="{ disabled }"/>
+ </template>
+ <template #annotator-action-redo="{ disabled }">
+ <slot name="annotator-action-redo" v-bind="{ disabled }"/>
+ </template>
+ <template #annotator-action-delete="{ disabled }">
+ <slot name="annotator-action-delete" v-bind="{ disabled }"/>
+ </template>
+ </PenAndPaper>
<div ref="noTitle" v-if="hasOptionsNoTitle" class="vue-data-ui-no-title-space"
:style="`height:36px; width: 100%; background:transparent`" />
@@ -2986,14 +3054,17 @@ defineExpose({
<template #optionImg v-if="$slots.optionImg">
<slot name="optionImg" />
</template>
+ <template #optionSvg v-if="$slots.optionSvg">
+ <slot name="optionSvg" />
+ </template>
<template #optionTable v-if="$slots.optionTable">
<slot name="optionTable" />
</template>
<template #optionLabels v-if="$slots.optionLabels">
<slot name="optionLabels" />
</template>
- <template #optionStack v-if="$slots.optionStack">
- <slot name="optionStack" />
+ <template #optionStack="{ isStack }" v-if="$slots.optionStack">
+ <slot name="optionStack" v-bind="{ isStack }" />
</template>
<template v-if="$slots.optionFullscreen" template #optionFullscreen="{ toggleFullscreen, isFullscreen }">
<slot name="optionFullscreen" v-bind="{ toggleFullscreen, isFullscreen }" />
@@ -3026,7 +3097,7 @@ defineExpose({
<!-- BACKGROUND SLOT -->
<foreignObject v-if="$slots['chart-background']"
- :x="(drawingArea.left + xPadding) < 0 ? 0 : drawingArea.left + xPadding" :y="drawingArea.top"
+ :x="(drawingArea?.left + xPadding) < 0 ? 0 : drawingArea?.left + xPadding" :y="drawingArea?.top"
:width="(drawingArea.width - (FINAL_CONFIG.chart.grid.position === 'middle' ? 0 : drawingArea.width / maxSeries)) < 0 ? 0 : drawingArea.width - (FINAL_CONFIG.chart.grid.position === 'middle' ? 0 : drawingArea.width / maxSeries)"
:height="drawingArea.height < 0 ? 0 : drawingArea.height" :style="{
pointerEvents: 'none'
@@ -3042,22 +3113,22 @@ defineExpose({
data-cy="xy-grid-line-x"
:stroke="FINAL_CONFIG.chart.grid.stroke"
stroke-width="1"
- :x1="drawingArea.left + xPadding"
- :x2="drawingArea.right - xPadding"
- :y1="forceValidValue(drawingArea.bottom)"
- :y2="forceValidValue(drawingArea.bottom)"
+ :x1="drawingArea?.left + xPadding"
+ :x2="drawingArea?.right - xPadding"
+ :y1="forceValidValue(drawingArea?.bottom)"
+ :y2="forceValidValue(drawingArea?.bottom)"
stroke-linecap="round"
:style="{ animation: 'none !important' }"
/>
<template v-if="!mutableConfig.useIndividualScale">
<line v-if="FINAL_CONFIG.chart.grid.labels.yAxis.showBaseline" data-cy="xy-grid-line-y"
:stroke="FINAL_CONFIG.chart.grid.stroke" stroke-width="1"
- :x1="drawingArea.left + xPadding" :x2="drawingArea.left + xPadding"
- :y1="forceValidValue(drawingArea.top)" :y2="forceValidValue(drawingArea.bottom)"
+ :x1="drawingArea?.left + xPadding" :x2="drawingArea?.left + xPadding"
+ :y1="forceValidValue(drawingArea?.top)" :y2="forceValidValue(drawingArea?.bottom)"
stroke-linecap="round" :style="{ animation: 'none !important' }" />
<g v-if="FINAL_CONFIG.chart.grid.showHorizontalLines">
<line data-cy="xy-grid-horizontal-line" v-for="l in yLabels"
- :x1="drawingArea.left + xPadding" :x2="drawingArea.right"
+ :x1="drawingArea?.left + xPadding" :x2="drawingArea?.right"
:y1="forceValidValue(l.y)" :y2="forceValidValue(l.y)"
:stroke="FINAL_CONFIG.chart.grid.stroke" :stroke-width="0.5" stroke-linecap="round"
:style="{ animation: 'none !important' }" />
@@ -3066,14 +3137,14 @@ defineExpose({
<template v-else-if="FINAL_CONFIG.chart.grid.showHorizontalLines">
<g v-for="grid in allScales">
<template v-if="grid.id === selectedScale && grid.yLabels.length">
- <line v-for="l in grid.yLabels" :x1="drawingArea.left + xPadding"
- :x2="drawingArea.right - xPadding" :y1="forceValidValue(l.y)"
+ <line v-for="l in grid.yLabels" :x1="drawingArea?.left + xPadding"
+ :x2="drawingArea?.right - xPadding" :y1="forceValidValue(l.y)"
:y2="forceValidValue(l.y)" :stroke="grid.color" :stroke-width="0.5"
stroke-linecap="round" :style="{ animation: 'none !important' }" />
</template>
<template v-else-if="grid.yLabels.length">
- <line v-for="l in grid.yLabels" :x1="drawingArea.left + xPadding"
- :x2="drawingArea.right - xPadding" :y1="forceValidValue(l.y)"
+ <line v-for="l in grid.yLabels" :x1="drawingArea?.left + xPadding"
+ :x2="drawingArea?.right - xPadding" :y1="forceValidValue(l.y)"
:y2="forceValidValue(l.y)" :stroke="FINAL_CONFIG.chart.grid.stroke"
:stroke-width="0.5" stroke-linecap="round"
:style="{ animation: 'none !important' }" />
@@ -3151,16 +3222,16 @@ defineExpose({
transition: 'none',
opacity: (oneArea.from + i >= slicer.start && (oneArea.from + i <= slicer.end - 1)) ? 1 : 0
}"
- :x="drawingArea.left + (drawingArea.width / maxSeries) * ((oneArea.from + i) - slicer.start)"
- :y="drawingArea.top" :height="drawingArea.height < 0 ? 10 : drawingArea.height"
+ :x="drawingArea?.left + (drawingArea.width / maxSeries) * ((oneArea.from + i) - slicer.start)"
+ :y="drawingArea?.top" :height="drawingArea.height < 0 ? 10 : drawingArea.height"
:width="drawingArea.width / maxSeries < 0 ? 0.00001 : drawingArea.width / maxSeries"
:fill="setOpacity(oneArea.color, oneArea.opacity)" />
</g>
<!-- HIGHLIGHT AREA CAPTION -->
<g v-for="(_, i) in oneArea.span">
<foreignObject v-if="oneArea.caption.text && i === 0"
- :x="drawingArea.left + (drawingArea.width / maxSeries) * ((oneArea.from + i) - slicer.start) - (oneArea.caption.width === 'auto' ? 0 : oneArea.caption.width / 2 - (drawingArea.width / maxSeries) * oneArea.span / 2)"
- :y="drawingArea.top + oneArea.caption.offsetY" :style="{
+ :x="drawingArea?.left + (drawingArea.width / maxSeries) * ((oneArea.from + i) - slicer.start) - (oneArea.caption.width === 'auto' ? 0 : oneArea.caption.width / 2 - (drawingArea.width / maxSeries) * oneArea.span / 2)"
+ :y="drawingArea?.top + oneArea.caption.offsetY" :style="{
overflow: 'visible',
opacity: (oneArea.to >= slicer.start && oneArea.from < slicer.end) ? 1 : 0
}" height="1"
@@ -3177,8 +3248,8 @@ defineExpose({
<!-- HIGHLIGHTERS -->
<g v-if="userHovers">
<g v-for="(_, i) in maxSeries" :key="`tooltip_trap_highlighter_${i}`">
- <rect data-cy="highlighter" :x="drawingArea.left + (drawingArea.width / maxSeries) * i"
- :y="drawingArea.top" :height="drawingArea.height < 0 ? 10 : drawingArea.height"
+ <rect data-cy="highlighter" :x="drawingArea?.left + (drawingArea.width / maxSeries) * i"
+ :y="drawingArea?.top" :height="drawingArea.height < 0 ? 10 : drawingArea.height"
:width="drawingArea.width / maxSeries < 0 ? 0.00001 : drawingArea.width / maxSeries"
:fill="[selectedMinimapIndex, selectedSerieIndex, selectedRowIndex].includes(i) ? setOpacity(FINAL_CONFIG.chart.highlighter.color, FINAL_CONFIG.chart.highlighter.opacity) : 'transparent'"
:style="{ transition: 'none !important', animation: 'none !important' }"
@@ -3235,7 +3306,7 @@ defineExpose({
<!-- ZERO LINE (AFTER BAR DATASETS, BEFORE LABELS) -->
<template v-if="!mutableConfig.useIndividualScale && FINAL_CONFIG.chart.grid.labels.zeroLine.show">
<line data-cy="xy-grid-line-x" :stroke="FINAL_CONFIG.chart.grid.stroke" stroke-width="1"
- :x1="drawingArea.left + xPadding" :x2="drawingArea.right"
+ :x1="drawingArea?.left + xPadding" :x2="drawingArea?.right"
:y1="forceValidValue(zero)" :y2="forceValidValue(zero)" stroke-linecap="round"
:style="{ animation: 'none !important' }" />
</template>
@@ -3243,9 +3314,9 @@ defineExpose({
<g
v-if="FINAL_CONFIG.chart.highlighter.useLine && (![null, undefined].includes(selectedSerieIndex) || ![null, undefined].includes(selectedMinimapIndex))">
<line
- :x1="drawingArea.left + (drawingArea.width / maxSeries) * ((selectedSerieIndex !== null ? selectedSerieIndex : 0) || (selectedMinimapIndex !== null ? selectedMinimapIndex : 0)) + (drawingArea.width / maxSeries / 2)"
- :x2="drawingArea.left + (drawingArea.width / maxSeries) * ((selectedSerieIndex !== null ? selectedSerieIndex : 0) || (selectedMinimapIndex !== null ? selectedMinimapIndex : 0)) + (drawingArea.width / maxSeries / 2)"
- :y1="forceValidValue(drawingArea.top)" :y2="forceValidValue(drawingArea.bottom)"
+ :x1="drawingArea?.left + (drawingArea.width / maxSeries) * ((selectedSerieIndex !== null ? selectedSerieIndex : 0) || (selectedMinimapIndex !== null ? selectedMinimapIndex : 0)) + (drawingArea.width / maxSeries / 2)"
+ :x2="drawingArea?.left + (drawingArea.width / maxSeries) * ((selectedSerieIndex !== null ? selectedSerieIndex : 0) || (selectedMinimapIndex !== null ? selectedMinimapIndex : 0)) + (drawingArea.width / maxSeries / 2)"
+ :y1="forceValidValue(drawingArea?.top)" :y2="forceValidValue(drawingArea?.bottom)"
:stroke="FINAL_CONFIG.chart.highlighter.color"
:stroke-width="FINAL_CONFIG.chart.highlighter.lineWidth"
:stroke-dasharray="FINAL_CONFIG.chart.highlighter.lineDasharray" stroke-linecap="round"
@@ -3255,7 +3326,7 @@ defineExpose({
<!-- FRAME -->
<rect data-cy="frame" v-if="FINAL_CONFIG.chart.grid.frame.show"
:style="{ pointerEvents: 'none', transition: 'none', animation: 'none !important' }"
- :x="(drawingArea.left + xPadding) < 0 ? 0 : drawingArea.left + xPadding" :y="drawingArea.top"
+ :x="(drawingArea?.left + xPadding) < 0 ? 0 : drawingArea?.left + xPadding" :y="drawingArea?.top"
:width="(drawingArea.width - (FINAL_CONFIG.chart.grid.position === 'middle' ? 0 : drawingArea.width / maxSeries)) < 0 ? 0 : drawingArea.width - (FINAL_CONFIG.chart.grid.position === 'middle' ? 0 : drawingArea.width / maxSeries)"
:height="drawingArea.height < 0 ? 0 : drawingArea.height" fill="transparent"
:stroke="FINAL_CONFIG.chart.grid.frame.stroke"
@@ -3269,8 +3340,8 @@ defineExpose({
<template v-if="mutableConfig.useIndividualScale">
<g v-for="el in allScales">
<line :x1="el.x + xPadding - drawingArea.individualOffsetX" :x2="el.x + xPadding - drawingArea.individualOffsetX"
- :y1="mutableConfig.isStacked ? forceValidValue((drawingArea.bottom - el.yOffset - el.individualHeight)) : forceValidValue(drawingArea.top)"
- :y2="mutableConfig.isStacked ? forceValidValue((drawingArea.bottom - el.yOffset)) : forceValidValue(drawingArea.bottom)"
+ :y1="mutableConfig.isStacked ? forceValidValue((drawingArea?.bottom - el.yOffset - el.individualHeight)) : forceValidValue(drawingArea?.top)"
+ :y2="mutableConfig.isStacked ? forceValidValue((drawingArea?.bottom - el.yOffset)) : forceValidValue(drawingArea?.bottom)"
:stroke="el.color" :stroke-width="FINAL_CONFIG.chart.grid.stroke"
stroke-linecap="round"
:style="`opacity:${selectedScale ? selectedScale === el.groupId ? 1 : 0.3 : 1};transition:opacity 0.2s ease-in-out; animation: none !important`" />
@@ -3281,7 +3352,7 @@ defineExpose({
:fill="el.color"
:font-size="fontSizes.dataLabels * 0.8"
text-anchor="middle"
- :transform="`translate(${el.x - ((fontSizes.dataLabels * 0.8) / 2) + xPadding}, ${mutableConfig.isStacked ? drawingArea.bottom - el.yOffset - (el.individualHeight / 2) : drawingArea.top + drawingArea.height / 2}) rotate(-90)`">
+ :transform="`translate(${el.x - ((fontSizes.dataLabels * 0.8) / 2) + xPadding}, ${mutableConfig.isStacked ? drawingArea?.bottom - el.yOffset - (el.individualHeight / 2) : drawingArea?.top + drawingArea.height / 2}) rotate(-90)`">
{{ el.name }} {{ el.scaleLabel && el.unique && el.scaleLabel !== el.id ? `-
${el.scaleLabel}` : '' }}
</text>
@@ -3318,8 +3389,8 @@ defineExpose({
<g v-for="(yLabel, i) in yLabels" :key="`yLabel_${i}`">
<line data-cy="axis-y-tick"
v-if="canShowValue(yLabel) && yLabel.value >= niceScale.min && yLabel.value <= niceScale.max && FINAL_CONFIG.chart.grid.labels.yAxis.showCrosshairs"
- :x1="drawingArea.left + xPadding"
- :x2="drawingArea.left + xPadding - FINAL_CONFIG.chart.grid.labels.yAxis.crosshairSize"
+ :x1="drawingArea?.left + xPadding"
+ :x2="drawingArea?.left + xPadding - FINAL_CONFIG.chart.grid.labels.yAxis.crosshairSize"
:y1="forceValidValue(yLabel.y)" :y2="forceValidValue(yLabel.y)"
:stroke="FINAL_CONFIG.chart.grid.stroke" stroke-width="1" stroke-linecap="round"
:style="{ animation: 'none !important' }" />
@@ -3581,7 +3652,7 @@ defineExpose({
<template v-else>
<line class="vue-ui-xy-tag-plot"
v-if="([selectedMinimapIndex, selectedSerieIndex, selectedRowIndex].includes(j)) && serie.useTag"
- :x1="drawingArea.left" :x2="drawingArea.right" :y1="plot.y" :y2="plot.y"
+ :x1="drawingArea?.left" :x2="drawingArea?.right" :y1="plot.y" :y2="plot.y"
:stroke-width="1" stroke-linecap="round" stroke-dasharray="2"
:stroke="serie.color" />
</template>
@@ -3660,7 +3731,7 @@ defineExpose({
<template v-else>
<line class="vue-ui-xy-tag-line"
v-if="([selectedMinimapIndex, selectedSerieIndex, selectedRowIndex].includes(j)) && serie.useTag"
- :x1="drawingArea.left" :x2="drawingArea.right" :y1="plot.y" :y2="plot.y"
+ :x1="drawingArea?.left" :x2="drawingArea?.right" :y1="plot.y" :y2="plot.y"
:stroke-width="1" stroke-linecap="round" stroke-dasharray="2"
:stroke="serie.color" />
</template>
@@ -3810,7 +3881,7 @@ defineExpose({
</defs>
<rect v-for="(trap, i) in allScales"
:x="trap.x - FINAL_CONFIG.chart.grid.labels.yAxis.labelWidth + xPadding - drawingArea.individualOffsetX"
- :y="drawingArea.top"
+ :y="drawingArea?.top"
:width="FINAL_CONFIG.chart.grid.labels.yAxis.labelWidth + drawingArea.individualOffsetX"
:height="drawingArea.height < 0 ? 10 : drawingArea.height"
:fill="selectedScale === trap.groupId ? `url(#individual_scale_gradient_${uniqueId}_${i})` : 'transparent'"
@@ -3822,7 +3893,7 @@ defineExpose({
<text ref="yAxisLabel" data-cy="xy-axis-yLabel"
v-if="FINAL_CONFIG.chart.grid.labels.axis.yLabel && !mutableConfig.useIndividualScale"
:font-size="fontSizes.yAxis" :fill="FINAL_CONFIG.chart.grid.labels.color"
- :transform="`translate(${FINAL_CONFIG.chart.grid.labels.axis.fontSize}, ${drawingArea.top + drawingArea.height / 2}) rotate(-90)`"
+ :transform="`translate(${FINAL_CONFIG.chart.grid.labels.axis.fontSize}, ${drawingArea?.top + drawingArea.height / 2}) rotate(-90)`"
text-anchor="middle" style="transition: none">
{{ FINAL_CONFIG.chart.grid.labels.axis.yLabel }}
</text>
@@ -3840,11 +3911,11 @@ defineExpose({
<template v-if="$slots['time-label']">
<template v-for="(label, i) in displayedTimeLabels" :key="`time_label_${label.id}`">
<slot name="time-label" v-bind="{
- x: drawingArea.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2),
- y: drawingArea.bottom,
+ x: drawingArea?.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2),
+ y: drawingArea?.bottom,
fontSize: fontSizes.xAxis,
fill: FINAL_CONFIG.chart.grid.labels.xAxisLabels.color,
- transform: `translate(${drawingArea.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2)}, ${drawingArea.bottom + fontSizes.xAxis * 1.3 + FINAL_CONFIG.chart.grid.labels.xAxisLabels.yOffset}), rotate(${FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`,
+ transform: `translate(${drawingArea?.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2)}, ${drawingArea?.bottom + fontSizes.xAxis * 1.3 + FINAL_CONFIG.chart.grid.labels.xAxisLabels.yOffset}), rotate(${FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`,
absoluteIndex: label.absoluteIndex,
content: label.text,
textAnchor: FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation > 0 ? 'start' : FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation < 0 ? 'end' : 'middle',
@@ -3862,7 +3933,7 @@ defineExpose({
:text-anchor="FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation > 0 ? 'start' : FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation < 0 ? 'end' : 'middle'"
:font-size="fontSizes.xAxis"
:fill="FINAL_CONFIG.chart.grid.labels.xAxisLabels.color"
- :transform="`translate(${drawingArea.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2)}, ${drawingArea.bottom + fontSizes.xAxis * 1.5}), rotate(${FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`"
+ :transform="`translate(${drawingArea?.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2)}, ${drawingArea?.bottom + fontSizes.xAxis * 1.5}), rotate(${FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`"
:style="{
cursor: usesSelectTimeLabelEvent() ? 'pointer' : 'default'
}" @click="() => selectTimeLabel(label, i)">
@@ -3875,7 +3946,7 @@ defineExpose({
:text-anchor="FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation > 0 ? 'start' : FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation < 0 ? 'end' : 'middle'"
:font-size="fontSizes.xAxis"
:fill="FINAL_CONFIG.chart.grid.labels.xAxisLabels.color"
- :transform="`translate(${drawingArea.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2)}, ${drawingArea.bottom + fontSizes.xAxis * 1.5}), rotate(${FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`"
+ :transform="`translate(${drawingArea?.left + (drawingArea.width / maxSeries) * i + (drawingArea.width / maxSeries / 2)}, ${drawingArea?.bottom + fontSizes.xAxis * 1.5}), rotate(${FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`"
:style="{
cursor: usesSelectTimeLabelEvent() ? 'pointer' : 'default'
}" v-html="createTSpansFromLineBreaksOnX({
@@ -3929,7 +4000,7 @@ defineExpose({
style="pointer-events:none">
<foreignObject
:x="timeTagX()"
- :y="drawingArea.bottom" width="200" height="40" style="overflow: visible !important;">
+ :y="drawingArea?.bottom" width="200" height="40" style="overflow: visible !important;">
<div
ref="timeTagEl"
data-cy="time-tag"
@@ -3939,8 +4010,8 @@ defineExpose({
/>
</foreignObject>
<circle
- :cx="drawingArea.left + (drawingArea.width / maxSeries) * ((selectedSerieIndex !== null ? selectedSerieIndex : 0) || (selectedMinimapIndex !== null ? selectedMinimapIndex : 0)) + (drawingArea.width / maxSeries / 2)"
- :cy="drawingArea.bottom" :r="FINAL_CONFIG.chart.timeTag.circleMarker.radius"
+ :cx="drawingArea?.left + (drawingArea.width / maxSeries) * ((selectedSerieIndex !== null ? selectedSerieIndex : 0) || (selectedMinimapIndex !== null ? selectedMinimapIndex : 0)) + (drawingArea.width / maxSeries / 2)"
+ :cy="drawingArea?.bottom" :r="FINAL_CONFIG.chart.timeTag.circleMarker.radius"
:fill="FINAL_CONFIG.chart.timeTag.circleMarker.color" />
</g>
</g>
@@ -3953,7 +4024,11 @@ defineExpose({
:data-end="slicer.end"
/>
- <slot name="svg" :svg="svg" />
+ <slot name="svg" :svg="{
+ ...svg,
+ data: [...lineSet, ...barSet, ...plotSet],
+ drawingArea
+ }" />
</g>
</svg>
@@ -3970,18 +4045,18 @@ defineExpose({
position: 'fixed',
top: placeXYTag({
svgElement: svgRef,
- x: drawingArea.right + FINAL_CONFIG.line.tag.fontSize / 1.5,
+ x: drawingArea?.right + FINAL_CONFIG.line.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_right_line`],
position: 'right'
- }).top + 'px',
+ })?.top + 'px',
left: placeXYTag({
svgElement: svgRef,
- x: drawingArea.right + FINAL_CONFIG.line.tag.fontSize / 1.5,
+ x: drawingArea?.right + FINAL_CONFIG.line.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_right_line`],
position: 'right'
- }).left + 'px',
+ })?.left + 'px',
height: 'fit-content',
width: 'fit-content',
background: serie.color,
@@ -4010,18 +4085,18 @@ defineExpose({
position: 'fixed',
top: placeXYTag({
svgElement: svgRef,
- x: drawingArea.left - FINAL_CONFIG.line.tag.fontSize / 1.5,
+ x: drawingArea?.left - FINAL_CONFIG.line.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_left_line`],
position: 'left'
- }).top + 'px',
+ })?.top + 'px',
left: placeXYTag({
svgElement: svgRef,
- x: drawingArea.left - FINAL_CONFIG.line.tag.fontSize / 1.5,
+ x: drawingArea?.left - FINAL_CONFIG.line.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_left_line`],
position: 'left'
- }).left + 'px',
+ })?.left + 'px',
height: 'fit-content',
width: 'fit-content',
background: serie.color,
@@ -4056,18 +4131,18 @@ defineExpose({
position: 'fixed',
top: placeXYTag({
svgElement: svgRef,
- x: drawingArea.right + FINAL_CONFIG.plot.tag.fontSize / 1.5,
+ x: drawingArea?.right + FINAL_CONFIG.plot.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_right_plot`],
position: 'right'
- }).top + 'px',
+ })?.top + 'px',
left: placeXYTag({
svgElement: svgRef,
- x: drawingArea.right + FINAL_CONFIG.plot.tag.fontSize / 1.5,
+ x: drawingArea?.right + FINAL_CONFIG.plot.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_right_plot`],
position: 'right'
- }).left + 'px',
+ })?.left + 'px',
height: 'fit-content',
width: 'fit-content',
background: serie.color,
@@ -4096,18 +4171,18 @@ defineExpose({
position: 'fixed',
top: placeXYTag({
svgElement: svgRef,
- x: drawingArea.left - FINAL_CONFIG.plot.tag.fontSize / 1.5,
+ x: drawingArea?.left - FINAL_CONFIG.plot.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_left_plot`],
position: 'left'
- }).top + 'px',
+ })?.top + 'px',
left: placeXYTag({
svgElement: svgRef,
- x: drawingArea.left - FINAL_CONFIG.plot.tag.fontSize / 1.5,
+ x: drawingArea?.left - FINAL_CONFIG.plot.tag.fontSize / 1.5,
y: plot.y,
element: tagRefs[`${i}_${j}_left_plot`],
position: 'left'
- }).left + 'px',
+ })?.left + 'px',
height: 'fit-content',
width: 'fit-content',
background: serie.color,
diff --git a/src/entries/vue-ui-horizontal-bar.js b/src/entries/vue-ui-horizontal-bar.js
index ead4ea8b..44b64156 100644
--- a/src/entries/vue-ui-horizontal-bar.js
+++ b/src/entries/vue-ui-horizontal-bar.js
@@ -1,2 +1,2 @@
-export { default as VueUiHorizontalBar } from "../components/vue-ui-vertical-bar.vue";
-export { default } from "../components/vue-ui-vertical-bar.vue";
\ No newline at end of file
+export { default as VueUiHorizontalBar } from "../components/vue-ui-horizontal-bar.vue";
+export { default } from "../components/vue-ui-horizontal-bar.vue";
\ No newline at end of file
diff --git a/src/entries/vue-ui-stackline.js b/src/entries/vue-ui-stackline.js
new file mode 100644
index 00000000..3f828b17
--- /dev/null
+++ b/src/entries/vue-ui-stackline.js
@@ -0,0 +1,2 @@
+export { default as VueUiStackline } from "../components/vue-ui-stackline.vue";
+export { default } from "../components/vue-ui-stackline.vue";
\ No newline at end of file
diff --git a/src/entries/vue-ui-vertical-bar.js b/src/entries/vue-ui-vertical-bar.js
index add9b205..f9b0c84f 100644
--- a/src/entries/vue-ui-vertical-bar.js
+++ b/src/entries/vue-ui-vertical-bar.js
@@ -1,2 +1,3 @@
-export { default as VueUiVerticalBar } from "../components/vue-ui-vertical-bar.vue";
-export { default } from "../components/vue-ui-vertical-bar.vue";
\ No newline at end of file
+// Legacy support for old vertical-bar faulty naming
+export { default as VueUiVerticalBar } from "../components/vue-ui-horizontal-bar.vue";
+export { default } from "../components/vue-ui-horizontal-bar.vue";
\ No newline at end of file
diff --git a/src/getThemeConfig.js b/src/getThemeConfig.js
index 8ee6f3f2..8ff99ea1 100644
--- a/src/getThemeConfig.js
+++ b/src/getThemeConfig.js
@@ -1,5 +1,55 @@
-import themes from "./themes.json";
+const _globLoaders = import.meta.glob('./themes/*.json', { import: 'default' });
-export default function getThemeConfig(type) {
- return themes[type]
-}
\ No newline at end of file
+const THEME_LOADERS = Object.fromEntries(
+ Object.entries(_globLoaders).map(([path, load]) => {
+ const m = path.match(/\/themes\/(.+)\.json$/);
+ const type = m ? m[1] : path;
+ return [type, load];
+ })
+);
+
+const _cache = new Map();
+
+let _loader = async (type) => {
+ const load = THEME_LOADERS[type];
+ if (!load) {
+ const err = new Error('ENOENT');
+ err.code = 'ENOENT';
+ throw err;
+ }
+ return await load();
+};
+
+async function getThemeConfig(type) {
+ if (!type) return null;
+ if (_cache.has(type)) return _cache.get(type);
+ try {
+ const theme = await _loader(type);
+ _cache.set(type, theme);
+ return theme;
+ } catch (e) {
+ console.warn(`[getThemeConfig] Missing theme file: ${type}.json`, e);
+ return null;
+ }
+}
+
+export default getThemeConfig;
+export { getThemeConfig };
+
+export function getThemeConfigSync(type) {
+ if (!type) return null;
+ return _cache.get(type) ?? null;
+}
+
+export async function preloadTheme(type) {
+ return await getThemeConfig(type);
+}
+export async function preloadThemes(types = []) {
+ return Promise.all(types.map(getThemeConfig));
+}
+
+export const __testing = {
+ clearCache: () => _cache.clear(),
+ cacheSize: () => _cache.size,
+ setLoader: (fn) => { _loader = fn; },
+};
diff --git a/src/index.js b/src/index.js
index 486084b9..b9c80580 100755
--- a/src/index.js
+++ b/src/index.js
@@ -47,8 +47,8 @@ export { default as VueUiThermometer } from "./components/vue-ui-thermometer.vue
export { default as VueUiTimer } from "./components/vue-ui-timer.vue";
export { default as VueUiTiremarks } from "./components/vue-ui-tiremarks.vue";
export { default as VueUiTreemap } from "./components/vue-ui-treemap.vue";
-export { default as VueUiVerticalBar } from "./components/vue-ui-vertical-bar.vue";
-export { default as VueUiHorizontalBar } from "./components/vue-ui-vertical-bar.vue";
+export { default as VueUiVerticalBar } from "./components/vue-ui-horizontal-bar.vue"; // Legacy support
+export { default as VueUiHorizontalBar } from "./components/vue-ui-horizontal-bar.vue";
export { default as VueUiWaffle } from "./components/vue-ui-waffle.vue";
export { default as VueUiWheel } from "./components/vue-ui-wheel.vue";
export { default as VueUiWordCloud } from "./components/vue-ui-word-cloud.vue";
@@ -56,6 +56,7 @@ export { default as VueUiXyCanvas } from "./components/vue-ui-xy-canvas.vue";
export { default as VueUiCarouselTable } from "./components/vue-ui-carousel-table.vue";
export { default as VueUiGizmo } from "./components/vue-ui-gizmo.vue";
export { default as VueUiStackbar } from "./components/vue-ui-stackbar.vue";
+export { default as VueUiStackline } from "./components/vue-ui-stackline.vue";
export { default as VueUiBullet } from "./components/vue-ui-bullet.vue";
export { default as VueUiFunnel } from "./components/vue-ui-funnel.vue";
export { default as VueUiHistoryPlot } from "./components/vue-ui-history-plot.vue";
diff --git a/src/legacy/LEGACY.md b/src/legacy/LEGACY.md
new file mode 100644
index 00000000..9a78ca20
--- /dev/null
+++ b/src/legacy/LEGACY.md
@@ -0,0 +1,6 @@
+Components in this directory are there for archive purposes.
+
+## VueUiVerticalBar
+
+- Faulty dimension calculation logic, leading to impossible resolutions for responsive mode, and causing overflows and weird resizing on serie segregations
+- Legacy naming
diff --git a/src/components/vue-ui-vertical-bar.vue b/src/legacy/vue-ui-vertical-bar.vue
similarity index 95%
rename from src/components/vue-ui-vertical-bar.vue
rename to src/legacy/vue-ui-vertical-bar.vue
index 4a86f2c6..6116ac49 100644
--- a/src/components/vue-ui-vertical-bar.vue
+++ b/src/legacy/vue-ui-vertical-bar.vue
@@ -1,4 +1,5 @@
<script setup>
+// IMPORTANT: This component is made available as VueUiHorizontalBar, but is still usable as VueUiVerticalBar for legacy usage
import { ref, computed, onMounted, onBeforeUnmount, watch, useSlots, defineAsyncComponent, shallowRef, nextTick, toRefs } from "vue";
import {
applyDataLabel,
@@ -28,10 +29,11 @@ import { usePrinter } from "../usePrinter";
import { useSvgExport } from "../useSvgExport.js";
import { useResponsive } from "../useResponsive";
import { useNestedProp } from "../useNestedProp";
+import { useThemeCheck } from "../useThemeCheck.js";
import { useTableResponsive } from "../useTableResponsive";
import { useUserOptionState } from "../useUserOptionState";
import { useChartAccessibility } from "../useChartAccessibility.js";
-import themes from "../themes.json";
+import themes from "../themes/vue_ui_horizontal_bar.json";
import Legend from "../atoms/Legend.vue"; // Must be ready in responsive mode
import Accordion from "./vue-ui-accordion.vue"; // Must be ready in responsive mode
import Title from "../atoms/Title.vue"; // Must be ready in responsive mode
@@ -47,6 +49,7 @@ const PackageVersion = defineAsyncComponent(() => import('../atoms/PackageVersio
const BaseDraggableDialog = defineAsyncComponent(() => import('../atoms/BaseDraggableDialog.vue'));
const { vue_ui_vertical_bar: DEFAULT_CONFIG } = useConfig();
+const { isThemeValid, warnInvalidTheme } = useThemeCheck();
const slots = useSlots();
const props = defineProps({
@@ -176,13 +179,25 @@ function prepareConfig() {
});
let finalConfig = {};
- if (mergedConfig.theme) {
- finalConfig = {
- ...useNestedProp({
- userConfig: themes.vue_ui_vertical_bar[mergedConfig.theme] || props.config,
+ const theme = mergedConfig.theme
+
+ if (theme) {
+ if (!isThemeValid.value(mergedConfig)) {
+ warnInvalidTheme(mergedConfig);
+ finalConfig = mergedConfig;
+ } else {
+ const fused = useNestedProp({
+ userConfig: themes[theme] || props.config,
defaultConfig: mergedConfig
- }),
- customPalette: themePalettes[mergedConfig.theme] || palette
+ });
+
+ finalConfig = {
+ ...useNestedProp({
+ userConfig: props.config,
+ defaultConfig: fused
+ }),
+ customPalette: mergedConfig.customPalette.length ? mergedConfig.customPalette : themePalettes[theme] || palette
+ }
}
} else {
finalConfig = mergedConfig;
@@ -566,6 +581,39 @@ async function segregate(id) {
emit('selectLegend', mutableDataset.value);
}
+function validSeriesToToggle(name) {
+ if (!immutableDataset.value.length) {
+ if (FINAL_CONFIG.value.debug) {
+ console.warn('VueUiHorizontalBar - There are no series to show.');
+ }
+ return null;
+ }
+ const dp = immutableDataset.value.find(d => d.name === name);
+ if (!dp) {
+ if (FINAL_CONFIG.value.debug) {
+ console.warn(`VueUiHorizontalBar - Series name not found "${name}"`);
+ }
+ return null;
+ }
+ return dp;
+}
+
+function showSeries(name) {
+ const dp = validSeriesToToggle(name);
+ if (dp === null) return;
+ if (segregated.value.includes(dp.id)) {
+ segregate(dp.id);
+ }
+}
+
+function hideSeries(name) {
+ const dp = validSeriesToToggle(name);
+ if (dp === null) return;
+ if (!segregated.value.includes(dp.id)) {
+ segregate(dp.id);
+ }
+}
+
const mutableDataset = computed(() => {
return immutableDataset.value.filter(serie => !segregated.value.includes(serie.id));
});
@@ -1003,6 +1051,8 @@ defineExpose({
generateCsv,
generateImage,
generateSvg,
+ hideSeries,
+ showSeries,
toggleTable,
toggleSort,
toggleTooltip,
@@ -1021,7 +1071,26 @@ defineExpose({
:color="FINAL_CONFIG.style.chart.color"
:active="isAnnotator"
@close="toggleAnnotator"
- />
+ >
+ <template #annotator-action-close>
+ <slot name="annotator-action-close"/>
+ </template>
+ <template #annotator-action-color="{ color }">
+ <slot name="annotator-action-color" v-bind="{ color }"/>
+ </template>
+ <template #annotator-action-draw="{ mode }">
+ <slot name="annotator-action-draw" v-bind="{ mode }"/>
+ </template>
+ <template #annotator-action-undo="{ disabled }">
+ <slot name="annotator-action-undo" v-bind="{ disabled }"/>
+ </template>
+ <template #annotator-action-redo="{ disabled }">
+ <slot name="annotator-action-redo" v-bind="{ disabled }"/>
+ </template>
+ <template #annotator-action-delete="{ disabled }">
+ <slot name="annotator-action-delete" v-bind="{ disabled }"/>
+ </template>
+ </PenAndPaper>
<div
ref="noTitle"
@@ -1102,6 +1171,9 @@ defineExpose({
<template #optionImg v-if="$slots.optionImg">
<slot name="optionImg" />
</template>
+ <template #optionSvg v-if="$slots.optionSvg">
+ <slot name="optionSvg" />
+ </template>
<template #optionTable v-if="$slots.optionTable">
<slot name="optionTable" />
</template>
diff --git a/src/lib.js b/src/lib.js
index 36937033..15abd39e 100755
--- a/src/lib.js
+++ b/src/lib.js
@@ -239,6 +239,7 @@ export function getPalette(palette = 'default') {
export const themePalettes = {
default: palette,
+ dark: palette,
celebration: [
"#D32F2F",
"#E64A19",
@@ -3392,6 +3393,21 @@ export const buildDisplayedTimeLabels = cacheLastResult((
}));
});
+export function escapeXml(str) {
+ return String(str)
+ .replaceAll("&", "&")
+ .replaceAll("<", "<")
+ .replaceAll(">", ">");
+}
+
+export function escapeXmlAttr(str) {
+ return String(str)
+ .replaceAll("&", "&")
+ .replaceAll('"', """)
+ .replaceAll("<", "<")
+ .replaceAll(">", ">");
+}
+
const lib = {
XMLNS,
abbreviate,
@@ -3450,6 +3466,8 @@ const lib = {
easeOutCubic,
emptyObjectToNull,
error,
+ escapeXml,
+ escapeXmlAttr,
fib,
forceValidValue,
formatSmallValue,
@@ -3496,4 +3514,5 @@ const lib = {
triggerResize,
wrapText
};
-export default lib;
\ No newline at end of file
+export default lib;
+
diff --git a/src/locales/locales.json b/src/locales/locales.json
index 9a3a6ec1..ba766086 100644
--- a/src/locales/locales.json
+++ b/src/locales/locales.json
@@ -671,6 +671,54 @@
"sam."
]
},
+ "gl": {
+ "months": [
+ "Xaneiro",
+ "Febreiro",
+ "Marzo",
+ "Abril",
+ "Maio",
+ "Xuño",
+ "Xullo",
+ "Agosto",
+ "Setembro",
+ "Outubro",
+ "Novembro",
+ "Decembro"
+ ],
+ "shortMonths": [
+ "Xan",
+ "Feb",
+ "Mar",
+ "Abr",
+ "Mai",
+ "Xuñ",
+ "Xul",
+ "Ago",
+ "Set",
+ "Out",
+ "Nov",
+ "Dec"
+ ],
+ "days": [
+ "Domingo",
+ "Luns",
+ "Martes",
+ "Mércores",
+ "Xoves",
+ "Venres",
+ "Sábado"
+ ],
+ "shortDays": [
+ "Dom",
+ "Lun",
+ "Mar",
+ "Mér",
+ "Xov",
+ "Ven",
+ "Sáb"
+ ]
+ },
"he": {
"months": [
"ינואר",
diff --git a/src/themes.json b/src/themes.json
deleted file mode 100755
index ca4db501..00000000
--- a/src/themes.json
+++ /dev/null
@@ -1,10776 +0,0 @@
-{
- "vue_ui_chord": {
- "default": {},
- "celebration": {
- "table": {
- "th": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "arcs": {
- "stroke": "#FFF8E1",
- "labels": {
- "color": "#424242"
- }
- },
- "ribbons": {
- "stroke": "#FFF8E1",
- "labels": {
- "color": "#424242",
- "connector": {
- "stroke": "#424242"
- },
- "marker": {
- "stroke": "#FFF8E1"
- }
- }
- }
- }
- }
- },
- "celebrationNight": {
- "table": {
- "th": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "arcs": {
- "stroke": "#1E1E1E",
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "ribbons": {
- "stroke": "#1E1E1E",
- "labels": {
- "color": "#BDBDBD",
- "connector": {
- "stroke": "#BDBDBD"
- },
- "marker": {
- "stroke": "#1E1E1E"
- }
- }
- }
- }
- }
- },
- "hack": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99"
- },
- "arcs": {
- "stroke": "#1A1A1A",
- "labels": {
- "color": "#99AA99"
- }
- },
- "ribbons": {
- "stroke": "#1A1A1A",
- "labels": {
- "color": "#99AA99",
- "connector": {
- "stroke": "#99AA99"
- },
- "marker": {
- "stroke": "#1A1A1A"
- }
- }
- }
- }
- }
- },
- "zen": {
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "arcs": {
- "stroke": "#fbfafa",
- "labels": {
- "color": "#8A9892"
- }
- },
- "ribbons": {
- "stroke": "#fbfafa",
- "labels": {
- "color": "#8A9892",
- "connector": {
- "stroke": "#8A9892"
- },
- "marker": {
- "stroke": "#fbfafa"
- }
- }
- }
- }
- }
- },
- "concrete": {
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "legend": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C"
- },
- "arcs": {
- "stroke": "#f6f6fb",
- "labels": {
- "color": "#50606C"
- }
- },
- "ribbons": {
- "stroke": "#f6f6fb",
- "labels": {
- "color": "#50606C",
- "connector": {
- "stroke": "#50606C"
- },
- "marker": {
- "stroke": "#f6f6fb"
- }
- }
- }
- }
- }
- }
- },
- "vue_ui_ridgeline": {
- "default": {},
- "celebration": {
- "table": {
- "th": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "areas": {
- "stroke": {
- "color": "#8F837A"
- }
- },
- "dialog": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "header": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "xyChart": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65",
- "minimap": {
- "selectedColor": "#FF8A65",
- "lineColor": "#424242",
- "indicatorColor": "#FF8A65"
- }
- },
- "highlighter": {
- "color": "#424242"
- },
- "timeTag": {
- "backgroundColor":"#424242",
- "color": "#FFF8E1",
- "circleMarker": {
- "color": "#424242"
- }
- },
- "grid": {
- "stroke": "#5D4037",
- "showVerticalLines": false,
- "labels": {
- "color": "#424242",
- "xAxisLabels": {
- "color": "#424242"
- },
- "xAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- },
- "bar": {
- "borderRadius": 2,
- "border": {
- "stroke": "#FFF8E1"
- },
- "labels": {
- "color": "#424242"
- },
- "serieName": {
- "color": "#424242"
- }
- },
- "line": {
- "labels": {
- "color": "#424242"
- }
- },
- "plot": {
- "labels": {
- "color": "#424242"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "selector": {
- "stroke": "#FF8A65",
- "dot": {
- "fill": "#424242",
- "stroke": "#FFF8E1"
- },
- "labels": {
- "color": "#424242"
- }
- },
- "xAxis": {
- "labels": {
- "color": "#424242"
- }
- },
- "yAxis": {
- "labels": {
- "color": "#424242"
- }
- },
- "zeroLine": {
- "stroke": "#5D4037"
- }
- }
- }
- },
- "celebrationNight": {
- "table": {
- "th": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "areas": {
- "stroke": {
- "color": "#8F837A"
- }
- },
- "dialog": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "header": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "xyChart": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65",
- "minimap": {
- "selectedColor": "#FF8A65",
- "lineColor": "#FF6B6B",
- "indicatorColor": "#FF8A65"
- }
- },
- "highlighter": {
- "color": "#FFF8E1"
- },
- "timeTag": {
- "backgroundColor":"#5D4037",
- "color": "#FFF8E1",
- "circleMarker": {
- "color": "#5D4037"
- }
- },
- "grid": {
- "stroke": "#5D4037",
- "showVerticalLines": false,
- "labels": {
- "color": "#BDBDBD",
- "xAxisLabels": {
- "color": "#BDBDBD"
- },
- "xAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- },
- "bar": {
- "borderRadius": 2,
- "border": {
- "stroke": "#1E1E1E"
- },
- "labels": {
- "color": "#BDBDBD"
- },
- "serieName": {
- "color": "#BDBDBD"
- }
- },
- "line": {
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "plot": {
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "selector": {
- "stroke": "#FF8A65",
- "dot": {
- "fill": "#424242",
- "stroke": "#1E1E1E"
- },
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "xAxis": {
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "yAxis": {
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "zeroLine": {
- "stroke": "#5D4037"
- }
- }
- }
- },
- "hack": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "areas": {
- "stroke": {
- "color": "#66CC66"
- }
- },
- "dialog": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "header": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99"
- },
- "xyChart": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "zoom": {
- "color": "#5F6A5F",
- "highlightColor": "#66CC66"
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "timeTag": {
- "backgroundColor":"#1A1A1A",
- "color": "#66CC66",
- "circleMarker": {
- "color": "#66CC66"
- }
- },
- "grid": {
- "stroke": "#5F6A5F",
- "showVerticalLines": false,
- "labels": {
- "color": "#99AA99",
- "xAxisLabels": {
- "color": "#99AA99"
- },
- "xAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- },
- "bar": {
- "borderRadius": 0,
- "border": {
- "stroke": "#66CC66"
- },
- "labels": {
- "color": "#AACCAA"
- },
- "serieName": {
- "color": "#99CC99"
- }
- },
- "line": {
- "labels": {
- "color": "#AACCAA"
- }
- },
- "plot": {
- "labels": {
- "color": "#AACCAA"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- }
- },
- "legend": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99"
- },
- "selector": {
- "stroke": "#99AA99",
- "dot": {
- "fill": "#4A4A4A",
- "stroke": "#1A1A1A"
- },
- "labels": {
- "color": "#99AA99"
- }
- },
- "xAxis": {
- "labels": {
- "color": "#99AA99"
- }
- },
- "yAxis": {
- "labels": {
- "color": "#99AA99"
- }
- },
- "zeroLine": {
- "stroke": "#2A2A2A"
- }
- }
- }
- },
- "zen": {
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "areas": {
- "stroke": {
- "color": "#8F837A"
- }
- },
- "dialog": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "header": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "xyChart": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "zoom": {
- "color": "#E0CFC3",
- "highlightColor": "#8F837A"
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "timeTag": {
- "backgroundColor":"#fbfafa",
- "color": "#8A9892",
- "circleMarker": {
- "color": "#8A9892"
- }
- },
- "grid": {
- "stroke": "transparent",
- "labels": {
- "show": false,
- "color": "#99AA99",
- "xAxisLabels": {
- "show": false,
- "color": "#99AA99"
- },
- "zeroLine": {
- "show": false
- },
- "yAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "bar": {
- "borderRadius": 4,
- "border": {
- "stroke": "#D7E0D2"
- },
- "labels": {
- "color": "#8F837A"
- },
- "serieName": {
- "color": "#858480"
- }
- },
- "line": {
- "labels": {
- "color": "#8F837A"
- }
- },
- "plot": {
- "labels": {
- "color": "#8F837A"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "selector": {
- "stroke": "#8F837A",
- "dot": {
- "fill": "#8F837A",
- "stroke": "#fbfafa"
- },
- "labels": {
- "color": "#8F837A"
- }
- },
- "xAxis": {
- "labels": {
- "color": "#8F837A"
- }
- },
- "yAxis": {
- "labels": {
- "color": "#8F837A"
- }
- },
- "zeroLine": {
- "stroke": "#8F837A"
- }
- }
- }
- },
- "concrete": {
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "areas": {
- "stroke": {
- "color": "#829C98"
- }
- },
- "dialog": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "header": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C"
- },
- "xyChart": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "zoom": {
- "color": "#92B0AB",
- "highlightColor": "#50606C"
- },
- "highlighter": {
- "color": "#7DA9B5"
- },
- "timeTag": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "circleMarker": {
- "color": "#50606C"
- }
- },
- "grid": {
- "stroke": "#829C98",
- "showVerticalLines": true,
- "showHorizontalLines": true,
- "labels": {
- "color": "#50606C",
- "xAxisLabels": {
- "color": "#50606C"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "bar": {
- "borderRadius": 2,
- "border": {
- "stroke": "#404C4D"
- },
- "labels": {
- "color": "#50606C"
- },
- "serieName": {
- "color": "#61747E"
- }
- },
- "line": {
- "labels": {
- "color": "#50606C"
- }
- },
- "plot": {
- "labels": {
- "color": "#50606C"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "legend": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C"
- },
- "selector": {
- "stroke": "#7DA9B5",
- "dot": {
- "fill": "#7DA9B5",
- "stroke": "#f6f6fb"
- },
- "labels": {
- "color": "#50606C"
- }
- },
- "xAxis": {
- "labels": {
- "color": "#50606C"
- }
- },
- "yAxis": {
- "labels": {
- "color": "#50606C"
- }
- },
- "zeroLine": {
- "stroke": "#829C98"
- }
- }
- }
- }
- },
- "vue_ui_circle_pack": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "circles": {
- "stroke": "#3A3A3A"
- }
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "circles": {
- "stroke": "#3A3A3A"
- }
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- }
- },
- "vue_ui_xy": {
- "default": {},
- "celebration": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65",
- "minimap": {
- "selectedColor": "#FF8A65",
- "lineColor": "#424242",
- "indicatorColor": "#FF8A65"
- }
- },
- "highlighter": {
- "color": "#424242"
- },
- "timeTag": {
- "backgroundColor":"#424242",
- "color": "#FFF8E1",
- "circleMarker": {
- "color": "#424242"
- }
- },
- "grid": {
- "stroke": "#5D4037",
- "showVerticalLines": false,
- "labels": {
- "color": "#424242",
- "xAxisLabels": {
- "color": "#424242"
- },
- "xAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- },
- "bar": {
- "borderRadius": 2,
- "border": {
- "stroke": "#FFF8E1"
- },
- "labels": {
- "color": "#424242"
- },
- "serieName": {
- "color": "#424242"
- }
- },
- "line": {
- "labels": {
- "color": "#424242"
- }
- },
- "plot": {
- "labels": {
- "color": "#424242"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65",
- "minimap": {
- "selectedColor": "#FF8A65",
- "lineColor": "#FF6B6B",
- "indicatorColor": "#FF8A65"
- }
- },
- "highlighter": {
- "color": "#FFF8E1"
- },
- "timeTag": {
- "backgroundColor":"#5D4037",
- "color": "#FFF8E1",
- "circleMarker": {
- "color": "#5D4037"
- }
- },
- "grid": {
- "stroke": "#5D4037",
- "showVerticalLines": false,
- "labels": {
- "color": "#BDBDBD",
- "xAxisLabels": {
- "color": "#BDBDBD"
- },
- "xAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- },
- "bar": {
- "borderRadius": 2,
- "border": {
- "stroke": "#1E1E1E"
- },
- "labels": {
- "color": "#BDBDBD"
- },
- "serieName": {
- "color": "#BDBDBD"
- }
- },
- "line": {
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "plot": {
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "zoom": {
- "color": "#5F6A5F",
- "highlightColor": "#66CC66"
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "timeTag": {
- "backgroundColor":"#1A1A1A",
- "color": "#66CC66",
- "circleMarker": {
- "color": "#66CC66"
- }
- },
- "grid": {
- "stroke": "#5F6A5F",
- "showVerticalLines": false,
- "labels": {
- "color": "#99AA99",
- "xAxisLabels": {
- "color": "#99AA99"
- },
- "xAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- },
- "bar": {
- "borderRadius": 0,
- "border": {
- "stroke": "#66CC66"
- },
- "labels": {
- "color": "#AACCAA"
- },
- "serieName": {
- "color": "#99CC99"
- }
- },
- "line": {
- "labels": {
- "color": "#AACCAA"
- }
- },
- "plot": {
- "labels": {
- "color": "#AACCAA"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "zoom": {
- "color": "#E0CFC3",
- "highlightColor": "#8F837A"
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "timeTag": {
- "backgroundColor":"#fbfafa",
- "color": "#8A9892",
- "circleMarker": {
- "color": "#8A9892"
- }
- },
- "grid": {
- "stroke": "transparent",
- "labels": {
- "show": false,
- "color": "#99AA99",
- "xAxisLabels": {
- "show": false,
- "color": "#99AA99"
- },
- "zeroLine": {
- "show": false
- },
- "yAxis": {
- "showBaseline": false
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "bar": {
- "borderRadius": 4,
- "border": {
- "stroke": "#D7E0D2"
- },
- "labels": {
- "color": "#8F837A"
- },
- "serieName": {
- "color": "#858480"
- }
- },
- "line": {
- "labels": {
- "color": "#8F837A"
- }
- },
- "plot": {
- "labels": {
- "color": "#8F837A"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "zoom": {
- "color": "#92B0AB",
- "highlightColor": "#50606C"
- },
- "highlighter": {
- "color": "#7DA9B5"
- },
- "timeTag": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "circleMarker": {
- "color": "#50606C"
- }
- },
- "grid": {
- "stroke": "#829C98",
- "showVerticalLines": true,
- "showHorizontalLines": true,
- "labels": {
- "color": "#50606C",
- "xAxisLabels": {
- "color": "#50606C"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "bar": {
- "borderRadius": 2,
- "border": {
- "stroke": "#404C4D"
- },
- "labels": {
- "color": "#50606C"
- },
- "serieName": {
- "color": "#61747E"
- }
- },
- "line": {
- "labels": {
- "color": "#50606C"
- }
- },
- "plot": {
- "labels": {
- "color": "#50606C"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_donut": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242",
- "layout": {
- "labels": {
- "percentage": {
- "color": "#424242"
- },
- "name": {
- "color": "#424242"
- },
- "hollow": {
- "total": {
- "color": "#424242",
- "value": {
- "color": "#424242"
- }
- },
- "average": {
- "color": "#424242",
- "value": {
- "color": "#424242"
- }
- }
- }
- }
- },
- "legend": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "labels": {
- "percentage": {
- "color": "#BDBDBD"
- },
- "name": {
- "color": "#BDBDBD"
- },
- "hollow": {
- "total": {
- "color": "#BDBDBD",
- "value": {
- "color": "#BDBDBD"
- }
- },
- "average": {
- "color": "#BDBDBD",
- "value": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "legend": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "labels": {
- "percentage": {
- "color": "#61747E"
- },
- "name": {
- "color": "#8A9892"
- },
- "hollow": {
- "total": {
- "color": "#8A9892",
- "value": {
- "color": "#61747E"
- }
- },
- "average": {
- "color": "#8A9892",
- "value": {
- "color": "#61747E"
- }
- }
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "labels": {
- "percentage": {
- "color": "#AACCAA"
- },
- "name": {
- "color": "#99CC99"
- },
- "hollow": {
- "total": {
- "color": "#99CC99",
- "value": {
- "color": "#AACCAA"
- }
- },
- "average": {
- "color": "#99CC99",
- "value": {
- "color": "#AACCAA"
- }
- }
- }
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "labels": {
- "percentage": {
- "color": "#A0AC94"
- },
- "name": {
- "color": "#8A9892"
- },
- "hollow": {
- "total": {
- "color": "#8A9892",
- "value": {
- "color": "#A0AC94"
- }
- },
- "average": {
- "color": "#8A9892",
- "value": {
- "color": "#A0AC94"
- }
- }
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- }
- },
- "vue_ui_treemap": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "rects": {
- "stroke": "#FFF8E1",
- "selected": {
- "stroke":"#FFF8E1"
- }
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "rects": {
- "stroke": "#1E1E1E",
- "selected": {
- "stroke":"#1E1E1E"
- }
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "rects": {
- "stroke": "#1A1A1A",
- "selected": {
- "stroke":"#1A1A1A"
- }
- }
- },
- "legend": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "rects": {
- "stroke": "#fbfafa",
- "strokeWidth": 2,
- "borderRadius": 12,
- "selected": {
- "stroke":"#fbfafa"
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "layout": {
- "rects": {
- "stroke": "#1A1A1A",
- "selected": {
- "stroke":"#1A1A1A"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_waffle": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "rect": {
- "rounded": false,
- "stroke": "#FFF8E1",
- "useGradient": false
- }
- },
- "legend": {
- "color": "#424242",
- "backgroundColor":"#FFF8E1"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "rect": {
- "rounded": false,
- "stroke": "#1E1E1E",
- "useGradient": false
- }
- },
- "legend": {
- "color": "#BDBDBD",
- "backgroundColor":"#1E1E1E"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "rect": {
- "rounded": false,
- "stroke": "#66CC66",
- "useGradient": false
- }
- },
- "legend": {
- "color": "#99AA99",
- "backgroundColor":"#1A1A1A"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "rect": {
- "rounding": 4,
- "stroke": "#fbfafa"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "layout": {
- "rect": {
- "rounded": false,
- "stroke": "#404C5A",
- "useGradient": false
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_radar": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "outerPolygon": {
- "stroke": "#5D403780",
- "strokeWidth": 1
- },
- "grid": {
- "stroke": "#5D403740"
- },
- "labels": {
- "dataLabels": {
- "color": "#424242"
- }
- }
- },
- "legend": {
- "color": "#424242",
- "backgroundColor":"#FFF8E1"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "outerPolygon": {
- "stroke": "#3A3A3A",
- "strokeWidth": 1
- },
- "grid": {
- "stroke": "#3A3A3A"
- },
- "labels": {
- "dataLabels": {
- "color": "#BDBDBD"
- }
- }
- },
- "legend": {
- "color": "#BDBDBD",
- "backgroundColor":"#1E1E1E"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "outerPolygon": {
- "stroke": "#336633",
- "strokeWidth": 0
- },
- "grid": {
- "stroke": "#334C33",
- "graduations": 1
- },
- "labels": {
- "dataLabels": {
- "color": "#99AA99"
- }
- }
- },
- "legend": {
- "color": "#99AA99",
- "backgroundColor":"#1A1A1A"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "outerPolygon": {
- "strokeWidth": 0
- },
- "grid": {
- "show": false
- },
- "labels": {
- "dataLabels": {
- "color": "#99AA99"
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "layout": {
- "outerPolygon": {
- "stroke": "#ABB1BC",
- "strokeWidth": 0.5
- },
- "grid": {
- "stroke": "#C3DAC8"
- },
- "labels": {
- "dataLabels": {
- "color": "#99AA99"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_quadrant": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "labels": {
- "quadrantLabels": {
- "tl": {
- "color": "#5D4037"
- },
- "tr": {
- "color": "#5D4037"
- },
- "br": {
- "color": "#5D4037"
- },
- "bl": {
- "color": "#5D4037"
- }
- },
- "plotLabels": {
- "color": "#424242"
- },
- "axisLabels": {
- "color": {
- "positive": "#757575",
- "negative": "#757575"
- }
- }
- },
- "grid": {
- "stroke": "#5D403790",
- "graduations": {
- "stroke": "#5D403780",
- "roundingForce": 0,
- "fill": false
- }
- },
- "plots": {
- "outlineColor": "#FFF8E1"
- },
- "areas": {
- "opacity": 20
- }
- },
- "legend": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "labels": {
- "quadrantLabels": {
- "tl": {
- "color": "#FF6B6B90"
- },
- "tr": {
- "color": "#FF6B6B90"
- },
- "br": {
- "color": "#FF6B6B90"
- },
- "bl": {
- "color": "#FF6B6B90"
- }
- },
- "plotLabels": {
- "color": "#BDBDBD"
- },
- "axisLabels": {
- "color": {
- "positive": "#757575",
- "negative": "#757575"
- }
- }
- },
- "grid": {
- "stroke": "#5D403790",
- "graduations": {
- "stroke": "#5D403780",
- "roundingForce": 0,
- "fill": false
- }
- },
- "plots": {
- "outlineColor": "#1E1E1E"
- },
- "areas": {
- "opacity": 20
- }
- },
- "legend": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "labels": {
- "quadrantLabels": {
- "tl": {
- "color": "#99AA99"
- },
- "tr": {
- "color": "#99AA99"
- },
- "br": {
- "color": "#99AA99"
- },
- "bl": {
- "color": "#99AA99"
- }
- },
- "plotLabels": {
- "color": "#99CC99"
- },
- "axisLabels": {
- "color": {
- "positive": "#66CC66",
- "negative": "#66CC66"
- }
- }
- },
- "grid": {
- "stroke": "#334C33",
- "graduations": {
- "stroke": "#333333",
- "roundingForce": 0,
- "fill": false
- }
- },
- "plots": {
- "outlineColor": "#1A1A1A"
- },
- "areas": {
- "opacity": 20
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "labels": {
- "quadrantLabels": {
- "tl": {
- "color": "#8A9892"
- },
- "tr": {
- "color": "#8A9892"
- },
- "br": {
- "color": "#8A9892"
- },
- "bl": {
- "color": "#8A9892"
- }
- },
- "plotLabels": {
- "color": "#8A9892"
- },
- "axisLabels": {
- "color": {
- "positive": "#99AA99",
- "negative": "#C09E85"
- }
- }
- },
- "grid": {
- "stroke": "#D2E0DB",
- "graduations": {
- "steps": 2,
- "color": "#D2E0DB",
- "stroke": "#D2E0DB",
- "roundingForce": 256
- }
- },
- "plots": {
- "outlineColor": "#fbfafa"
- },
- "areas": {
- "opacity": 40
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "labels": {
- "quadrantLabels": {
- "tl": {
- "color": "#61747E"
- },
- "tr": {
- "color": "#61747E"
- },
- "br": {
- "color": "#61747E"
- },
- "bl": {
- "color": "#61747E"
- }
- },
- "plotLabels": {
- "color": "#50606C"
- },
- "axisLabels": {
- "color": {
- "positive": "#4A6A75",
- "negative": "#7E8F7E"
- }
- }
- },
- "grid": {
- "stroke": "#9AA7B0",
- "graduations": {
- "color": "#DEE1DE",
- "stroke": "#DEE1DE",
- "roundingForce": 0
- }
- },
- "plots": {
- "outlineColor": "#fbfafa"
- },
- "areas": {
- "opacity": 40
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_gauge": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "track": {
- "useGradient": false
- },
- "markers": {
- "color": "#5D4037"
- },
- "pointer": {
- "type": "pointy",
- "stroke": "#FFF8E1",
- "circle": {
- "stroke": "#FFF8E1",
- "strokeWidth": 1,
- "color": "#5D4037"
- }
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "track": {
- "useGradient": false
- },
- "markers": {
- "color": "#BDBDBD"
- },
- "pointer": {
- "type": "pointy",
- "stroke": "#1E1E1E",
- "circle": {
- "stroke": "#1E1E1E",
- "strokeWidth": 1,
- "color": "#5D4037"
- }
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "track": {
- "useGradient": false
- },
- "markers": {
- "color": "#99CC99",
- "backgroundColor": "#1A1A1A",
- "stroke": "#66CC66"
- },
- "pointer": {
- "type": "pointy",
- "stroke": "#1A1A1A",
- "circle": {
- "stroke": "#66CC66",
- "strokeWidth": 1,
- "color": "#1A1A1A"
- }
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "track": {
- "useGradient": false
- },
- "markers": {
- "color": "#A0AC94",
- "backgroundColor": "#fbfafa",
- "stroke": "#EBD6CC"
- },
- "pointer": {
- "type": "rounded",
- "stroke": "#fbfafa",
- "circle": {
- "stroke": "#EBD6CC",
- "strokeWidth": 1,
- "color": "#fbfafa"
- }
- }
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "track": {
- "useGradient": false
- },
- "markers": {
- "color": "#4F5B75",
- "backgroundColor": "#4F5B75",
- "stroke": "#9FA9BE"
- },
- "pointer": {
- "type": "pointy",
- "stroke": "#f6f6fb",
- "circle": {
- "stroke": "#f6f6fb",
- "strokeWidth": 1,
- "color": "#4F5B75"
- }
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- }
- },
- "vue_ui_wheel": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "wheel": {
- "ticks": {
- "inactiveColor": "#5D403760",
- "activeColor": "#D32F2F",
- "gradient": {
- "shiftHueIntensity": 0
- }
- }
- },
- "innerCircle": {
- "stroke": "#5D403760"
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "wheel": {
- "ticks": {
- "inactiveColor": "#5D403780",
- "activeColor": "#D32F2F",
- "gradient": {
- "shiftHueIntensity": 0
- }
- }
- },
- "innerCircle": {
- "stroke": "#5D403760"
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "wheel": {
- "ticks": {
- "rounded": false,
- "inactiveColor": "#333333",
- "activeColor": "#66CC66",
- "gradient": {
- "shiftHueIntensity": 15
- }
- }
- },
- "innerCircle": {
- "show": false
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "wheel": {
- "ticks": {
- "inactiveColor": "#F7EDE2",
- "activeColor": "#B1A7AD",
- "gradient": {
- "shiftHueIntensity": 100
- }
- }
- },
- "innerCircle": {
- "show": false
- }
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "wheel": {
- "ticks": {
- "rounded": false,
- "inactiveColor": "#BBCBC7",
- "activeColor": "#6C94A0",
- "gradient": {
- "shiftHueIntensity": 10
- }
- }
- },
- "innerCircle": {
- "stroke": "#BBCBC7"
- }
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- }
- },
- "vue_ui_tiremarks": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "crescendo": false,
- "inactiveColor": "#5D403760",
- "activeColor": "#D32F2F",
- "ticks": {
- "gradient": {
- "shiftHueIntensity": 0
- }
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "crescendo": false,
- "inactiveColor": "#5D403760",
- "activeColor": "#D32F2F",
- "ticks": {
- "gradient": {
- "shiftHueIntensity": 0
- }
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "crescendo": false,
- "inactiveColor": "#333333",
- "activeColor": "#66CC66",
- "ticks": {
- "gradient": {
- "shiftHueIntensity": 15
- }
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "crescendo": true,
- "curved": true,
- "curveAngleX": 5,
- "curveAngleY": 5,
- "inactiveColor": "#F7EDE2",
- "activeColor": "#B1A7AD",
- "ticks": {
- "gradient": {
- "shiftHueIntensity": 15
- }
- }
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "crescendo": false,
- "inactiveColor": "#BBCBC7",
- "activeColor": "#6C94A0",
- "ticks": {
- "gradient": {
- "shiftHueIntensity": 10
- }
- }
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- }
- },
- "vue_ui_chestnut": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "grandTotal": {
- "color": "#424242"
- },
- "roots": {
- "stroke": "#FFF8E1",
- "labels": {
- "name": {
- "color": "#424242"
- }
- }
- },
- "verticalSeparator": {
- "stroke": "#FFF8E1"
- },
- "branches": {
- "borderRadius": 0,
- "labels": {
- "color": "#424242"
- }
- },
- "nuts": {
- "selected": {
- "labels": {
- "dataLabels": {
- "color": "#424242"
- },
- "core": {
- "total": {
- "color": "#424242"
- },
- "value": {
- "color": "#424242"
- }
- }
- }
- }
- },
- "legend": {
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "grandTotal": {
- "color": "#BDBDBD"
- },
- "roots": {
- "stroke": "#1E1E1E",
- "labels": {
- "name": {
- "color": "#BDBDBD"
- }
- }
- },
- "verticalSeparator": {
- "stroke": "#1E1E1E"
- },
- "branches": {
- "borderRadius": 0,
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "nuts": {
- "selected": {
- "labels": {
- "dataLabels": {
- "color": "#BDBDBD"
- },
- "core": {
- "total": {
- "color": "#BDBDBD"
- },
- "value": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "legend": {
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "grandTotal": {
- "color": "#99CC99"
- },
- "roots": {
- "stroke": "#1A1A1A",
- "labels": {
- "name": {
- "color": "#AACCAA"
- }
- }
- },
- "verticalSeparator": {
- "stroke": "#1A1A1A"
- },
- "branches": {
- "borderRadius": 0,
- "labels": {
- "color": "#AACCAA"
- }
- },
- "nuts": {
- "selected": {
- "labels": {
- "dataLabels": {
- "color": "#AACCAA"
- },
- "core": {
- "total": {
- "color": "#99CC99"
- },
- "value": {
- "color": "#AACCAA"
- }
- }
- }
- }
- },
- "legend": {
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "grandTotal": {
- "color": "#A0AC94"
- },
- "roots": {
- "stroke": "#fbfafa",
- "labels": {
- "name": {
- "color": "#A0AC94"
- }
- }
- },
- "verticalSeparator": {
- "stroke": "#fbfafa"
- },
- "branches": {
- "borderRadius": 12,
- "labels": {
- "color": "#A0AC94"
- }
- },
- "nuts": {
- "selected": {
- "labels": {
- "dataLabels": {
- "color": "#A0AC94"
- },
- "core": {
- "total": {
- "color": "#8A9892"
- },
- "value": {
- "color": "#A0AC94"
- }
- }
- }
- }
- },
- "legend": {
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "grandTotal": {
- "color": "#61747E"
- },
- "roots": {
- "stroke": "#f6f6fb",
- "labels": {
- "name": {
- "color": "#8A9892"
- }
- }
- },
- "verticalSeparator": {
- "stroke": "#f6f6fb"
- },
- "branches": {
- "borderRadius": 0,
- "labels": {
- "color": "#8A9892"
- }
- },
- "nuts": {
- "selected": {
- "labels": {
- "dataLabels": {
- "color": "#8A9892"
- },
- "core": {
- "total": {
- "color": "#8A9892"
- },
- "value": {
- "color": "#61747E"
- }
- }
- }
- }
- },
- "legend": {
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#61747E"
- }
- }
- }
- }
- }
- }
- },
- "vue_ui_onion": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "useGradient": false,
- "layout": {
- "gutter": {
- "color": "#5D403730"
- },
- "labels": {
- "color": "#424242"
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "useGradient": false,
- "layout": {
- "gutter": {
- "color": "#5D403730"
- },
- "labels": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "useGradient": false,
- "color": "#99AA99",
- "layout": {
- "gutter": {
- "color": "#2A2A2A"
- },
- "labels": {
- "color": "#99CC99"
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "useGradient": false,
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "gutter": {
- "color": "#F7EDE2"
- },
- "labels": {
- "color": "#A0AC94"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "useGradient": false,
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "gutter": {
- "color": "#DDDDDB"
- },
- "labels": {
- "color": "#61747E"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_vertical_bar": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": false,
- "dataLabels": {
- "color": "#424242"
- },
- "nameLabels": {
- "color": "#424242"
- },
- "parentLabels": {
- "color": "#424242"
- }
- },
- "highlighter": {
- "color": "#FF8A65"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": false,
- "dataLabels": {
- "color": "#BDBDBD"
- },
- "nameLabels": {
- "color": "#BDBDBD"
- },
- "parentLabels": {
- "color": "#FFF8E1"
- }
- },
- "highlighter": {
- "color": "#FF8A65"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": false,
- "dataLabels": {
- "color": "#AACCAA"
- },
- "nameLabels": {
- "color": "#99CC99"
- },
- "parentLabels": {
- "color": "#99CC99"
- }
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "bars": {
- "borderRadius": 8,
- "useGradient": true,
- "dataLabels": {
- "color": "#A0AC94"
- },
- "nameLabels": {
- "color": "#8A9892"
- },
- "parentLabels": {
- "color": "#8A9892"
- }
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": true,
- "dataLabels": {
- "color": "#61747E"
- },
- "nameLabels": {
- "color": "#8A9892"
- },
- "parentLabels": {
- "color": "#8A9892"
- }
- },
- "highlighter": {
- "color": "#50606C"
- },
- "separators": {
- "show": true,
- "color": "#DEE1DE"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_horizontal_bar": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": false,
- "dataLabels": {
- "color": "#424242"
- },
- "nameLabels": {
- "color": "#424242"
- },
- "parentLabels": {
- "color": "#424242"
- }
- },
- "highlighter": {
- "color": "#FF8A65"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": false,
- "dataLabels": {
- "color": "#BDBDBD"
- },
- "nameLabels": {
- "color": "#BDBDBD"
- },
- "parentLabels": {
- "color": "#FFF8E1"
- }
- },
- "highlighter": {
- "color": "#FF8A65"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": false,
- "dataLabels": {
- "color": "#AACCAA"
- },
- "nameLabels": {
- "color": "#99CC99"
- },
- "parentLabels": {
- "color": "#99CC99"
- }
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "bars": {
- "borderRadius": 8,
- "useGradient": true,
- "dataLabels": {
- "color": "#A0AC94"
- },
- "nameLabels": {
- "color": "#8A9892"
- },
- "parentLabels": {
- "color": "#8A9892"
- }
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "separators": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "bars": {
- "borderRadius": 0,
- "useGradient": true,
- "dataLabels": {
- "color": "#61747E"
- },
- "nameLabels": {
- "color": "#8A9892"
- },
- "parentLabels": {
- "color": "#8A9892"
- }
- },
- "highlighter": {
- "color": "#50606C"
- },
- "separators": {
- "show": true,
- "color": "#DEE1DE"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_heatmap": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "cells": {
- "colors": {
- "hot": "#D32F2F",
- "cold": "#FFE082"
- },
- "spacing": 0.5,
- "selected": {
- "color": "#B71C1C"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#424242"
- },
- "yAxis": {
- "color": "#424242"
- }
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight" : {
- "style": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "cells": {
- "colors": {
- "hot": "#D32F2F",
- "cold": "#FFE082"
- },
- "spacing": 0.5,
- "selected": {
- "color": "#B71C1C"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#BDBDBD"
- },
- "yAxis": {
- "color": "#BDBDBD"
- }
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "cells": {
- "colors": {
- "hot": "#008000",
- "cold": "#333333"
- },
- "spacing": 0.5,
- "selected": {
- "color": "#33FF33"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#AACCAA"
- },
- "yAxis": {
- "color": "#AACCAA"
- }
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- },
- "legend": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "cells": {
- "colors": {
- "hot": "#DFCA99",
- "cold": "#BBC4D3"
- },
- "spacing": 0.5,
- "selected": {
- "color": "#4F5B75"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#A0AC94"
- },
- "yAxis": {
- "color": "#A0AC94"
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "cells": {
- "colors": {
- "hot": "#6D7D65",
- "cold": "#6C94A5"
- },
- "spacing": 0.5,
- "selected": {
- "color": "#404C4D"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#61747E"
- },
- "yAxis": {
- "color": "#61747E"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_scatter": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "axis": {
- "stroke": "#5D403790"
- },
- "marginalBars": {
- "fill": "#5D4037"
- },
- "plots": {
- "stroke": "#FFF8E1",
- "selectors": {
- "stroke": "#5D4037",
- "labels": {
- "color": "#424242"
- },
- "markers": {
- "stroke": "#FFF8E1",
- "fill": "#D32F2F"
- }
- }
- },
- "correlation": {
- "label": {
- "color": "#424242"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#424242"
- },
- "yAxis": {
- "color": "#424242"
- }
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "axis": {
- "stroke": "#5D4037"
- },
- "marginalBars": {
- "fill": "#D32F2F"
- },
- "plots": {
- "stroke": "#1E1E1E",
- "selectors": {
- "stroke": "#BDBDBD",
- "labels": {
- "color": "#BDBDBD"
- },
- "markers": {
- "stroke": "#BDBDBD",
- "fill": "#D32F2F"
- }
- }
- },
- "correlation": {
- "label": {
- "color": "#BDBDBD"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#BDBDBD"
- },
- "yAxis": {
- "color": "#BDBDBD"
- }
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "axis": {
- "stroke": "#334C33"
- },
- "marginalBars": {
- "fill": "#66CC66"
- },
- "plots": {
- "stroke": "#1A1A1A",
- "selectors": {
- "stroke": "#66CC66",
- "labels": {
- "color": "#AACCAA"
- },
- "markers": {
- "stroke": "#66CC66",
- "fill": "#1A1A1A"
- }
- }
- },
- "correlation": {
- "label": {
- "color": "#AACCAA"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#AACCAA"
- },
- "yAxis": {
- "color": "#AACCAA"
- }
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "axis": {
- "stroke": "transparent"
- },
- "marginalBars": {
- "fill": "#B0B9A8"
- },
- "plots": {
- "stroke": "#fbfafa",
- "selectors": {
- "stroke": "#4F5B75",
- "labels": {
- "color": "#928A98"
- },
- "markers": {
- "stroke": "#4F5B75",
- "fill": "#fbfafa"
- }
- }
- },
- "correlation": {
- "label": {
- "color": "#928A98"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#928A98"
- },
- "yAxis": {
- "color": "#928A98"
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "axis": {
- "stroke": "#92B0B5"
- },
- "marginalBars": {
- "fill": "#ABB1BC"
- },
- "plots": {
- "stroke": "#fbfafa",
- "selectors": {
- "stroke": "#4F5B75",
- "labels": {
- "color": "#404C4D"
- },
- "markers": {
- "stroke": "#4F5B75",
- "fill": "#f6f6fb"
- }
- }
- },
- "correlation": {
- "label": {
- "color": "#61747E"
- }
- },
- "dataLabels": {
- "xAxis": {
- "color": "#61747E"
- },
- "yAxis": {
- "color": "#61747E"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_candlestick": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "selector": {
- "color": "#424242"
- },
- "grid": {
- "stroke": "#5D4037",
- "xAxis": {
- "dataLabels": {
- "color": "#424242"
- }
- },
- "yAxis": {
- "dataLabels": {
- "color": "#424242"
- }
- }
- },
- "wick": {
- "stroke": "#5D4037",
- "extremity": {
- "color": "#5D4037"
- }
- },
- "candle": {
- "stroke": "#FFF8E1",
- "colors": {
- "bullish": "#D32F2F",
- "bearish": "#F57C00"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "selector": {
- "color": "#FFF8E1"
- },
- "grid": {
- "stroke": "#5D4037",
- "xAxis": {
- "dataLabels": {
- "color": "#BDBDBD"
- }
- },
- "yAxis": {
- "dataLabels": {
- "color": "#BDBDBD"
- }
- }
- },
- "wick": {
- "stroke": "#BDBDBD",
- "extremity": {
- "color": "#BDBDBD"
- }
- },
- "candle": {
- "stroke": "#1E1E1E",
- "colors": {
- "bullish": "#D32F2F",
- "bearish": "#F57C00"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "selector": {
- "color": "#7DA9B5"
- },
- "grid": {
- "stroke": "#334C33",
- "xAxis": {
- "dataLabels": {
- "color": "#99CC99"
- }
- },
- "yAxis": {
- "dataLabels": {
- "color": "#99CC99"
- }
- }
- },
- "wick": {
- "stroke": "#334C33",
- "extremity": {
- "color": "#334C33"
- }
- },
- "candle": {
- "stroke": "#1A1A1A",
- "colors": {
- "bullish": "#00FF00",
- "bearish": "#334C33"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "zoom": {
- "color": "#5F6A5F",
- "highlightColor": "#66CC66"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "selector": {
- "color": "#8F837A"
- },
- "grid": {
- "stroke": "transparent",
- "xAxis": {
- "dataLabels": {
- "color": "#8A9892"
- }
- },
- "yAxis": {
- "dataLabels": {
- "color": "#8A9892"
- }
- }
- },
- "wick": {
- "stroke": "#D7E0D2",
- "extremity": {
- "shape": "circle",
- "size": 2,
- "color": "#C5B8A7"
- }
- },
- "candle": {
- "stroke": "#fbfafa",
- "colors": {
- "bullish": "#A0AC94",
- "bearish": "#C09E85"
- },
- "gradient": {
- "show": true
- }
- }
- },
- "zoom": {
- "color": "#E0CFC3",
- "highlightColor": "#8F837A"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "selector": {
- "color": "#7DA9B5"
- },
- "grid": {
- "stroke": "#334C33",
- "xAxis": {
- "dataLabels": {
- "color": "#61747E"
- }
- },
- "yAxis": {
- "dataLabels": {
- "color": "#61747E"
- }
- }
- },
- "wick": {
- "stroke": "#61747E",
- "extremity": {
- "color": "#61747E"
- }
- },
- "candle": {
- "stroke": "#1A1A1A",
- "colors": {
- "bullish": "#92B0AB",
- "bearish": "#EFECEC"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "zoom": {
- "color": "#92B0AB",
- "highlightColor": "#50606C"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_sparkline": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "line": {
- "color": "#D32F2F"
- },
- "bar": {
- "color": "#D32F2F",
- "borderRadius": 0
- },
- "zeroLine": {
- "color": "#5D4037"
- },
- "plot": {
- "stroke": "#FFF8E1"
- },
- "verticalIndicator": {
- "color": "#FF9800"
- },
- "dataLabel": {
- "color": "#424242"
- },
- "title": {
- "color": "#424242"
- },
- "area": {
- "color": "#E64A19"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "line": {
- "color": "#D32F2F"
- },
- "bar": {
- "color": "#D32F2F",
- "borderRadius": 0
- },
- "zeroLine": {
- "color": "#5D4037"
- },
- "plot": {
- "stroke": "#1E1E1E"
- },
- "verticalIndicator": {
- "color": "#B71C1C"
- },
- "dataLabel": {
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#BDBDBD"
- },
- "area": {
- "color": "#E64A19"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "line": {
- "color": "#66CC66"
- },
- "bar": {
- "color": "#66CC66",
- "borderRadius": 0
- },
- "zeroLine": {
- "color": "#5F6A5F"
- },
- "plot": {
- "stroke": "#1A1A1A"
- },
- "verticalIndicator": {
- "color": "#66CC66"
- },
- "dataLabel": {
- "color": "#AACCAA"
- },
- "title": {
- "color": "#66CC66"
- },
- "area": {
- "color": "#66CC66"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "line": {
- "color": "#B9B99D",
- "smooth": true
- },
- "bar": {
- "color": "#B9B99D",
- "borderRadius": 3
- },
- "zeroLine": {
- "strokeWidth": 0
- },
- "plot": {
- "stroke": "#fbfafa"
- },
- "verticalIndicator": {
- "color": "#B9B99D"
- },
- "dataLabel": {
- "color": "#A0AC94"
- },
- "title": {
- "color": "#8A9892"
- },
- "area": {
- "color": "#B9B99D"
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "line": {
- "color": "#4A6A75"
- },
- "bar": {
- "color": "#4A6A75",
- "borderRadius": 0
- },
- "zeroLine": {
- "color": "#9FA9BE"
- },
- "plot": {
- "stroke": "#f6f6fb"
- },
- "verticalIndicator": {
- "color": "#4A6A75"
- },
- "dataLabel": {
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C"
- },
- "area": {
- "color": "#4A6A75"
- }
- }
- }
- },
- "vue_ui_sparkbar": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "gutter": {
- "backgroundColor": "#ded6ca"
- },
- "bar": {
- "gradient": {
- "underlayerColor": "#FFF8E1"
- }
- },
- "labels": {
- "name": {
- "color": "#424242"
- }
- },
- "title": {
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "gutter": {
- "backgroundColor": "#2E2E2E"
- },
- "bar": {
- "gradient": {
- "underlayerColor": "#FFF8E1"
- }
- },
- "labels": {
- "name": {
- "color": "#BDBDBD"
- }
- },
- "title": {
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "gutter": {
- "backgroundColor": "#333333"
- },
- "bar": {
- "gradient": {
- "underlayerColor": "#1A1A1A"
- }
- },
- "labels": {
- "name": {
- "color": "#99CC99"
- }
- },
- "title": {
- "color": "#66CC66"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "gutter": {
- "backgroundColor": "#f5f0eb"
- },
- "bar": {
- "gradient": {
- "underlayerColor": "#fbfafa"
- }
- },
- "labels": {
- "name": {
- "color": "#8A9892"
- }
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "bar": {
- "gradient": {
- "underlayerColor": "#f6f6fb"
- }
- },
- "labels": {
- "name": {
- "color": "#50606C"
- }
- }
- }
- }
- },
- "vue_ui_sparkstackbar": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "bar": {
- "gradient": {
- "underlayerColor": "#FFF8E1"
- }
- },
- "legend": {
- "name": {
- "color": "#424242"
- },
- "value": {
- "color": "#424242"
- },
- "percentage": {
- "color": "#424242"
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "bar": {
- "gradient": {
- "underlayerColor": "#FFF8E1"
- }
- },
- "legend": {
- "name": {
- "color": "#BDBDBD"
- },
- "value": {
- "color": "#BDBDBD"
- },
- "percentage": {
- "color": "#BDBDBD"
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "bar": {
- "gradient": {
- "underlayerColor": "#1A1A1A"
- }
- },
- "legend": {
- "name": {
- "color": "#99AA99"
- },
- "value": {
- "color": "#AACCAA"
- },
- "percentage": {
- "color": "#99CC99"
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "bar": {
- "gradient": {
- "underlayerColor": "#fbfafa"
- }
- },
- "legend": {
- "name": {
- "color": "#8A9892"
- },
- "value": {
- "color": "#A0AC94"
- },
- "percentage": {
- "color": "#8A9892"
- }
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "bar": {
- "gradient": {
- "underlayerColor": "#f6f6fb"
- }
- },
- "legend": {
- "name": {
- "color": "#50606C"
- },
- "value": {
- "color": "#8A9892"
- },
- "percentage": {
- "color": "#61747E"
- }
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- },
- "vue_ui_sparkhistogram": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "bars": {
- "colors": {
- "positive": "#D32F2F",
- "negative":"#F57C00"
- }
- },
- "labels": {
- "value": {
- "color": "#424242"
- },
- "valueLabel": {
- "color": "#424242"
- },
- "timeLabel": {
- "color": "#757575"
- }
- },
- "selector": {
- "stroke": "#D32F2F"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "bars": {
- "colors": {
- "positive": "#D32F2F",
- "negative":"#F57C00"
- }
- },
- "labels": {
- "value": {
- "color": "#BDBDBD"
- },
- "valueLabel": {
- "color": "#BDBDBD"
- },
- "timeLabel": {
- "color": "#BDBDBD"
- }
- },
- "selector": {
- "stroke": "#D32F2F"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "bars": {
- "colors": {
- "positive": "#66CC66"
- }
- },
- "labels": {
- "value": {
- "color": "#AACCAA"
- },
- "valueLabel": {
- "color": "#99CC99"
- },
- "timeLabel": {
- "color": "#99AA99"
- }
- },
- "selector": {
- "stroke": "#00FF00"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "bars": {
- "colors": {
- "positive": "#B9B99D",
- "negative": "#C09E85"
- }
- },
- "labels": {
- "value": {
- "color": "#A0AC94"
- },
- "valueLabel": {
- "color": "#A0AC94"
- },
- "timeLabel": {
- "color": "#8A9892"
- }
- },
- "selector": {
- "stroke": "#BBC4D3"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "bars": {
- "colors": {
- "positive": "#4A6A75"
- }
- },
- "labels": {
- "value": {
- "color": "#61747E"
- },
- "valueLabel": {
- "color": "#8A9892"
- },
- "timeLabel": {
- "color": "#50606C"
- }
- },
- "selector": {
- "stroke": "#404C4D"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- },
- "vue_ui_sparkgauge": {
- "default": {},
- "celebration": {
- "style": {
- "background": "#FFF8E1",
- "title": {
- "color": "#424242"
- },
- "dataLabel": {
- "color": "#424242"
- },
- "colors": {
- "min": "#F57C00",
- "max": "#D32F2F"
- },
- "gutter": {
- "color": "#5D403740"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "background": "#1E1E1E",
- "title": {
- "color": "#BDBDBD"
- },
- "dataLabel": {
- "color": "#BDBDBD"
- },
- "colors": {
- "min": "#F57C00",
- "max": "#D32F2F"
- },
- "gutter": {
- "color": "#5D403740"
- }
- }
- },
- "hack": {
- "style": {
- "background": "#1A1A1A",
- "title": {
- "color": "#66CC66"
- },
- "dataLabel": {
- "color": "#AACCAA"
- },
- "colors": {
- "min": "#334C33",
- "max": "#33CC33"
- },
- "track": {
- "color": "#33CC33"
- },
- "gutter": {
- "color": "#333333"
- }
- }
- },
- "zen": {
- "style": {
- "background": "#fbfafa",
- "title": {
- "color": "#8A9892"
- },
- "dataLabel": {
- "color": "#A0AC94"
- },
- "colors": {
- "min": "#C09E85",
- "max": "#B9B99D"
- },
- "track": {
- "color": "#B9B99D"
- },
- "gutter": {
- "color": "#f5f0eb"
- }
- }
- },
- "concrete": {
- "style": {
- "background": "#f6f6fb",
- "title": {
- "color": "#50606C"
- },
- "dataLabel": {
- "color": "#61747E"
- },
- "colors": {
- "min": "#92B0AB",
- "max": "#4A6A75"
- },
- "track": {
- "color": "#4A6A75"
- },
- "gutter": {
- "color": "#e1e5e8"
- }
- }
- }
- },
- "vue_ui_spark_trend": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "line": {
- "smooth": false
- },
- "dataLabel": {
- "color":"#424242"
- },
- "trendLabel": {
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "line": {
- "smooth": false
- },
- "dataLabel": {
- "color":"#BDBDBD"
- },
- "trendLabel": {
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "line": {
- "stroke": "#00FF00",
- "smooth": false
- },
- "dataLabel": {
- "color":"#AACCAA"
- },
- "trendLabel": {
- "color": "#99CC99"
- },
- "arrow": {
- "colors": {
- "positive": "#66CC66",
- "negative": "#196619"
- }
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "line": {
- "stroke": "#B9B99D"
- },
- "dataLabel": {
- "color":"#8A9892"
- },
- "trendLabel": {
- "color": "#99CC99"
- },
- "arrow": {
- "colors": {
- "positive": "#B9B99D",
- "negative": "#C09E85",
- "neutral": "#A5AFC1"
- }
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "line": {
- "stroke": "#4A6A75"
- },
- "dataLabel": {
- "color":"#61747E"
- },
- "trendLabel": {
- "color": "#8A9892"
- },
- "arrow": {
- "colors": {
- "positive": "#4A6A75",
- "negative": "#C09E85",
- "neutral": "#ABB1BC"
- }
- }
- }
- }
- },
- "vue_ui_quick_chart": {
- "default": {},
- "celebration": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242",
- "xyAxisStroke": "#5D4037",
- "xyGridStroke": "#5D403760",
- "xyHighlighterColor": "#424242",
- "zoomColor": "#5D4037",
- "zoomHighlightColor": "#FF8A65",
- "zoomMinimap": {
- "lineColor": "#424242",
- "selectedColor": "#FF8A65"
- },
- "tooltipBorderColor": "#FF8A65",
- "tooltipBackgroundOpacity": 30
- },
- "celebrationNight": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD",
- "xyAxisStroke": "#5D4037",
- "xyGridStroke": "#5D403780",
- "xyHighlighterColor": "#FFF8E1",
- "zoomColor": "#5D4037",
- "zoomHighlightColor": "#FF8A65",
- "zoomMinimap": {
- "lineColor": "#FF6B6B",
- "selectedColor": "#FF8A65",
- "indicatorColor": "#FF8A65"
- },
- "tooltipBorderColor": "#FF8A65",
- "tooltipBackgroundOpacity": 30
- },
- "hack": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "xyAxisStroke": "#5F6A5F",
- "xyGridStroke": "#333333",
- "xyHighlighterColor": "#66CC66",
- "zoomColor": "#5F6A5F",
- "zoomHighlightColor": "#66CC66",
- "tooltipBorderColor": "#66CC66"
- },
- "zen": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "xyAxisStroke": "transparent",
- "xyGridStroke": "transparent",
- "xyHighlighterColor": "#8F837A",
- "zoomColor": "#E0CFC3",
- "zoomHighlightColor": "#8F837A"
- },
- "concrete": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "xyAxisStroke": "#829C98",
- "xyGridStroke": "#CCD6D3",
- "xyHighlighterColor": "#7DA9B5",
- "zoomColor": "#92B0AB",
- "zoomHighlightColor": "#50606C"
- }
- },
- "vue_ui_age_pyramid": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "grid": {
- "stroke": "#5D4037"
- },
- "dataLabels": {
- "sideTitles": {
- "color": "#424242"
- },
- "xAxis": {
- "color": "#424242"
- },
- "yAxis": {
- "color": "#424242"
- }
- },
- "bars": {
- "borderRadius": 0,
- "gap": 1,
- "left": {
- "color": "#F57C00"
- },
- "right": {
- "color": "#D32F2F"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "highlighter": {
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "grid": {
- "stroke": "#5D4037"
- },
- "dataLabels": {
- "sideTitles": {
- "color": "#BDBDBD"
- },
- "xAxis": {
- "color": "#BDBDBD"
- },
- "yAxis": {
- "color": "#BDBDBD"
- }
- },
- "bars": {
- "borderRadius": 0,
- "gap": 1,
- "left": {
- "color": "#F57C00"
- },
- "right": {
- "color": "#D32F2F"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "highlighter": {
- "color": "#FFF8E1"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "grid": {
- "stroke": "#5F6A5F"
- },
- "dataLabels": {
- "sideTitles": {
- "color": "#AACCAA"
- },
- "xAxis": {
- "color": "#5F6A5F"
- },
- "yAxis": {
- "color": "#5F6A5F"
- }
- },
- "bars": {
- "borderRadius": 0,
- "gap": 1,
- "left": {
- "color": "#668066"
- },
- "right": {
- "color": "#66CC66"
- },
- "gradient": {
- "show": false
- }
- }
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "grid": {
- "stroke": "#5F6A5F"
- },
- "dataLabels": {
- "sideTitles": {
- "color": "#8A9892"
- },
- "xAxis": {
- "show": false
- },
- "yAxis": {
- "show": false
- }
- },
- "bars": {
- "borderRadius": 6,
- "gap": 1,
- "left": {
- "color": "#DCB482"
- },
- "right": {
- "color": "#B9B99D"
- },
- "gradient": {
- "show": true
- }
- }
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "grid": {
- "stroke": "#5F6A5F"
- },
- "dataLabels": {
- "sideTitles": {
- "color": "#61747E"
- },
- "xAxis": {
- "color": "#61747E"
- },
- "yAxis": {
- "color": "#61747E"
- }
- },
- "bars": {
- "borderRadius": 0,
- "gap": 1,
- "left": {
- "color": "#A1B5A3"
- },
- "right": {
- "color": "#7DA9B5"
- },
- "gradient": {
- "show": true,
- "intensity": 10
- }
- }
- },
- "highlighter": {
- "color": "#7DA9B5"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_relation_circle": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "labels": {
- "color": "#424242"
- },
- "circle": {
- "stroke": "#5D403780"
- },
- "plot": {
- "color": "#5D4037"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "labels": {
- "color": "#BDBDBD"
- },
- "circle": {
- "stroke": "#5D403780"
- },
- "plot": {
- "color": "#5D4037"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "labels": {
- "color": "#AACCAA"
- },
- "circle": {
- "stroke": "#333333"
- },
- "plot": {
- "color": "#66CC66"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "labels": {
- "color": "#A0AC94"
- },
- "circle": {
- "stroke": "transparent"
- },
- "plot": {
- "color": "#C09E85"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "labels": {
- "color": "#61747E"
- },
- "circle": {
- "stroke": "#D2D7E0"
- },
- "plot": {
- "color": "#97ACB7"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- },
- "vue_ui_thermometer": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "graduations": {
- "stroke": "#FFF8E1",
- "strokeWidth": 1,
- "gradient": {
- "show": true
- }
- },
- "label": {
- "color": "#424242"
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "graduations": {
- "stroke": "#5D4037",
- "strokeWidth": 1,
- "gradient": {
- "show": true
- }
- },
- "label": {
- "color": "#BDBDBD"
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "graduations": {
- "stroke": "#1A1A1A",
- "strokeWidth": 1,
- "gradient": {
- "show": true
- }
- },
- "label": {
- "color": "#66CC66"
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "graduations": {
- "show": false,
- "gradient": {
- "show": true
- }
- },
- "label": {
- "color": "#B9B99D"
- }
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "graduations": {
- "stroke": "#1A1A1A",
- "gradient": {
- "show": true
- }
- },
- "label": {
- "color": "#61747E"
- }
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- },
- "vue_ui_rings": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "rings": {
- "stroke": "#5D4037",
- "strokeWidth": 10
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "rings": {
- "stroke": "#2E2E2E",
- "strokeWidth": 10
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "rings": {
- "stroke": "#1A1A1A",
- "strokeWidth": 10
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "rings": {
- "stroke": "#fbfafa",
- "strokeWidth": 10
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "rings": {
- "stroke": "#fbfafa",
- "strokeWidth": 10
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_donut_evolution": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "layout": {
- "grid": {
- "stroke": "#5D4037",
- "showVerticalLines": false,
- "yAxis": {
- "dataLabels": {
- "color": "#424242"
- }
- },
- "xAxis": {
- "dataLabels": {
- "color": "#424242"
- }
- }
- },
- "line": {
- "stroke": "#5D4037"
- },
- "highlighter": {
- "color": "#424242"
- },
- "dataLabels": {
- "color": "#424242"
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "layout": {
- "grid": {
- "stroke": "#5D4037",
- "showVerticalLines": false,
- "yAxis": {
- "dataLabels": {
- "color": "#BDBDBD"
- }
- },
- "xAxis": {
- "dataLabels": {
- "color": "#BDBDBD"
- }
- }
- },
- "line": {
- "stroke": "#5D4037"
- },
- "highlighter": {
- "color": "#FFF8E1"
- },
- "dataLabels": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "zoom": {
- "color": "#5F6A5F",
- "highlightColor": "#66CC66"
- },
- "layout": {
- "grid": {
- "show": false,
- "stroke": "#5F6A5F",
- "yAxis": {
- "dataLabels": {
- "color": "#AACCAA"
- }
- },
- "xAxis": {
- "dataLabels": {
- "color": "#AACCAA"
- }
- }
- },
- "line": {
- "stroke": "#5F6A5F"
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "dataLabels": {
- "color": "#AACCAA"
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "zoom": {
- "color": "#E0CFC3",
- "highlightColor": "#8F837A"
- },
- "layout": {
- "grid": {
- "show": false,
- "yAxis": {
- "dataLabels": {
- "show": false
- }
- },
- "xAxis": {
- "dataLabels": {
- "show": false
- }
- }
- },
- "line": {
- "stroke": "#DCDFE7"
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "dataLabels": {
- "color": "#A0AC94"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "zoom": {
- "color": "#92B0AB",
- "highlightColor": "#50606C"
- },
- "layout": {
- "grid": {
- "stroke": "#BBC4D3",
- "yAxis": {
- "dataLabels": {
- "color": "#61747E"
- }
- },
- "xAxis": {
- "dataLabels": {
- "color": "#61747E"
- }
- }
- },
- "line": {
- "stroke": "#92B0AB"
- },
- "highlighter": {
- "color": "#50606C"
- },
- "dataLabels": {
- "color": "#61747E"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_mood_radar": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "grid": {
- "stroke": "#5D403780"
- },
- "outerPolygon": {
- "stroke": "#5D4037"
- },
- "dataPolygon": {
- "color": "#D32F2F",
- "stroke": "#D32F2F"
- },
- "smileys": {
- "colors": {
- "5": "#D32F2F",
- "4": "#E64A19",
- "3": "#F57C00",
- "2": "#FF9800",
- "1": "#FFC107"
- }
- },
- "dataLabel": {
- "color": "#424242"
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "grid": {
- "stroke": "#5D403780"
- },
- "outerPolygon": {
- "stroke": "#5D4037"
- },
- "dataPolygon": {
- "color": "#D32F2F",
- "stroke": "#D32F2F"
- },
- "smileys": {
- "colors": {
- "5": "#D32F2F",
- "4": "#E64A19",
- "3": "#F57C00",
- "2": "#FF9800",
- "1": "#FFC107"
- }
- },
- "dataLabel": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "grid": {
- "stroke": "#333333"
- },
- "outerPolygon": {
- "stroke": "#334C33"
- },
- "dataPolygon": {
- "color": "#33B333",
- "stroke": "#00FF00"
- },
- "smileys": {
- "colors": {
- "1": "#336633",
- "2": "#338033",
- "3": "#339933",
- "4": "#33E633",
- "5": "#00FF00"
- }
- },
- "dataLabel": {
- "color": "#00FF00"
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "grid": {
- "stroke": "#C5B8A7"
- },
- "outerPolygon": {
- "strokeWidth": 0
- },
- "dataPolygon": {
- "color": "#858480",
- "stroke": "#C09E85"
- },
- "smileys": {
- "colors": {
- "1": "#C09E85",
- "2": "#DCB482",
- "3": "#DFCA99",
- "4": "#E0CFC3",
- "5": "#B9B99D"
- }
- },
- "dataLabel": {
- "color": "#606C5A"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "grid": {
- "stroke": "#61747E"
- },
- "outerPolygon": {
- "stroke": "#50606C"
- },
- "dataPolygon": {
- "color": "#A3C4BE",
- "stroke": "#92B0B5"
- },
- "smileys": {
- "colors": {
- "1": "#5C6B5B",
- "2": "#4A6A75",
- "3": "#6C94A0",
- "4": "#7DA9B5",
- "5": "#8EBFCA"
- }
- },
- "dataLabel": {
- "color": "#50606C"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_molecule": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "nodes": {
- "stroke": "#333333",
- "strokeHovered": "#FFFFFF"
- },
- "links": {
- "stroke": "#333333"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "nodes": {
- "stroke": "#333333",
- "strokeHovered": "#FFF8E1"
- },
- "links": {
- "stroke": "#333333"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "nodes": {
- "stroke": "#1A1A1A",
- "strokeHovered": "#00FF00"
- },
- "links": {
- "stroke": "#333333"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "nodes": {
- "stroke": "#fbfafa",
- "strokeHovered": "#5E5E5E"
- },
- "links": {
- "stroke": "#e8ede1"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "nodes": {
- "stroke": "#61747E",
- "strokeHovered": "#404C4D"
- },
- "links": {
- "stroke": "#BBCBC7"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_nested_donuts": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "labels": {
- "dataLabels": {
- "color": "#424242"
- }
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "labels": {
- "dataLabels": {
- "color": "#BDBDBD"
- }
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "labels": {
- "dataLabels": {
- "color": "#AACCAA"
- }
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "labels": {
- "dataLabels": {
- "color": "#A0AC94"
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "labels": {
- "dataLabels": {
- "color": "#61747E"
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_galaxy": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "layout": {
- "arcs": {
- "gradient": {
- "show": false
- }
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "layout": {
- "arcs": {
- "gradient": {
- "show": false
- }
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "layout": {
- "arcs": {
- "gradient": {
- "color": "#1A1A1A"
- }
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "layout": {
- "arcs": {
- "gradient": {
- "color": "#fbfafa"
- }
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "layout": {
- "arcs": {
- "gradient": {
- "show": false
- }
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_strip_plot": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "grid": {
- "stroke": "#5D4037",
- "horizontalGrid": {
- "show": false
- },
- "verticalGrid": {
- "show": false
- }
- },
- "plots": {
- "stroke": "#FFF8E1"
- },
- "labels": {
- "bestPlotLabel": {
- "color": "#424242"
- },
- "axis": {
- "color": "#424242"
- },
- "xAxisLabels": {
- "color": "#424242"
- },
- "yAxisLabels": {
- "color": "#424242"
- }
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "grid": {
- "stroke": "#5D4037",
- "horizontalGrid": {
- "show": false
- },
- "verticalGrid": {
- "show": false
- }
- },
- "plots": {
- "stroke": "#1E1E1E"
- },
- "labels": {
- "bestPlotLabel": {
- "color": "#BDBDBD"
- },
- "axis": {
- "color": "#BDBDBD"
- },
- "xAxisLabels": {
- "color": "#BDBDBD"
- },
- "yAxisLabels": {
- "color": "#BDBDBD"
- }
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "grid": {
- "stroke": "#5F6A5F",
- "horizontalGrid": {
- "show": false
- },
- "verticalGrid": {
- "show": false
- }
- },
- "plots": {
- "stroke": "#00FF00"
- },
- "labels": {
- "bestPlotLabel": {
- "color": "#AACCAA"
- },
- "axis": {
- "color": "#99CC99"
- },
- "xAxisLabels": {
- "color": "#99CC99"
- },
- "yAxisLabels": {
- "color": "#99CC99"
- }
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "grid": {
- "show": false,
- "horizontalGrid": {
- "show": false
- },
- "verticalGrid": {
- "show": false
- }
- },
- "plots": {
- "stroke": "#fbfafa"
- },
- "labels": {
- "bestPlotLabel": {
- "color": "#A0AC94"
- },
- "axis": {
- "color": "#A0AC94"
- },
- "xAxisLabels": {
- "color": "#A0AC94"
- },
- "yAxisLabels": {
- "show": false,
- "color": "#A0AC94"
- }
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "grid": {
- "stroke": "#829C98",
- "horizontalGrid": {
- "stroke": "#829C98"
- },
- "verticalGrid": {
- "stroke": "#829C98"
- }
- },
- "plots": {
- "stroke": "#404C5A"
- },
- "labels": {
- "bestPlotLabel": {
- "color": "#61747E"
- },
- "axis": {
- "color": "#61747E"
- },
- "xAxisLabels": {
- "color": "#61747E"
- },
- "yAxisLabels": {
- "color": "#61747E"
- }
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_dumbbell": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "plots": {
- "startColor": "#F57C00",
- "endColor": "#D32F2F",
- "stroke": "#FFF8E1"
- },
- "grid": {
- "horizontalGrid": {
- "stroke": "#5D403780"
- },
- "verticalGrid": {
- "stroke": "#5D403780"
- }
- },
- "labels": {
- "yAxisLabels": {
- "color": "#424242"
- },
- "xAxisLabels": {
- "color": "#424242"
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "plots": {
- "startColor": "#F57C00",
- "endColor": "#D32F2F",
- "stroke": "#1E1E1E"
- },
- "grid": {
- "horizontalGrid": {
- "stroke": "#5D4037"
- },
- "verticalGrid": {
- "stroke": "#5D4037"
- }
- },
- "labels": {
- "yAxisLabels": {
- "color": "#BDBDBD"
- },
- "xAxisLabels": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "plots": {
- "startColor": "#008000",
- "endColor": "#00FF00",
- "stroke": "#1A1A1A"
- },
- "grid": {
- "horizontalGrid": {
- "stroke": "#5F6A5F"
- },
- "verticalGrid": {
- "stroke": "#5F6A5F"
- }
- },
- "labels": {
- "yAxisLabels": {
- "color": "#99CC99"
- },
- "xAxisLabels": {
- "color": "#99CC99"
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "plots": {
- "startColor": "#DCB482",
- "endColor": "#B9B99D",
- "stroke": "#fbfafa"
- },
- "grid": {
- "horizontalGrid": {
- "show": false
- },
- "verticalGrid": {
- "show": false
- }
- },
- "labels": {
- "yAxisLabels": {
- "color": "#8A9892"
- },
- "xAxisLabels": {
- "show": false
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "plots": {
- "startColor": "#718885",
- "endColor": "#7DA9B5",
- "stroke": "#404C5A"
- },
- "grid": {
- "horizontalGrid": {
- "stroke": "#829C98"
- },
- "verticalGrid": {
- "stroke": "#829C98"
- }
- },
- "labels": {
- "yAxisLabels": {
- "color": "#61747E"
- },
- "xAxisLabels": {
- "color": "#61747E"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_3d_bar": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "bar": {
- "color": "#D32F2F"
- },
- "box": {
- "stroke": "#5D4037"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "legend": {
- "color": "#424242"
- },
- "dataLabel": {
- "color": "#424242"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "bar": {
- "color": "#D32F2F"
- },
- "box": {
- "stroke": "#5D4037"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "color": "#BDBDBD"
- },
- "dataLabel": {
- "color": "#BDBDBD"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "bar": {
- "color": "#66CC66"
- },
- "box": {
- "stroke": "#333333"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "color": "#99AA99"
- },
- "dataLabel": {
- "color": "#AACCAA"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "bar": {
- "color": "#B9B99D"
- },
- "box": {
- "stroke": "#DCDFE7"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "color": "#99AA99"
- },
- "dataLabel": {
- "color": "#A0AC94"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "bar": {
- "color": "#4A6A75"
- },
- "box": {
- "stroke": "#DEE1DE"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "legend": {
- "color": "#61747E"
- },
- "dataLabel": {
- "color": "#61747E"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_table_sparkline": {
- "default": {},
- "celebration": {
- "title": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "thead": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "tbody": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- }
- },
- "celebrationNight": {
- "title": {
- "backgroundColor":"#1E1E1E",
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "thead": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "tbody": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- }
- },
- "hack": {
- "title": {
- "backgroundColor":"#1A1A1A",
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "thead": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99"
- },
- "tbody": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99"
- }
- },
- "zen": {
- "title": {
- "backgroundColor":"#fbfafa",
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "thead": {
- "backgroundColor":"#fbfafa",
- "color": "#8A9892"
- },
- "tbody": {
- "backgroundColor":"#fbfafa",
- "color": "#A0AC94"
- }
- },
- "concrete": {
- "title": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "thead": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C"
- },
- "tbody": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C"
- }
- }
- },
- "vue_ui_table_heatmap": {
- "default": {},
- "celebration": {
- "style": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242",
- "heatmapColors": {
- "min": "#FFECB3",
- "max": "#D32F2F"
- }
- },
- "table": {
- "head": {
- "backgroundColor": "#FFF8E1",
- "color":"#424242"
- }
- }
- },
- "hack": {
- "style": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "heatmapColors": {
- "min": "#333333",
- "max": "#66CC66"
- }
- },
- "table": {
- "head": {
- "backgroundColor": "#1A1A1A",
- "color":"#99AA99"
- }
- }
- },
- "zen": {
- "style": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "heatmapColors": {
- "max": "#C09E85",
- "min": "#DCDFE7"
- }
- },
- "table": {
- "head": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- }
- }
- },
- "concrete": {
- "style": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "heatmapColors": {
- "max": "#4A6A75",
- "min": "#EFECEC"
- }
- },
- "table": {
- "head": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_word_cloud": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "words": {
- "selectedStroke": "#FFF8E1"
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "words": {
- "selectedStroke": "#1E1E1E"
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "words": {
- "selectedStroke": "#1A1A1A"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "words": {
- "selectedStroke": "#fbfafa"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "words": {
- "selectedStroke": "#f6f6fb"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_xy_canvas": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "selector": {
- "color": "#5D4037"
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "grid": {
- "y": {
- "axisColor": "#5D4037",
- "axisLabels": {
- "color": "#424242"
- },
- "verticalLines": {
- "show": false
- }
- },
- "x": {
- "axisColor": "#5D4037",
- "horizontalLines": {
- "color": "#9A9A9A"
- },
- "timeLabels": {
- "color": "#424242"
- }
- },
- "zeroLine": {
- "color": "#424242"
- }
- },
- "dataLabels": {
- "color": "#424242"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "selector": {
- "color": "#BDBDBD"
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "grid": {
- "y": {
- "axisColor": "#5D4037",
- "axisLabels": {
- "color": "#BDBDBD"
- },
- "verticalLines": {
- "show": false
- }
- },
- "x": {
- "axisColor": "#5D4037",
- "horizontalLines": {
- "color": "#3A3A3A"
- },
- "timeLabels": {
- "color": "#BDBDBD"
- }
- },
- "zeroLine": {
- "color": "#5D4037"
- }
- },
- "dataLabels": {
- "color": "#BDBDBD"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "zoom": {
- "color": "#5F6A5F",
- "highlightColor": "#66CC66"
- },
- "selector": {
- "color": "#66CC66"
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66",
- "borderRadius": 0
- },
- "grid": {
- "y": {
- "axisColor": "#5F6A5F",
- "axisLabels": {
- "color": "#99AA99"
- },
- "verticalLines": {
- "show": false
- }
- },
- "x": {
- "axisColor": "#5F6A5F",
- "horizontalLines": {
- "color": "#3A3A3A"
- },
- "timeLabels": {
- "color": "#99AA99"
- }
- },
- "zeroLine": {
- "color": "#444444"
- }
- },
- "dataLabels": {
- "color": "#99AA99"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "zoom": {
- "color": "#E0CFC3",
- "highlightColor": "#8F837A"
- },
- "selector": {
- "color": "#8F837A"
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "grid": {
- "y": {
- "axisColor": "#8F837A",
- "axisLabels": {
- "color": "#8F837A"
- },
- "verticalLines": {
- "show": false
- }
- },
- "x": {
- "axisColor": "#8F837A",
- "horizontalLines": {
- "show": false,
- "alternate": false
- },
- "timeLabels": {
- "color": "#8F837A"
- }
- },
- "zeroLine": {
- "color": "#444444"
- }
- },
- "dataLabels": {
- "color": "#8F837A"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "zoom": {
- "color": "#92B0AB",
- "highlightColor": "#50606C"
- },
- "selector": {
- "color": "#7DA9B5"
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "grid": {
- "y": {
- "axisColor": "#829C98",
- "axisLabels": {
- "color": "#50606C"
- },
- "verticalLines": {
- "show": false
- }
- },
- "x": {
- "axisColor": "#829C98",
- "timeLabels": {
- "color": "#50606C"
- }
- },
- "zeroLine": {
- "color": "#444444"
- }
- },
- "dataLabels": {
- "color": "#50606C"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_flow": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "legend": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "nodes": {
- "stroke": "#3A3A3A"
- },
- "links": {
- "stroke": "#3A3A3A"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "nodes": {
- "stroke": "#1E1E1E"
- },
- "links": {
- "stroke": "#1E1E1E"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor":"#1A1A1A",
- "color": "#99AA99",
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "nodes": {
- "stroke": "#1A1A1A"
- },
- "links": {
- "stroke": "#1A1A1A"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "nodes": {
- "stroke": "#fbfafa"
- },
- "links": {
- "stroke": "#fbfafa"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "nodes": {
- "stroke": "#f6f6fb"
- },
- "links": {
- "stroke": "#f6f6fb"
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_parallel_coordinate_plot": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "yAxis": {
- "stroke": "#5D4037",
- "labels": {
- "axisNamesColor": "#424242",
- "ticks": {
- "color": "#424242"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "yAxis": {
- "stroke": "#5D4037",
- "labels": {
- "axisNamesColor": "#BDBDBD",
- "ticks": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66",
- "borderRadius": 0
- },
- "yAxis": {
- "stroke": "#3A3A3A",
- "labels": {
- "axisNamesColor": "#99AA99",
- "ticks": {
- "color": "#5A5A5A"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "yAxis": {
- "stroke": "#8F837A",
- "labels": {
- "axisNamesColor": "#8F837A",
- "ticks": {
- "color": "#8F837A"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "yAxis": {
- "stroke": "#50606C",
- "labels": {
- "axisNamesColor": "#50606C",
- "ticks": {
- "color": "#50606C"
- }
- }
- }
- }
- },
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- }
- }
- },
- "vue_ui_stackbar": {
- "default": {},
- "celebration": {
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "highlighter": {
- "color": "#424242"
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "bars": {
- "totalValues": {
- "color": "#424242"
- }
- },
- "grid": {
- "x": {
- "axisColor": "#5D403780",
- "axisName": {
- "color": "#424242"
- },
- "timeLabels": {
- "color": "#424242"
- }
- },
- "y": {
- "axisColor": "#5D403780",
- "axisName": {
- "color": "#424242"
- },
- "axisLabels": {
- "color": "#424242"
- }
- }
- }
- }
- }
- },
- "celebrationNight": {
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "zoom": {
- "color": "#5D4037",
- "highlightColor": "#FF8A65"
- },
- "highlighter": {
- "color": "#FFF8E1"
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "bars": {
- "totalValues": {
- "color": "#BDBDBD"
- }
- },
- "grid": {
- "x": {
- "axisColor": "#5D403740",
- "axisName": {
- "color": "#BDBDBD"
- },
- "timeLabels": {
- "color": "#BDBDBD"
- }
- },
- "y": {
- "axisColor": "#5D4037",
- "axisName": {
- "color": "#BDBDBD"
- },
- "axisLabels": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- }
- },
- "hack": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "zoom": {
- "color": "#5F6A5F",
- "highlightColor": "#66CC66"
- },
- "highlighter": {
- "color": "#66CC66"
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- },
- "bars": {
- "totalValues": {
- "color": "#99AA99"
- }
- },
- "grid": {
- "x": {
- "axisColor": "#5F6A5F",
- "axisName": {
- "color": "#66CC66"
- },
- "timeLabels": {
- "color": "#99AA99"
- }
- },
- "y": {
- "axisColor": "#5F6A5F",
- "axisName": {
- "color": "#66CC66"
- },
- "axisLabels": {
- "color": "#99AA99"
- }
- }
- }
- }
- }
- },
- "zen": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "zoom": {
- "color": "#E0CFC3",
- "highlightColor": "#8F837A"
- },
- "highlighter": {
- "color": "#8F837A"
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "bars": {
- "borderRadius": 4,
- "totalValues": {
- "show": false
- },
- "dataLabels": {
- "show": false
- }
- },
- "grid": {
- "x": {
- "showAxis": false,
- "axisName": {
- "color": "#8F837A"
- },
- "timeLabels": {
- "show": false
- }
- },
- "y": {
- "showAxis": false,
- "axisName": {
- "color": "#8F837A"
- },
- "axisLabels": {
- "show": false
- }
- }
- }
- }
- }
- },
- "concrete": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "zoom": {
- "color": "#92B0AB",
- "highlightColor": "#50606C"
- },
- "highlighter": {
- "color": "#7DA9B5"
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "bars": {
- "totalValues": {
- "color": "#50606C"
- }
- },
- "grid": {
- "x": {
- "showHorizontalLines": true,
- "axisColor": "#829C98",
- "axisName": {
- "color": "#50606C"
- },
- "timeLabels": {
- "color": "#61747E"
- }
- },
- "y": {
- "showVerticalLines": true,
- "axisColor": "#829C98",
- "axisName": {
- "color": "#50606C"
- },
- "axisLabels": {
- "color": "#61747E"
- }
- }
- }
- }
- }
- }
- },
- "vue_ui_bullet": {
- "default": {},
- "celebration": {
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "segments": {
- "baseColor": "#D32F2F",
- "dataLabels": {
- "color": "#424242"
- },
- "ticks": {
- "stroke":"#424242"
- }
- },
- "target": {
- "color": "#3A3A3A"
- },
- "valueBar": {
- "color": "#3A3A3A",
- "stroke": "#FFF8E1",
- "label": {
- "color": "#424242"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "segments": {
- "baseColor": "#D32F2F",
- "dataLabels": {
- "color": "#BDBDBD"
- },
- "ticks": {
- "stroke":"#BDBDBD"
- }
- },
- "target": {
- "color": "#3A3A3A"
- },
- "valueBar": {
- "color": "#3A3A3A",
- "stroke": "#1E1E1E",
- "label": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "hack": {
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "segments": {
- "baseColor": "#00AA00",
- "dataLabels": {
- "color": "#66CC66"
- },
- "ticks": {
- "stroke":"#00AA00"
- }
- },
- "target": {
- "color": "#023602"
- },
- "valueBar": {
- "color": "#1b291b",
- "stroke": "#1A1A1A",
- "label": {
- "color": "#66CC66"
- }
- }
- }
- }
- },
- "zen": {
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "segments": {
- "baseColor": "#8F837A",
- "dataLabels": {
- "color": "#8A9892"
- },
- "ticks": {
- "stroke":"#8F837A"
- }
- },
- "target": {
- "color": "#40403a"
- },
- "valueBar": {
- "color": "#8F837A",
- "stroke": "#fbfafa",
- "label": {
- "color": "#8A9892"
- }
- }
- }
- }
- },
- "concrete": {
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#50606C"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "segments": {
- "baseColor": "#718890",
- "dataLabels": {
- "color": "#50606C"
- },
- "ticks": {
- "stroke":"#50606C"
- }
- },
- "target": {
- "color": "#50606C"
- },
- "valueBar": {
- "color": "#50606C",
- "stroke": "#fbfafa",
- "label": {
- "color": "#50606C"
- }
- }
- }
- }
- }
- },
- "vue_ui_funnel": {
- "default": {},
- "celebration": {
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "area": {
- "color": "#D32F2F20"
- },
- "bars": {
- "defaultColor": "#E64A19",
- "stroke": "#FFF8E1",
- "dataLabels": {
- "name": {
- "color": "#424242"
- },
- "value": {
- "color": "#424242"
- }
- }
- },
- "circles": {
- "stroke": "#FFF8E1"
- },
- "circleLinks": {
- "color": "#D32F2F40"
- },
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "area": {
- "color": "#D32F2F20"
- },
- "bars": {
- "defaultColor": "#E64A19",
- "stroke": "#1E1E1E",
- "dataLabels": {
- "name": {
- "color": "#BDBDBD"
- },
- "value": {
- "color": "#BDBDBD"
- }
- }
- },
- "circles": {
- "stroke": "#1E1E1E"
- },
- "circleLinks": {
- "color": "#D32F2F60"
- },
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "hack": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "area": {
- "color": "#66CC6620"
- },
- "bars": {
- "defaultColor": "#66CC66",
- "stroke": "#1A1A1A",
- "dataLabels": {
- "name": {
- "color": "#99AA99"
- },
- "value": {
- "color": "#99AA99"
- }
- }
- },
- "circles": {
- "stroke": "#1A1A1A"
- },
- "circleLinks": {
- "color": "#66CC6620"
- },
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "zen": {
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "area": {
- "color": "#8F837A20"
- },
- "bars": {
- "defaultColor": "#8F837A",
- "stroke": "#fbfafa",
- "dataLabels": {
- "name": {
- "color": "#8A9892"
- },
- "value": {
- "color": "#8A9892"
- }
- }
- },
- "circles": {
- "stroke": "#fbfafa"
- },
- "circleLinks": {
- "color": "#8F837A20"
- },
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- }
- }
- }
- },
- "concrete": {
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C",
- "area": {
- "color": "#8A989230"
- },
- "bars": {
- "defaultColor": "#61747E",
- "stroke": "#50606C",
- "dataLabels": {
- "name": {
- "color": "#50606C"
- },
- "value": {
- "color": "#50606C"
- }
- }
- },
- "circles": {
- "stroke": "#50606C"
- },
- "circleLinks": {
- "color": "#8A989230"
- },
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- }
- }
- }
- }
- },
- "vue_ui_history_plot": {
- "default": {},
- "celebration": {
- "table": {
- "th": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- },
- "td": {
- "backgroundColor": "#FFF8E1",
- "color": "#424242"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242",
- "title": {
- "color": "#424242",
- "subtitle": {
- "color": "#757575"
- }
- },
- "tooltip": {
- "backgroundColor": "#FFECB3",
- "backgroundOpacity": 30,
- "color": "#424242",
- "borderColor": "#FF8A65"
- },
- "legend": {
- "backgroundColor":"#FFF8E1",
- "color": "#424242"
- },
- "grid": {
- "xAxis": {
- "stroke": "#5D403740"
- },
- "horizontalLines": {
- "stroke": "#5D403740"
- },
- "yAxis": {
- "stroke": "#5D403740"
- },
- "verticalLines": {
- "stroke": "#5D403740"
- }
- },
- "axes": {
- "x": {
- "labels": {
- "color": "#424242"
- },
- "name": {
- "color": "#424242"
- }
- },
- "y": {
- "labels": {
- "color": "#424242"
- },
- "name": {
- "color": "#424242"
- }
- }
- },
- "plots": {
- "stroke": "#FFF8E1",
- "gradient": {
- "intensity": 20
- },
- "labels": {
- "color": "#424242"
- }
- }
- }
- }
- },
- "celebrationNight": {
- "table": {
- "th": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- },
- "td": {
- "backgroundColor": "#1E1E1E",
- "color": "#BDBDBD"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD",
- "title": {
- "color": "#FFF8E1",
- "subtitle": {
- "color": "#BDBDBD"
- }
- },
- "tooltip": {
- "backgroundColor": "#1E1E1E",
- "backgroundOpacity": 30,
- "color": "#FFF8E1",
- "borderColor": "#FF8A65"
- },
- "legend": {
- "backgroundColor":"#1E1E1E",
- "color": "#BDBDBD"
- },
- "grid": {
- "xAxis": {
- "stroke": "#5D403780"
- },
- "horizontalLines": {
- "stroke": "#5D403780"
- },
- "yAxis": {
- "stroke": "#5D403780"
- },
- "verticalLines": {
- "stroke": "#5D403780"
- }
- },
- "axes": {
- "x": {
- "labels": {
- "color": "#BDBDBD"
- },
- "name": {
- "color": "#BDBDBD"
- }
- },
- "y": {
- "labels": {
- "color": "#BDBDBD"
- },
- "name": {
- "color": "#BDBDBD"
- }
- }
- },
- "plots": {
- "stroke": "#1E1E1E",
- "gradient": {
- "intensity": 20
- },
- "labels": {
- "color": "#BDBDBD"
- }
- }
- }
- }
- },
- "hack": {
- "table": {
- "th": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "td": {
- "backgroundColor": "#1A1A1A",
- "color": "#AACCAA"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99",
- "title": {
- "color": "#66CC66",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#2A2F2A",
- "color": "#AACCAA",
- "borderColor": "#66CC66"
- },
- "legend": {
- "backgroundColor": "#1A1A1A",
- "color": "#99AA99"
- },
- "grid": {
- "xAxis": {
- "stroke": "#5F6A5F"
- },
- "horizontalLines": {
- "stroke": "#3A3A3A"
- },
- "yAxis": {
- "stroke": "#5F6A5F"
- },
- "verticalLines": {
- "stroke": "#3A3A3A"
- }
- },
- "axes": {
- "x": {
- "labels": {
- "color": "#5F6A5F"
- },
- "name": {
- "color": "#5F6A5F"
- }
- },
- "y": {
- "labels": {
- "color": "#5F6A5F"
- },
- "name": {
- "color": "#5F6A5F"
- }
- }
- },
- "plots": {
- "stroke": "#1A1A1A",
- "gradient": {
- "intensity": 20
- },
- "labels": {
- "color": "#5F6A5F"
- }
- }
- }
- }
- },
- "zen": {
- "table": {
- "th": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- },
- "td": {
- "backgroundColor": "#fbfafa",
- "color": "#8F837A"
- }
- },
- "style": {
- "chart": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892",
- "title": {
- "color": "#8A9892",
- "subtitle": {
- "color": "#99AA99"
- }
- },
- "tooltip": {
- "backgroundColor": "#fbfafa",
- "color": "#8A9892"
- },
- "legend": {
- "backgroundColor": "#fbfafa",
- "color": "#99AA99"
- },
- "grid": {
- "xAxis": {
- "stroke": "#8F837A"
- },
- "horizontalLines": {
- "show": false
- },
- "yAxis": {
- "stroke": "#8F837A"
- },
- "verticalLines": {
- "show": false
- }
- },
- "axes": {
- "x": {
- "labels": {
- "color": "#8F837A"
- },
- "name": {
- "color": "#8F837A"
- }
- },
- "y": {
- "labels": {
- "color": "#8F837A"
- },
- "name": {
- "color": "#8F837A"
- }
- }
- },
- "plots": {
- "stroke": "#fbfafa",
- "gradient": {
- "intensity": 20
- },
- "labels": {
- "color": "#8F837A"
- }
- }
- }
- }
- },
- "concrete": {
- "table": {
- "th": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "td": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- }
- },
- "style": {
- "chart": {
- "backgroundColor":"#f6f6fb",
- "color": "#50606C",
- "title": {
- "color": "#50606C",
- "subtitle": {
- "color": "#718890"
- }
- },
- "tooltip": {
- "backgroundColor": "#f6f6fb",
- "color": "#50606C"
- },
- "legend": {
- "backgroundColor": "#f6f6fb",
- "color": "#61747E"
- },
- "grid": {
- "xAxis": {
- "stroke": "#829C98"
- },
- "horizontalLines": {
- "stroke": "#92B0AB"
- },
- "yAxis": {
- "stroke": "#829C98"
- },
- "verticalLines": {
- "stroke": "#92B0AB"
- }
- },
- "axes": {
- "x": {
- "labels": {
- "color": "#50606C"
- },
- "name": {
- "color": "#50606C"
- }
- },
- "y": {
- "labels": {
- "color": "#50606C"
- },
- "name": {
- "color": "#50606C"
- }
- }
- },
- "plots": {
- "stroke": "#50606C",
- "gradient": {
- "intensity": 20
- },
- "labels": {
- "color": "#50606C"
- }
- }
- }
- }
- }
- }
-}
\ No newline at end of file
diff --git a/src/themes/vue_ui_3d_bar.json b/src/themes/vue_ui_3d_bar.json
new file mode 100644
index 00000000..91ffca57
--- /dev/null
+++ b/src/themes/vue_ui_3d_bar.json
@@ -0,0 +1,216 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "box": {
+ "stroke": "#5A5A5A"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "color": "#CCCCCC"
+ },
+ "dataLabel": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "bar": {
+ "color": "#D32F2F"
+ },
+ "box": {
+ "stroke": "#5D4037"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "color": "#424242"
+ },
+ "dataLabel": {
+ "color": "#424242"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "bar": {
+ "color": "#D32F2F"
+ },
+ "box": {
+ "stroke": "#5D4037"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "color": "#BDBDBD"
+ },
+ "dataLabel": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "bar": {
+ "color": "#66CC66"
+ },
+ "box": {
+ "stroke": "#333333"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "color": "#99AA99"
+ },
+ "dataLabel": {
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "bar": {
+ "color": "#B9B99D"
+ },
+ "box": {
+ "stroke": "#DCDFE7"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "color": "#99AA99"
+ },
+ "dataLabel": {
+ "color": "#A0AC94"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "bar": {
+ "color": "#4A6A75"
+ },
+ "box": {
+ "stroke": "#DEE1DE"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "legend": {
+ "color": "#61747E"
+ },
+ "dataLabel": {
+ "color": "#61747E"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_age_pyramid.json b/src/themes/vue_ui_age_pyramid.json
new file mode 100644
index 00000000..74cce37a
--- /dev/null
+++ b/src/themes/vue_ui_age_pyramid.json
@@ -0,0 +1,346 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "grid": {
+ "stroke": "#5A5A5A"
+ },
+ "dataLabels": {
+ "sideTitles": {
+ "color": "#CCCCCC"
+ },
+ "xAxis": {
+ "color": "#CCCCCC"
+ },
+ "yAxis": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "grid": {
+ "stroke": "#5D4037"
+ },
+ "dataLabels": {
+ "sideTitles": {
+ "color": "#424242"
+ },
+ "xAxis": {
+ "color": "#424242"
+ },
+ "yAxis": {
+ "color": "#424242"
+ }
+ },
+ "bars": {
+ "borderRadius": 0,
+ "gap": 1,
+ "left": {
+ "color": "#F57C00"
+ },
+ "right": {
+ "color": "#D32F2F"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "highlighter": {
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "grid": {
+ "stroke": "#5D4037"
+ },
+ "dataLabels": {
+ "sideTitles": {
+ "color": "#BDBDBD"
+ },
+ "xAxis": {
+ "color": "#BDBDBD"
+ },
+ "yAxis": {
+ "color": "#BDBDBD"
+ }
+ },
+ "bars": {
+ "borderRadius": 0,
+ "gap": 1,
+ "left": {
+ "color": "#F57C00"
+ },
+ "right": {
+ "color": "#D32F2F"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "highlighter": {
+ "color": "#FFF8E1"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "grid": {
+ "stroke": "#5F6A5F"
+ },
+ "dataLabels": {
+ "sideTitles": {
+ "color": "#AACCAA"
+ },
+ "xAxis": {
+ "color": "#5F6A5F"
+ },
+ "yAxis": {
+ "color": "#5F6A5F"
+ }
+ },
+ "bars": {
+ "borderRadius": 0,
+ "gap": 1,
+ "left": {
+ "color": "#668066"
+ },
+ "right": {
+ "color": "#66CC66"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "grid": {
+ "stroke": "#5F6A5F"
+ },
+ "dataLabels": {
+ "sideTitles": {
+ "color": "#8A9892"
+ },
+ "xAxis": {
+ "show": false
+ },
+ "yAxis": {
+ "show": false
+ }
+ },
+ "bars": {
+ "borderRadius": 6,
+ "gap": 1,
+ "left": {
+ "color": "#DCB482"
+ },
+ "right": {
+ "color": "#B9B99D"
+ },
+ "gradient": {
+ "show": true
+ }
+ }
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "grid": {
+ "stroke": "#5F6A5F"
+ },
+ "dataLabels": {
+ "sideTitles": {
+ "color": "#61747E"
+ },
+ "xAxis": {
+ "color": "#61747E"
+ },
+ "yAxis": {
+ "color": "#61747E"
+ }
+ },
+ "bars": {
+ "borderRadius": 0,
+ "gap": 1,
+ "left": {
+ "color": "#A1B5A3"
+ },
+ "right": {
+ "color": "#7DA9B5"
+ },
+ "gradient": {
+ "show": true,
+ "intensity": 10
+ }
+ }
+ },
+ "highlighter": {
+ "color": "#7DA9B5"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_bullet.json b/src/themes/vue_ui_bullet.json
new file mode 100644
index 00000000..48c2cc6b
--- /dev/null
+++ b/src/themes/vue_ui_bullet.json
@@ -0,0 +1,225 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "segments": {
+ "baseColor": "#5A5A5A",
+ "dataLabels": {
+ "color": "#CCCCCC"
+ },
+ "ticks": {
+ "stroke": "#5A5A5A"
+ }
+ },
+ "target": {
+ "color": "#1A1A1A"
+ },
+ "valueBar": {
+ "color": "#CCCCCC",
+ "stroke": "#5A5A5A",
+ "label": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "segments": {
+ "baseColor": "#D32F2F",
+ "dataLabels": {
+ "color": "#424242"
+ },
+ "ticks": {
+ "stroke": "#424242"
+ }
+ },
+ "target": {
+ "color": "#3A3A3A"
+ },
+ "valueBar": {
+ "color": "#3A3A3A",
+ "stroke": "#FFF8E1",
+ "label": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "segments": {
+ "baseColor": "#D32F2F",
+ "dataLabels": {
+ "color": "#BDBDBD"
+ },
+ "ticks": {
+ "stroke": "#BDBDBD"
+ }
+ },
+ "target": {
+ "color": "#3A3A3A"
+ },
+ "valueBar": {
+ "color": "#3A3A3A",
+ "stroke": "#1E1E1E",
+ "label": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "segments": {
+ "baseColor": "#00AA00",
+ "dataLabels": {
+ "color": "#66CC66"
+ },
+ "ticks": {
+ "stroke": "#00AA00"
+ }
+ },
+ "target": {
+ "color": "#023602"
+ },
+ "valueBar": {
+ "color": "#1b291b",
+ "stroke": "#1A1A1A",
+ "label": {
+ "color": "#66CC66"
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "segments": {
+ "baseColor": "#8F837A",
+ "dataLabels": {
+ "color": "#8A9892"
+ },
+ "ticks": {
+ "stroke": "#8F837A"
+ }
+ },
+ "target": {
+ "color": "#40403a"
+ },
+ "valueBar": {
+ "color": "#8F837A",
+ "stroke": "#fbfafa",
+ "label": {
+ "color": "#8A9892"
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#50606C"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "segments": {
+ "baseColor": "#718890",
+ "dataLabels": {
+ "color": "#50606C"
+ },
+ "ticks": {
+ "stroke": "#50606C"
+ }
+ },
+ "target": {
+ "color": "#50606C"
+ },
+ "valueBar": {
+ "color": "#50606C",
+ "stroke": "#fbfafa",
+ "label": {
+ "color": "#50606C"
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_candlestick.json b/src/themes/vue_ui_candlestick.json
new file mode 100644
index 00000000..b2550456
--- /dev/null
+++ b/src/themes/vue_ui_candlestick.json
@@ -0,0 +1,394 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "selector": {
+ "color": "#CCCCCC"
+ },
+ "grid": {
+ "stroke": "#5A5A5A",
+ "xAxis": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "yAxis": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "wick": {
+ "stroke": "#5A5A5A",
+ "extremity": {
+ "color": "#5A5A5A"
+ }
+ },
+ "candle": {
+ "stroke": "#1A1A1A"
+ }
+ },
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A",
+ "minimap": {
+ "selectedColor": "#8A8A8A",
+ "lineColor": "#424242",
+ "indicatorColor": "#CCCCCC"
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "selector": {
+ "color": "#424242"
+ },
+ "grid": {
+ "stroke": "#5D4037",
+ "xAxis": {
+ "dataLabels": {
+ "color": "#424242"
+ }
+ },
+ "yAxis": {
+ "dataLabels": {
+ "color": "#424242"
+ }
+ }
+ },
+ "wick": {
+ "stroke": "#5D4037",
+ "extremity": {
+ "color": "#5D4037"
+ }
+ },
+ "candle": {
+ "stroke": "#FFF8E1",
+ "colors": {
+ "bullish": "#D32F2F",
+ "bearish": "#F57C00"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "selector": {
+ "color": "#FFF8E1"
+ },
+ "grid": {
+ "stroke": "#5D4037",
+ "xAxis": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "yAxis": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "wick": {
+ "stroke": "#BDBDBD",
+ "extremity": {
+ "color": "#BDBDBD"
+ }
+ },
+ "candle": {
+ "stroke": "#1E1E1E",
+ "colors": {
+ "bullish": "#D32F2F",
+ "bearish": "#F57C00"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "selector": {
+ "color": "#7DA9B5"
+ },
+ "grid": {
+ "stroke": "#334C33",
+ "xAxis": {
+ "dataLabels": {
+ "color": "#99CC99"
+ }
+ },
+ "yAxis": {
+ "dataLabels": {
+ "color": "#99CC99"
+ }
+ }
+ },
+ "wick": {
+ "stroke": "#334C33",
+ "extremity": {
+ "color": "#334C33"
+ }
+ },
+ "candle": {
+ "stroke": "#1A1A1A",
+ "colors": {
+ "bullish": "#00FF00",
+ "bearish": "#334C33"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "selector": {
+ "color": "#8F837A"
+ },
+ "grid": {
+ "stroke": "transparent",
+ "xAxis": {
+ "dataLabels": {
+ "color": "#8A9892"
+ }
+ },
+ "yAxis": {
+ "dataLabels": {
+ "color": "#8A9892"
+ }
+ }
+ },
+ "wick": {
+ "stroke": "#D7E0D2",
+ "extremity": {
+ "shape": "circle",
+ "size": 2,
+ "color": "#C5B8A7"
+ }
+ },
+ "candle": {
+ "stroke": "#fbfafa",
+ "colors": {
+ "bullish": "#A0AC94",
+ "bearish": "#C09E85"
+ },
+ "gradient": {
+ "show": true
+ }
+ }
+ },
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "selector": {
+ "color": "#7DA9B5"
+ },
+ "grid": {
+ "stroke": "#334C33",
+ "xAxis": {
+ "dataLabels": {
+ "color": "#61747E"
+ }
+ },
+ "yAxis": {
+ "dataLabels": {
+ "color": "#61747E"
+ }
+ }
+ },
+ "wick": {
+ "stroke": "#61747E",
+ "extremity": {
+ "color": "#61747E"
+ }
+ },
+ "candle": {
+ "stroke": "#1A1A1A",
+ "colors": {
+ "bullish": "#92B0AB",
+ "bearish": "#EFECEC"
+ },
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_chestnut.json b/src/themes/vue_ui_chestnut.json
new file mode 100644
index 00000000..d99ae61b
--- /dev/null
+++ b/src/themes/vue_ui_chestnut.json
@@ -0,0 +1,388 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "grandTotal": {
+ "color": "#CCCCCC"
+ },
+ "roots": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "name": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "verticalSeparator": {
+ "stroke": "#1A1A1A"
+ },
+ "branches": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "nuts": {
+ "selected": {
+ "labels": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ },
+ "core": {
+ "total": {
+ "color": "#CCCCCC"
+ },
+ "value": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "grandTotal": {
+ "color": "#424242"
+ },
+ "roots": {
+ "stroke": "#FFF8E1",
+ "labels": {
+ "name": {
+ "color": "#424242"
+ }
+ }
+ },
+ "verticalSeparator": {
+ "stroke": "#FFF8E1"
+ },
+ "branches": {
+ "borderRadius": 0,
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "nuts": {
+ "selected": {
+ "labels": {
+ "dataLabels": {
+ "color": "#424242"
+ },
+ "core": {
+ "total": {
+ "color": "#424242"
+ },
+ "value": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "grandTotal": {
+ "color": "#BDBDBD"
+ },
+ "roots": {
+ "stroke": "#1E1E1E",
+ "labels": {
+ "name": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "verticalSeparator": {
+ "stroke": "#1E1E1E"
+ },
+ "branches": {
+ "borderRadius": 0,
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "nuts": {
+ "selected": {
+ "labels": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ },
+ "core": {
+ "total": {
+ "color": "#BDBDBD"
+ },
+ "value": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "grandTotal": {
+ "color": "#99CC99"
+ },
+ "roots": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "name": {
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "verticalSeparator": {
+ "stroke": "#1A1A1A"
+ },
+ "branches": {
+ "borderRadius": 0,
+ "labels": {
+ "color": "#AACCAA"
+ }
+ },
+ "nuts": {
+ "selected": {
+ "labels": {
+ "dataLabels": {
+ "color": "#AACCAA"
+ },
+ "core": {
+ "total": {
+ "color": "#99CC99"
+ },
+ "value": {
+ "color": "#AACCAA"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "grandTotal": {
+ "color": "#A0AC94"
+ },
+ "roots": {
+ "stroke": "#fbfafa",
+ "labels": {
+ "name": {
+ "color": "#A0AC94"
+ }
+ }
+ },
+ "verticalSeparator": {
+ "stroke": "#fbfafa"
+ },
+ "branches": {
+ "borderRadius": 12,
+ "labels": {
+ "color": "#A0AC94"
+ }
+ },
+ "nuts": {
+ "selected": {
+ "labels": {
+ "dataLabels": {
+ "color": "#A0AC94"
+ },
+ "core": {
+ "total": {
+ "color": "#8A9892"
+ },
+ "value": {
+ "color": "#A0AC94"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "grandTotal": {
+ "color": "#61747E"
+ },
+ "roots": {
+ "stroke": "#f6f6fb",
+ "labels": {
+ "name": {
+ "color": "#8A9892"
+ }
+ }
+ },
+ "verticalSeparator": {
+ "stroke": "#f6f6fb"
+ },
+ "branches": {
+ "borderRadius": 0,
+ "labels": {
+ "color": "#8A9892"
+ }
+ },
+ "nuts": {
+ "selected": {
+ "labels": {
+ "dataLabels": {
+ "color": "#8A9892"
+ },
+ "core": {
+ "total": {
+ "color": "#8A9892"
+ },
+ "value": {
+ "color": "#61747E"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#61747E"
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_chord.json b/src/themes/vue_ui_chord.json
new file mode 100644
index 00000000..6c9f573b
--- /dev/null
+++ b/src/themes/vue_ui_chord.json
@@ -0,0 +1,279 @@
+{
+ "default": {},
+ "dark": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "arcs": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "ribbons": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "color": "#CCCCCC",
+ "connector": {
+ "stroke": "#CCCCCC"
+ },
+ "marker": {
+ "stroke": "#1A1A1A"
+ }
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "arcs": {
+ "stroke": "#FFF8E1",
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "ribbons": {
+ "stroke": "#FFF8E1",
+ "labels": {
+ "color": "#424242",
+ "connector": {
+ "stroke": "#424242"
+ },
+ "marker": {
+ "stroke": "#FFF8E1"
+ }
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "arcs": {
+ "stroke": "#1E1E1E",
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "ribbons": {
+ "stroke": "#1E1E1E",
+ "labels": {
+ "color": "#BDBDBD",
+ "connector": {
+ "stroke": "#BDBDBD"
+ },
+ "marker": {
+ "stroke": "#1E1E1E"
+ }
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "arcs": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "color": "#99AA99"
+ }
+ },
+ "ribbons": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "color": "#99AA99",
+ "connector": {
+ "stroke": "#99AA99"
+ },
+ "marker": {
+ "stroke": "#1A1A1A"
+ }
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "arcs": {
+ "stroke": "#fbfafa",
+ "labels": {
+ "color": "#8A9892"
+ }
+ },
+ "ribbons": {
+ "stroke": "#fbfafa",
+ "labels": {
+ "color": "#8A9892",
+ "connector": {
+ "stroke": "#8A9892"
+ },
+ "marker": {
+ "stroke": "#fbfafa"
+ }
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "arcs": {
+ "stroke": "#f6f6fb",
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "ribbons": {
+ "stroke": "#f6f6fb",
+ "labels": {
+ "color": "#50606C",
+ "connector": {
+ "stroke": "#50606C"
+ },
+ "marker": {
+ "stroke": "#f6f6fb"
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_circle_pack.json b/src/themes/vue_ui_circle_pack.json
new file mode 100644
index 00000000..9b045bef
--- /dev/null
+++ b/src/themes/vue_ui_circle_pack.json
@@ -0,0 +1,130 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "circles": {
+ "stroke": "#1A1A1A",
+ "selectedShadowColor": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "circles": {
+ "stroke": "#3A3A3A",
+ "selectedShadowColor": "#FFF8E1"
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "circles": {
+ "stroke": "#3A3A3A",
+ "selectedShadowColor": "#66CC66"
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_donut.json b/src/themes/vue_ui_donut.json
new file mode 100644
index 00000000..6163bf0d
--- /dev/null
+++ b/src/themes/vue_ui_donut.json
@@ -0,0 +1,346 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#CCCCCC"
+ },
+ "name": {
+ "color": "#CCCCCC"
+ },
+ "hollow": {
+ "total": {
+ "color": "#CCCCCC",
+ "value": {
+ "color": "#CCCCCC"
+ }
+ },
+ "average": {
+ "color": "#CCCCCC",
+ "value": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#424242"
+ },
+ "name": {
+ "color": "#424242"
+ },
+ "hollow": {
+ "total": {
+ "color": "#424242",
+ "value": {
+ "color": "#424242"
+ }
+ },
+ "average": {
+ "color": "#424242",
+ "value": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#BDBDBD"
+ },
+ "name": {
+ "color": "#BDBDBD"
+ },
+ "hollow": {
+ "total": {
+ "color": "#BDBDBD",
+ "value": {
+ "color": "#BDBDBD"
+ }
+ },
+ "average": {
+ "color": "#BDBDBD",
+ "value": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#61747E"
+ },
+ "name": {
+ "color": "#8A9892"
+ },
+ "hollow": {
+ "total": {
+ "color": "#8A9892",
+ "value": {
+ "color": "#61747E"
+ }
+ },
+ "average": {
+ "color": "#8A9892",
+ "value": {
+ "color": "#61747E"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#AACCAA"
+ },
+ "name": {
+ "color": "#99CC99"
+ },
+ "hollow": {
+ "total": {
+ "color": "#99CC99",
+ "value": {
+ "color": "#AACCAA"
+ }
+ },
+ "average": {
+ "color": "#99CC99",
+ "value": {
+ "color": "#AACCAA"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#A0AC94"
+ },
+ "name": {
+ "color": "#8A9892"
+ },
+ "hollow": {
+ "total": {
+ "color": "#8A9892",
+ "value": {
+ "color": "#A0AC94"
+ }
+ },
+ "average": {
+ "color": "#8A9892",
+ "value": {
+ "color": "#A0AC94"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_donut_evolution.json b/src/themes/vue_ui_donut_evolution.json
new file mode 100644
index 00000000..3b350050
--- /dev/null
+++ b/src/themes/vue_ui_donut_evolution.json
@@ -0,0 +1,408 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A"
+ },
+ "dialog": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "header": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "donutChart": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "labels": {
+ "percentage": {
+ "color": "#CCCCCC"
+ },
+ "name": {
+ "color": "#CCCCCC"
+ },
+ "hollow": {
+ "total": {
+ "color": "#CCCCCC",
+ "value": {
+ "color": "#CCCCCC"
+ }
+ },
+ "average": {
+ "color": "#CCCCCC",
+ "value": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ },
+ "layout": {
+ "grid": {
+ "stroke": "#5A5A5A",
+ "yAxis": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "xAxis": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "line": {
+ "stroke": "#4A4A4A"
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "layout": {
+ "grid": {
+ "stroke": "#5D4037",
+ "showVerticalLines": false,
+ "yAxis": {
+ "dataLabels": {
+ "color": "#424242"
+ }
+ },
+ "xAxis": {
+ "dataLabels": {
+ "color": "#424242"
+ }
+ }
+ },
+ "line": {
+ "stroke": "#5D4037"
+ },
+ "highlighter": {
+ "color": "#424242"
+ },
+ "dataLabels": {
+ "color": "#424242"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "layout": {
+ "grid": {
+ "stroke": "#5D4037",
+ "showVerticalLines": false,
+ "yAxis": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "xAxis": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "line": {
+ "stroke": "#5D4037"
+ },
+ "highlighter": {
+ "color": "#FFF8E1"
+ },
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "layout": {
+ "grid": {
+ "show": false,
+ "stroke": "#5F6A5F",
+ "yAxis": {
+ "dataLabels": {
+ "color": "#AACCAA"
+ }
+ },
+ "xAxis": {
+ "dataLabels": {
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "line": {
+ "stroke": "#5F6A5F"
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "dataLabels": {
+ "color": "#AACCAA"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "layout": {
+ "grid": {
+ "show": false,
+ "yAxis": {
+ "dataLabels": {
+ "show": false
+ }
+ },
+ "xAxis": {
+ "dataLabels": {
+ "show": false
+ }
+ }
+ },
+ "line": {
+ "stroke": "#DCDFE7"
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "dataLabels": {
+ "color": "#A0AC94"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "layout": {
+ "grid": {
+ "stroke": "#BBC4D3",
+ "yAxis": {
+ "dataLabels": {
+ "color": "#61747E"
+ }
+ },
+ "xAxis": {
+ "dataLabels": {
+ "color": "#61747E"
+ }
+ }
+ },
+ "line": {
+ "stroke": "#92B0AB"
+ },
+ "highlighter": {
+ "color": "#50606C"
+ },
+ "dataLabels": {
+ "color": "#61747E"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_dumbbell.json b/src/themes/vue_ui_dumbbell.json
new file mode 100644
index 00000000..cf5e3c6b
--- /dev/null
+++ b/src/themes/vue_ui_dumbbell.json
@@ -0,0 +1,316 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "comparisonLines": {
+ "rectColor": "#CCCCCC",
+ "labelColor": "#CCCCCC"
+ },
+ "plots": {
+ "stroke": "#1A1A1A"
+ },
+ "grid": {
+ "horizontalGrid": {
+ "stroke": "#4A4A4A"
+ },
+ "verticalGrid": {
+ "stroke": "#4A4A4A"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "labels": {
+ "yAxisLabels": {
+ "color": "#CCCCCC"
+ },
+ "xAxisLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "plots": {
+ "startColor": "#F57C00",
+ "endColor": "#D32F2F",
+ "stroke": "#FFF8E1"
+ },
+ "grid": {
+ "horizontalGrid": {
+ "stroke": "#5D403780"
+ },
+ "verticalGrid": {
+ "stroke": "#5D403780"
+ }
+ },
+ "labels": {
+ "yAxisLabels": {
+ "color": "#424242"
+ },
+ "xAxisLabels": {
+ "color": "#424242"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "comparisonLines": {
+ "rectColor": "#CCCCCC",
+ "labelColor": "#CCCCCC"
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "plots": {
+ "startColor": "#F57C00",
+ "endColor": "#D32F2F",
+ "stroke": "#1E1E1E"
+ },
+ "grid": {
+ "horizontalGrid": {
+ "stroke": "#5D4037"
+ },
+ "verticalGrid": {
+ "stroke": "#5D4037"
+ }
+ },
+ "labels": {
+ "yAxisLabels": {
+ "color": "#BDBDBD"
+ },
+ "xAxisLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "plots": {
+ "startColor": "#008000",
+ "endColor": "#00FF00",
+ "stroke": "#1A1A1A"
+ },
+ "comparisonLines": {
+ "rectColor": "#CCCCCC",
+ "labelColor": "#99CC99"
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "grid": {
+ "horizontalGrid": {
+ "stroke": "#5F6A5F"
+ },
+ "verticalGrid": {
+ "stroke": "#5F6A5F"
+ }
+ },
+ "labels": {
+ "yAxisLabels": {
+ "color": "#99CC99"
+ },
+ "xAxisLabels": {
+ "color": "#99CC99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "plots": {
+ "startColor": "#DCB482",
+ "endColor": "#B9B99D",
+ "stroke": "#fbfafa"
+ },
+ "grid": {
+ "horizontalGrid": {
+ "show": false
+ },
+ "verticalGrid": {
+ "show": false
+ }
+ },
+ "labels": {
+ "yAxisLabels": {
+ "color": "#8A9892"
+ },
+ "xAxisLabels": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "plots": {
+ "startColor": "#718885",
+ "endColor": "#7DA9B5",
+ "stroke": "#404C5A"
+ },
+ "grid": {
+ "horizontalGrid": {
+ "stroke": "#829C98"
+ },
+ "verticalGrid": {
+ "stroke": "#829C98"
+ }
+ },
+ "labels": {
+ "yAxisLabels": {
+ "color": "#61747E"
+ },
+ "xAxisLabels": {
+ "color": "#61747E"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_flow.json b/src/themes/vue_ui_flow.json
new file mode 100644
index 00000000..c2d579c2
--- /dev/null
+++ b/src/themes/vue_ui_flow.json
@@ -0,0 +1,238 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "nodes": {
+ "stroke": "#1A1A1A"
+ },
+ "links": {
+ "stroke": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "nodes": {
+ "stroke": "#3A3A3A"
+ },
+ "links": {
+ "stroke": "#3A3A3A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "nodes": {
+ "stroke": "#1E1E1E"
+ },
+ "links": {
+ "stroke": "#1E1E1E"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "nodes": {
+ "stroke": "#1A1A1A"
+ },
+ "links": {
+ "stroke": "#1A1A1A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "nodes": {
+ "stroke": "#fbfafa"
+ },
+ "links": {
+ "stroke": "#fbfafa"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "nodes": {
+ "stroke": "#f6f6fb"
+ },
+ "links": {
+ "stroke": "#f6f6fb"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_funnel.json b/src/themes/vue_ui_funnel.json
new file mode 100644
index 00000000..65da9358
--- /dev/null
+++ b/src/themes/vue_ui_funnel.json
@@ -0,0 +1,272 @@
+{
+ "default": {},
+ "dark": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "area": {
+ "color": "#3A3A3A"
+ },
+ "bars": {
+ "stroke": "#1A1A1A",
+ "dataLabels": {
+ "name": {
+ "color": "#CCCCCC"
+ },
+ "value": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "circles": {
+ "stroke": "#1A1A1A"
+ },
+ "circleLinks": {
+ "color": "#3A3A3A"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "area": {
+ "color": "#D32F2F20"
+ },
+ "bars": {
+ "defaultColor": "#E64A19",
+ "stroke": "#FFF8E1",
+ "dataLabels": {
+ "name": {
+ "color": "#424242"
+ },
+ "value": {
+ "color": "#424242"
+ }
+ }
+ },
+ "circles": {
+ "stroke": "#FFF8E1"
+ },
+ "circleLinks": {
+ "color": "#D32F2F40"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "area": {
+ "color": "#D32F2F20"
+ },
+ "bars": {
+ "defaultColor": "#E64A19",
+ "stroke": "#1E1E1E",
+ "dataLabels": {
+ "name": {
+ "color": "#BDBDBD"
+ },
+ "value": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "circles": {
+ "stroke": "#1E1E1E"
+ },
+ "circleLinks": {
+ "color": "#D32F2F60"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "area": {
+ "color": "#66CC6620"
+ },
+ "bars": {
+ "defaultColor": "#66CC66",
+ "stroke": "#1A1A1A",
+ "dataLabels": {
+ "name": {
+ "color": "#99AA99"
+ },
+ "value": {
+ "color": "#99AA99"
+ }
+ }
+ },
+ "circles": {
+ "stroke": "#1A1A1A"
+ },
+ "circleLinks": {
+ "color": "#66CC6620"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "area": {
+ "color": "#8F837A20"
+ },
+ "bars": {
+ "defaultColor": "#8F837A",
+ "stroke": "#fbfafa",
+ "dataLabels": {
+ "name": {
+ "color": "#8A9892"
+ },
+ "value": {
+ "color": "#8A9892"
+ }
+ }
+ },
+ "circles": {
+ "stroke": "#fbfafa"
+ },
+ "circleLinks": {
+ "color": "#8F837A20"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "area": {
+ "color": "#8A989230"
+ },
+ "bars": {
+ "defaultColor": "#61747E",
+ "stroke": "#50606C",
+ "dataLabels": {
+ "name": {
+ "color": "#50606C"
+ },
+ "value": {
+ "color": "#50606C"
+ }
+ }
+ },
+ "circles": {
+ "stroke": "#50606C"
+ },
+ "circleLinks": {
+ "color": "#8A989230"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_galaxy.json b/src/themes/vue_ui_galaxy.json
new file mode 100644
index 00000000..d81c51e6
--- /dev/null
+++ b/src/themes/vue_ui_galaxy.json
@@ -0,0 +1,237 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "arcs": {
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "arcs": {
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "arcs": {
+ "gradient": {
+ "color": "#1A1A1A"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "arcs": {
+ "gradient": {
+ "color": "#fbfafa"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "arcs": {
+ "gradient": {
+ "show": false
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_gauge.json b/src/themes/vue_ui_gauge.json
new file mode 100644
index 00000000..d5b7c87f
--- /dev/null
+++ b/src/themes/vue_ui_gauge.json
@@ -0,0 +1,190 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "markers": {
+ "color": "#CCCCCC"
+ },
+ "pointer": {
+ "stroke": "#1A1A1A",
+ "circle": {
+ "stroke": "#1A1A1A",
+ "color": "#5A5A5A"
+ }
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "track": {
+ "useGradient": false
+ },
+ "markers": {
+ "color": "#5D4037"
+ },
+ "pointer": {
+ "type": "pointy",
+ "stroke": "#FFF8E1",
+ "circle": {
+ "stroke": "#FFF8E1",
+ "strokeWidth": 1,
+ "color": "#5D4037"
+ }
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "track": {
+ "useGradient": false
+ },
+ "markers": {
+ "color": "#BDBDBD"
+ },
+ "pointer": {
+ "type": "pointy",
+ "stroke": "#1E1E1E",
+ "circle": {
+ "stroke": "#1E1E1E",
+ "strokeWidth": 1,
+ "color": "#5D4037"
+ }
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "track": {
+ "useGradient": false
+ },
+ "markers": {
+ "color": "#99CC99",
+ "backgroundColor": "#1A1A1A",
+ "stroke": "#66CC66"
+ },
+ "pointer": {
+ "type": "pointy",
+ "stroke": "#1A1A1A",
+ "circle": {
+ "stroke": "#66CC66",
+ "strokeWidth": 1,
+ "color": "#1A1A1A"
+ }
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "track": {
+ "useGradient": false
+ },
+ "markers": {
+ "color": "#A0AC94",
+ "backgroundColor": "#fbfafa",
+ "stroke": "#EBD6CC"
+ },
+ "pointer": {
+ "type": "rounded",
+ "stroke": "#fbfafa",
+ "circle": {
+ "stroke": "#EBD6CC",
+ "strokeWidth": 1,
+ "color": "#fbfafa"
+ }
+ }
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "track": {
+ "useGradient": false
+ },
+ "markers": {
+ "color": "#4F5B75",
+ "backgroundColor": "#4F5B75",
+ "stroke": "#9FA9BE"
+ },
+ "pointer": {
+ "type": "pointy",
+ "stroke": "#f6f6fb",
+ "circle": {
+ "stroke": "#f6f6fb",
+ "strokeWidth": 1,
+ "color": "#4F5B75"
+ }
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_heatmap.json b/src/themes/vue_ui_heatmap.json
new file mode 100644
index 00000000..523bdbf8
--- /dev/null
+++ b/src/themes/vue_ui_heatmap.json
@@ -0,0 +1,305 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "cells": {
+ "selected": {
+ "color": "#CCCCCC"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#CCCCCC"
+ },
+ "yAxis": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "cells": {
+ "colors": {
+ "hot": "#D32F2F",
+ "cold": "#FFE082"
+ },
+ "spacing": 0.5,
+ "selected": {
+ "color": "#B71C1C"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#424242"
+ },
+ "yAxis": {
+ "color": "#424242"
+ }
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "cells": {
+ "colors": {
+ "hot": "#D32F2F",
+ "cold": "#FFE082"
+ },
+ "spacing": 0.5,
+ "selected": {
+ "color": "#B71C1C"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#BDBDBD"
+ },
+ "yAxis": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "cells": {
+ "colors": {
+ "hot": "#008000",
+ "cold": "#333333"
+ },
+ "spacing": 0.5,
+ "selected": {
+ "color": "#33FF33"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#AACCAA"
+ },
+ "yAxis": {
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ },
+ "legend": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "cells": {
+ "colors": {
+ "hot": "#DFCA99",
+ "cold": "#BBC4D3"
+ },
+ "spacing": 0.5,
+ "selected": {
+ "color": "#4F5B75"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#A0AC94"
+ },
+ "yAxis": {
+ "color": "#A0AC94"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "cells": {
+ "colors": {
+ "hot": "#6D7D65",
+ "cold": "#6C94A5"
+ },
+ "spacing": 0.5,
+ "selected": {
+ "color": "#404C4D"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#61747E"
+ },
+ "yAxis": {
+ "color": "#61747E"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_history_plot.json b/src/themes/vue_ui_history_plot.json
new file mode 100644
index 00000000..ac6a3101
--- /dev/null
+++ b/src/themes/vue_ui_history_plot.json
@@ -0,0 +1,445 @@
+{
+ "default": {},
+ "dark": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "grid": {
+ "xAxis": {
+ "stroke": "#5A5A5A"
+ },
+ "horizontalLines": {
+ "stroke": "#4A4A4A"
+ },
+ "yAxis": {
+ "stroke": "#5A5A5A"
+ },
+ "verticalLines": {
+ "stroke": "#4A4A4A"
+ }
+ },
+ "axes": {
+ "x": {
+ "labels": {
+ "color": "#CCCCCC"
+ },
+ "name": {
+ "color": "#CCCCCC"
+ }
+ },
+ "y": {
+ "labels": {
+ "color": "#CCCCCC"
+ },
+ "name": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "plots": {
+ "stroke": "#1A1A1A",
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "grid": {
+ "xAxis": {
+ "stroke": "#5D403740"
+ },
+ "horizontalLines": {
+ "stroke": "#5D403740"
+ },
+ "yAxis": {
+ "stroke": "#5D403740"
+ },
+ "verticalLines": {
+ "stroke": "#5D403740"
+ }
+ },
+ "axes": {
+ "x": {
+ "labels": {
+ "color": "#424242"
+ },
+ "name": {
+ "color": "#424242"
+ }
+ },
+ "y": {
+ "labels": {
+ "color": "#424242"
+ },
+ "name": {
+ "color": "#424242"
+ }
+ }
+ },
+ "plots": {
+ "stroke": "#FFF8E1",
+ "gradient": {
+ "intensity": 20
+ },
+ "labels": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "grid": {
+ "xAxis": {
+ "stroke": "#5D403780"
+ },
+ "horizontalLines": {
+ "stroke": "#5D403780"
+ },
+ "yAxis": {
+ "stroke": "#5D403780"
+ },
+ "verticalLines": {
+ "stroke": "#5D403780"
+ }
+ },
+ "axes": {
+ "x": {
+ "labels": {
+ "color": "#BDBDBD"
+ },
+ "name": {
+ "color": "#BDBDBD"
+ }
+ },
+ "y": {
+ "labels": {
+ "color": "#BDBDBD"
+ },
+ "name": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "plots": {
+ "stroke": "#1E1E1E",
+ "gradient": {
+ "intensity": 20
+ },
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "grid": {
+ "xAxis": {
+ "stroke": "#5F6A5F"
+ },
+ "horizontalLines": {
+ "stroke": "#3A3A3A"
+ },
+ "yAxis": {
+ "stroke": "#5F6A5F"
+ },
+ "verticalLines": {
+ "stroke": "#3A3A3A"
+ }
+ },
+ "axes": {
+ "x": {
+ "labels": {
+ "color": "#5F6A5F"
+ },
+ "name": {
+ "color": "#5F6A5F"
+ }
+ },
+ "y": {
+ "labels": {
+ "color": "#5F6A5F"
+ },
+ "name": {
+ "color": "#5F6A5F"
+ }
+ }
+ },
+ "plots": {
+ "stroke": "#1A1A1A",
+ "gradient": {
+ "intensity": 20
+ },
+ "labels": {
+ "color": "#5F6A5F"
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "grid": {
+ "xAxis": {
+ "stroke": "#8F837A"
+ },
+ "horizontalLines": {
+ "show": false
+ },
+ "yAxis": {
+ "stroke": "#8F837A"
+ },
+ "verticalLines": {
+ "show": false
+ }
+ },
+ "axes": {
+ "x": {
+ "labels": {
+ "color": "#8F837A"
+ },
+ "name": {
+ "color": "#8F837A"
+ }
+ },
+ "y": {
+ "labels": {
+ "color": "#8F837A"
+ },
+ "name": {
+ "color": "#8F837A"
+ }
+ }
+ },
+ "plots": {
+ "stroke": "#fbfafa",
+ "gradient": {
+ "intensity": 20
+ },
+ "labels": {
+ "color": "#8F837A"
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "grid": {
+ "xAxis": {
+ "stroke": "#829C98"
+ },
+ "horizontalLines": {
+ "stroke": "#92B0AB"
+ },
+ "yAxis": {
+ "stroke": "#829C98"
+ },
+ "verticalLines": {
+ "stroke": "#92B0AB"
+ }
+ },
+ "axes": {
+ "x": {
+ "labels": {
+ "color": "#50606C"
+ },
+ "name": {
+ "color": "#50606C"
+ }
+ },
+ "y": {
+ "labels": {
+ "color": "#50606C"
+ },
+ "name": {
+ "color": "#50606C"
+ }
+ }
+ },
+ "plots": {
+ "stroke": "#50606C",
+ "gradient": {
+ "intensity": 20
+ },
+ "labels": {
+ "color": "#50606C"
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_horizontal_bar.json b/src/themes/vue_ui_horizontal_bar.json
new file mode 100644
index 00000000..ef494f59
--- /dev/null
+++ b/src/themes/vue_ui_horizontal_bar.json
@@ -0,0 +1,327 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "separators": {
+ "color": "#4A4A4A"
+ },
+ "bars": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ },
+ "nameLabels": {
+ "color": "#CCCCCC"
+ },
+ "parentLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": false,
+ "dataLabels": {
+ "color": "#424242"
+ },
+ "nameLabels": {
+ "color": "#424242"
+ },
+ "parentLabels": {
+ "color": "#424242"
+ }
+ },
+ "highlighter": {
+ "color": "#FF8A65"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": false,
+ "dataLabels": {
+ "color": "#BDBDBD"
+ },
+ "nameLabels": {
+ "color": "#BDBDBD"
+ },
+ "parentLabels": {
+ "color": "#FFF8E1"
+ }
+ },
+ "highlighter": {
+ "color": "#FF8A65"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": false,
+ "dataLabels": {
+ "color": "#AACCAA"
+ },
+ "nameLabels": {
+ "color": "#99CC99"
+ },
+ "parentLabels": {
+ "color": "#99CC99"
+ }
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "bars": {
+ "borderRadius": 8,
+ "useGradient": true,
+ "dataLabels": {
+ "color": "#A0AC94"
+ },
+ "nameLabels": {
+ "color": "#8A9892"
+ },
+ "parentLabels": {
+ "color": "#8A9892"
+ }
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": true,
+ "dataLabels": {
+ "color": "#61747E"
+ },
+ "nameLabels": {
+ "color": "#8A9892"
+ },
+ "parentLabels": {
+ "color": "#8A9892"
+ }
+ },
+ "highlighter": {
+ "color": "#50606C"
+ },
+ "separators": {
+ "show": true,
+ "color": "#DEE1DE"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_molecule.json b/src/themes/vue_ui_molecule.json
new file mode 100644
index 00000000..1844c6d0
--- /dev/null
+++ b/src/themes/vue_ui_molecule.json
@@ -0,0 +1,220 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "nodes": {
+ "stroke": "#4A4A4A",
+ "strokeHovered": "#CCCCCC"
+ },
+ "links": {
+ "stroke": "#4A4A4A"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "nodes": {
+ "stroke": "#333333",
+ "strokeHovered": "#FFFFFF"
+ },
+ "links": {
+ "stroke": "#333333"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "nodes": {
+ "stroke": "#333333",
+ "strokeHovered": "#FFF8E1"
+ },
+ "links": {
+ "stroke": "#333333"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "nodes": {
+ "stroke": "#1A1A1A",
+ "strokeHovered": "#00FF00"
+ },
+ "links": {
+ "stroke": "#333333"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "nodes": {
+ "stroke": "#fbfafa",
+ "strokeHovered": "#5E5E5E"
+ },
+ "links": {
+ "stroke": "#e8ede1"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "nodes": {
+ "stroke": "#61747E",
+ "strokeHovered": "#404C4D"
+ },
+ "links": {
+ "stroke": "#BBCBC7"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_mood_radar.json b/src/themes/vue_ui_mood_radar.json
new file mode 100644
index 00000000..1236c3e9
--- /dev/null
+++ b/src/themes/vue_ui_mood_radar.json
@@ -0,0 +1,302 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "grid": {
+ "stroke": "#4A4A4A"
+ },
+ "outerPolygon": {
+ "stroke": "#5A5A5A"
+ },
+ "dataLabel": {
+ "color": "#CCCCCC"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "grid": {
+ "stroke": "#5D403780"
+ },
+ "outerPolygon": {
+ "stroke": "#5D4037"
+ },
+ "dataPolygon": {
+ "color": "#D32F2F",
+ "stroke": "#D32F2F"
+ },
+ "smileys": {
+ "colors": {
+ "5": "#D32F2F",
+ "4": "#E64A19",
+ "3": "#F57C00",
+ "2": "#FF9800",
+ "1": "#FFC107"
+ }
+ },
+ "dataLabel": {
+ "color": "#424242"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "grid": {
+ "stroke": "#5D403780"
+ },
+ "outerPolygon": {
+ "stroke": "#5D4037"
+ },
+ "dataPolygon": {
+ "color": "#D32F2F",
+ "stroke": "#D32F2F"
+ },
+ "smileys": {
+ "colors": {
+ "5": "#D32F2F",
+ "4": "#E64A19",
+ "3": "#F57C00",
+ "2": "#FF9800",
+ "1": "#FFC107"
+ }
+ },
+ "dataLabel": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "grid": {
+ "stroke": "#333333"
+ },
+ "outerPolygon": {
+ "stroke": "#334C33"
+ },
+ "dataPolygon": {
+ "color": "#33B333",
+ "stroke": "#00FF00"
+ },
+ "smileys": {
+ "colors": {
+ "1": "#336633",
+ "2": "#338033",
+ "3": "#339933",
+ "4": "#33E633",
+ "5": "#00FF00"
+ }
+ },
+ "dataLabel": {
+ "color": "#00FF00"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "grid": {
+ "stroke": "#C5B8A7"
+ },
+ "outerPolygon": {
+ "strokeWidth": 0
+ },
+ "dataPolygon": {
+ "color": "#858480",
+ "stroke": "#C09E85"
+ },
+ "smileys": {
+ "colors": {
+ "1": "#C09E85",
+ "2": "#DCB482",
+ "3": "#DFCA99",
+ "4": "#E0CFC3",
+ "5": "#B9B99D"
+ }
+ },
+ "dataLabel": {
+ "color": "#606C5A"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "grid": {
+ "stroke": "#61747E"
+ },
+ "outerPolygon": {
+ "stroke": "#50606C"
+ },
+ "dataPolygon": {
+ "color": "#A3C4BE",
+ "stroke": "#92B0B5"
+ },
+ "smileys": {
+ "colors": {
+ "1": "#5C6B5B",
+ "2": "#4A6A75",
+ "3": "#6C94A0",
+ "4": "#7DA9B5",
+ "5": "#8EBFCA"
+ }
+ },
+ "dataLabel": {
+ "color": "#50606C"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_nested_donuts.json b/src/themes/vue_ui_nested_donuts.json
new file mode 100644
index 00000000..96793a0c
--- /dev/null
+++ b/src/themes/vue_ui_nested_donuts.json
@@ -0,0 +1,247 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "donut": {
+ "emptyFill": "#3A3A3A"
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "labels": {
+ "dataLabels": {
+ "color": "#424242"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "labels": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "labels": {
+ "dataLabels": {
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "labels": {
+ "dataLabels": {
+ "color": "#A0AC94"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "labels": {
+ "dataLabels": {
+ "color": "#61747E"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_onion.json b/src/themes/vue_ui_onion.json
new file mode 100644
index 00000000..06ca0f12
--- /dev/null
+++ b/src/themes/vue_ui_onion.json
@@ -0,0 +1,255 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "gutter": {
+ "color": "#4A4A4A"
+ },
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "useGradient": false,
+ "layout": {
+ "gutter": {
+ "color": "#5D403730"
+ },
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "useGradient": false,
+ "layout": {
+ "gutter": {
+ "color": "#5D403730"
+ },
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "useGradient": false,
+ "color": "#99AA99",
+ "layout": {
+ "gutter": {
+ "color": "#2A2A2A"
+ },
+ "labels": {
+ "color": "#99CC99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "useGradient": false,
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "gutter": {
+ "color": "#F7EDE2"
+ },
+ "labels": {
+ "color": "#A0AC94"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "useGradient": false,
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "gutter": {
+ "color": "#DDDDDB"
+ },
+ "labels": {
+ "color": "#61747E"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_parallel_coordinate_plot.json b/src/themes/vue_ui_parallel_coordinate_plot.json
new file mode 100644
index 00000000..bae5861e
--- /dev/null
+++ b/src/themes/vue_ui_parallel_coordinate_plot.json
@@ -0,0 +1,257 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "yAxis": {
+ "stroke": "#5A5A5A",
+ "labels": {
+ "axisNamesColor": "#CCCCCC",
+ "ticks": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "yAxis": {
+ "stroke": "#5D4037",
+ "labels": {
+ "axisNamesColor": "#424242",
+ "ticks": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "yAxis": {
+ "stroke": "#5D4037",
+ "labels": {
+ "axisNamesColor": "#BDBDBD",
+ "ticks": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66",
+ "borderRadius": 0
+ },
+ "yAxis": {
+ "stroke": "#3A3A3A",
+ "labels": {
+ "axisNamesColor": "#99AA99",
+ "ticks": {
+ "color": "#5A5A5A"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "yAxis": {
+ "stroke": "#8F837A",
+ "labels": {
+ "axisNamesColor": "#8F837A",
+ "ticks": {
+ "color": "#8F837A"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "yAxis": {
+ "stroke": "#50606C",
+ "labels": {
+ "axisNamesColor": "#50606C",
+ "ticks": {
+ "color": "#50606C"
+ }
+ }
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_quadrant.json b/src/themes/vue_ui_quadrant.json
new file mode 100644
index 00000000..2f5a2746
--- /dev/null
+++ b/src/themes/vue_ui_quadrant.json
@@ -0,0 +1,444 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "labels": {
+ "quadrantLabels": {
+ "tl": {
+ "color": "#CCCCCC"
+ },
+ "tr": {
+ "color": "#CCCCCC"
+ },
+ "br": {
+ "color": "#CCCCCC"
+ },
+ "bl": {
+ "color": "#CCCCCC"
+ }
+ },
+ "plotLabels": {
+ "color": "#CCCCCC"
+ },
+ "axisLabels": {
+ "color": {
+ "positive": "#CCCCCC",
+ "negative": "#CCCCCC"
+ }
+ }
+ },
+ "grid": {
+ "stroke": "#5A5A5A",
+ "graduations": {
+ "stroke": "#5A5A5A"
+ }
+ },
+ "plots": {
+ "outlineColor": "#1A1A1A"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "labels": {
+ "quadrantLabels": {
+ "tl": {
+ "color": "#5D4037"
+ },
+ "tr": {
+ "color": "#5D4037"
+ },
+ "br": {
+ "color": "#5D4037"
+ },
+ "bl": {
+ "color": "#5D4037"
+ }
+ },
+ "plotLabels": {
+ "color": "#424242"
+ },
+ "axisLabels": {
+ "color": {
+ "positive": "#757575",
+ "negative": "#757575"
+ }
+ }
+ },
+ "grid": {
+ "stroke": "#5D403790",
+ "graduations": {
+ "stroke": "#5D403780",
+ "roundingForce": 0,
+ "fill": false
+ }
+ },
+ "plots": {
+ "outlineColor": "#FFF8E1"
+ },
+ "areas": {
+ "opacity": 20
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "labels": {
+ "quadrantLabels": {
+ "tl": {
+ "color": "#FF6B6B90"
+ },
+ "tr": {
+ "color": "#FF6B6B90"
+ },
+ "br": {
+ "color": "#FF6B6B90"
+ },
+ "bl": {
+ "color": "#FF6B6B90"
+ }
+ },
+ "plotLabels": {
+ "color": "#BDBDBD"
+ },
+ "axisLabels": {
+ "color": {
+ "positive": "#757575",
+ "negative": "#757575"
+ }
+ }
+ },
+ "grid": {
+ "stroke": "#5D403790",
+ "graduations": {
+ "stroke": "#5D403780",
+ "roundingForce": 0,
+ "fill": false
+ }
+ },
+ "plots": {
+ "outlineColor": "#1E1E1E"
+ },
+ "areas": {
+ "opacity": 20
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "labels": {
+ "quadrantLabels": {
+ "tl": {
+ "color": "#99AA99"
+ },
+ "tr": {
+ "color": "#99AA99"
+ },
+ "br": {
+ "color": "#99AA99"
+ },
+ "bl": {
+ "color": "#99AA99"
+ }
+ },
+ "plotLabels": {
+ "color": "#99CC99"
+ },
+ "axisLabels": {
+ "color": {
+ "positive": "#66CC66",
+ "negative": "#66CC66"
+ }
+ }
+ },
+ "grid": {
+ "stroke": "#334C33",
+ "graduations": {
+ "stroke": "#333333",
+ "roundingForce": 0,
+ "fill": false
+ }
+ },
+ "plots": {
+ "outlineColor": "#1A1A1A"
+ },
+ "areas": {
+ "opacity": 20
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "labels": {
+ "quadrantLabels": {
+ "tl": {
+ "color": "#8A9892"
+ },
+ "tr": {
+ "color": "#8A9892"
+ },
+ "br": {
+ "color": "#8A9892"
+ },
+ "bl": {
+ "color": "#8A9892"
+ }
+ },
+ "plotLabels": {
+ "color": "#8A9892"
+ },
+ "axisLabels": {
+ "color": {
+ "positive": "#99AA99",
+ "negative": "#C09E85"
+ }
+ }
+ },
+ "grid": {
+ "stroke": "#D2E0DB",
+ "graduations": {
+ "steps": 2,
+ "color": "#D2E0DB",
+ "stroke": "#D2E0DB",
+ "roundingForce": 256
+ }
+ },
+ "plots": {
+ "outlineColor": "#fbfafa"
+ },
+ "areas": {
+ "opacity": 40
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "labels": {
+ "quadrantLabels": {
+ "tl": {
+ "color": "#61747E"
+ },
+ "tr": {
+ "color": "#61747E"
+ },
+ "br": {
+ "color": "#61747E"
+ },
+ "bl": {
+ "color": "#61747E"
+ }
+ },
+ "plotLabels": {
+ "color": "#50606C"
+ },
+ "axisLabels": {
+ "color": {
+ "positive": "#4A6A75",
+ "negative": "#7E8F7E"
+ }
+ }
+ },
+ "grid": {
+ "stroke": "#9AA7B0",
+ "graduations": {
+ "color": "#DEE1DE",
+ "stroke": "#DEE1DE",
+ "roundingForce": 0
+ }
+ },
+ "plots": {
+ "outlineColor": "#fbfafa"
+ },
+ "areas": {
+ "opacity": 40
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_quick_chart.json b/src/themes/vue_ui_quick_chart.json
new file mode 100644
index 00000000..d53e5064
--- /dev/null
+++ b/src/themes/vue_ui_quick_chart.json
@@ -0,0 +1,79 @@
+{
+ "default": {},
+ "dark": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "donutStroke": "#1A1A1A",
+ "xyAxisStroke": "#5A5A5A",
+ "xyGridStroke": "#4A4A4A",
+ "xyHighlighterColor": "#CCCCCC",
+ "zoomColor": "#4A4A4A",
+ "zoomHighlightColor": "#9A9A9A",
+ "zoomMinimap": {
+ "lineColor": "#424242",
+ "selectedColor": "#8A8A8A",
+ "indicatorColor": "#CCCCCC"
+ },
+ "tooltipBorderColor": "#5A5A5A",
+ "tooltipBackgroundOpacity": 70
+ },
+ "celebration": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "xyAxisStroke": "#5D4037",
+ "xyGridStroke": "#5D403760",
+ "xyHighlighterColor": "#424242",
+ "zoomColor": "#5D4037",
+ "zoomHighlightColor": "#FF8A65",
+ "zoomMinimap": {
+ "lineColor": "#424242",
+ "selectedColor": "#FF8A65"
+ },
+ "tooltipBorderColor": "#FF8A65",
+ "tooltipBackgroundOpacity": 30
+ },
+ "celebrationNight": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "xyAxisStroke": "#5D4037",
+ "xyGridStroke": "#5D403780",
+ "xyHighlighterColor": "#FFF8E1",
+ "zoomColor": "#5D4037",
+ "zoomHighlightColor": "#FF8A65",
+ "zoomMinimap": {
+ "lineColor": "#FF6B6B",
+ "selectedColor": "#FF8A65",
+ "indicatorColor": "#FF8A65"
+ },
+ "tooltipBorderColor": "#FF8A65",
+ "tooltipBackgroundOpacity": 30
+ },
+ "hack": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "xyAxisStroke": "#5F6A5F",
+ "xyGridStroke": "#333333",
+ "xyHighlighterColor": "#66CC66",
+ "zoomColor": "#5F6A5F",
+ "zoomHighlightColor": "#66CC66",
+ "tooltipBorderColor": "#66CC66"
+ },
+ "zen": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "xyAxisStroke": "transparent",
+ "xyGridStroke": "transparent",
+ "xyHighlighterColor": "#8F837A",
+ "zoomColor": "#E0CFC3",
+ "zoomHighlightColor": "#8F837A"
+ },
+ "concrete": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "xyAxisStroke": "#829C98",
+ "xyGridStroke": "#CCD6D3",
+ "xyHighlighterColor": "#7DA9B5",
+ "zoomColor": "#92B0AB",
+ "zoomHighlightColor": "#50606C"
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_radar.json b/src/themes/vue_ui_radar.json
new file mode 100644
index 00000000..6cde4f8f
--- /dev/null
+++ b/src/themes/vue_ui_radar.json
@@ -0,0 +1,285 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "outerPolygon": {
+ "stroke": "#6A6A6A"
+ },
+ "grid": {
+ "stroke": "#5A5A5A"
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#1A1A1A",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "outerPolygon": {
+ "stroke": "#5D403780",
+ "strokeWidth": 1
+ },
+ "grid": {
+ "stroke": "#5D403740"
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#424242"
+ }
+ }
+ },
+ "legend": {
+ "color": "#424242",
+ "backgroundColor": "#FFF8E1"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "outerPolygon": {
+ "stroke": "#3A3A3A",
+ "strokeWidth": 1
+ },
+ "grid": {
+ "stroke": "#3A3A3A"
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "legend": {
+ "color": "#BDBDBD",
+ "backgroundColor": "#1E1E1E"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "outerPolygon": {
+ "stroke": "#336633",
+ "strokeWidth": 0
+ },
+ "grid": {
+ "stroke": "#334C33",
+ "graduations": 1
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#99AA99"
+ }
+ }
+ },
+ "legend": {
+ "color": "#99AA99",
+ "backgroundColor": "#1A1A1A"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "outerPolygon": {
+ "strokeWidth": 0
+ },
+ "grid": {
+ "show": false
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#99AA99"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "outerPolygon": {
+ "stroke": "#ABB1BC",
+ "strokeWidth": 0.5
+ },
+ "grid": {
+ "stroke": "#C3DAC8"
+ },
+ "labels": {
+ "dataLabels": {
+ "color": "#99AA99"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_relation_circle.json b/src/themes/vue_ui_relation_circle.json
new file mode 100644
index 00000000..4e18e8ad
--- /dev/null
+++ b/src/themes/vue_ui_relation_circle.json
@@ -0,0 +1,129 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "labels": {
+ "color": "#CCCCCC"
+ },
+ "circle": {
+ "stroke": "#5A5A5A"
+ },
+ "plot": {
+ "color": "#1A1A1A"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "labels": {
+ "color": "#424242"
+ },
+ "circle": {
+ "stroke": "#5D403780"
+ },
+ "plot": {
+ "color": "#5D4037"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "labels": {
+ "color": "#BDBDBD"
+ },
+ "circle": {
+ "stroke": "#5D403780"
+ },
+ "plot": {
+ "color": "#5D4037"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "labels": {
+ "color": "#AACCAA"
+ },
+ "circle": {
+ "stroke": "#333333"
+ },
+ "plot": {
+ "color": "#66CC66"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "labels": {
+ "color": "#A0AC94"
+ },
+ "circle": {
+ "stroke": "transparent"
+ },
+ "plot": {
+ "color": "#C09E85"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "labels": {
+ "color": "#61747E"
+ },
+ "circle": {
+ "stroke": "#D2D7E0"
+ },
+ "plot": {
+ "color": "#97ACB7"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_ridgeline.json b/src/themes/vue_ui_ridgeline.json
new file mode 100644
index 00000000..0c85c1ba
--- /dev/null
+++ b/src/themes/vue_ui_ridgeline.json
@@ -0,0 +1,880 @@
+{
+ "default": {},
+ "dark": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "areas": {
+ "stroke": {
+ "color": "#1A1A1A"
+ }
+ },
+ "dialog": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "header": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "xyChart": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A",
+ "minimap": {
+ "selectedColor": "#8A8A8A",
+ "lineColor": "#424242",
+ "indicatorColor": "#CCCCCC"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "timeTag": {
+ "backgroundColor": "#2A2A2A",
+ "color": "#CCCCCC",
+ "circleMarker": {
+ "color": "#2A2A2A"
+ }
+ },
+ "grid": {
+ "stroke": "#5A5A5A",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#CCCCCC",
+ "xAxisLabels": {
+ "color": "#CCCCCC"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ },
+ "bar": {
+ "border": {
+ "stroke": "#1A1A1A"
+ },
+ "labels": {
+ "color": "#CCCCCC"
+ },
+ "serieName": {
+ "color": "#CCCCCC"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "selector": {
+ "stroke": "#CCCCCC",
+ "dot": {
+ "fill": "#CCCCCC",
+ "stroke": "#1A1A1A"
+ },
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "xAxis": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "yAxis": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "zeroLine": {
+ "stroke": "#5A5A5A"
+ }
+ }
+ }
+ },
+ "celebration": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "areas": {
+ "stroke": {
+ "color": "#8F837A"
+ }
+ },
+ "dialog": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "header": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "xyChart": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65",
+ "minimap": {
+ "selectedColor": "#FF8A65",
+ "lineColor": "#424242",
+ "indicatorColor": "#FF8A65"
+ }
+ },
+ "highlighter": {
+ "color": "#424242"
+ },
+ "timeTag": {
+ "backgroundColor": "#424242",
+ "color": "#FFF8E1",
+ "circleMarker": {
+ "color": "#424242"
+ }
+ },
+ "grid": {
+ "stroke": "#5D4037",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#424242",
+ "xAxisLabels": {
+ "color": "#424242"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "bar": {
+ "borderRadius": 2,
+ "border": {
+ "stroke": "#FFF8E1"
+ },
+ "labels": {
+ "color": "#424242"
+ },
+ "serieName": {
+ "color": "#424242"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "selector": {
+ "stroke": "#FF8A65",
+ "dot": {
+ "fill": "#424242",
+ "stroke": "#FFF8E1"
+ },
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "xAxis": {
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "yAxis": {
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "zeroLine": {
+ "stroke": "#5D4037"
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "areas": {
+ "stroke": {
+ "color": "#8F837A"
+ }
+ },
+ "dialog": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "header": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "xyChart": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65",
+ "minimap": {
+ "selectedColor": "#FF8A65",
+ "lineColor": "#FF6B6B",
+ "indicatorColor": "#FF8A65"
+ }
+ },
+ "highlighter": {
+ "color": "#FFF8E1"
+ },
+ "timeTag": {
+ "backgroundColor": "#5D4037",
+ "color": "#FFF8E1",
+ "circleMarker": {
+ "color": "#5D4037"
+ }
+ },
+ "grid": {
+ "stroke": "#5D4037",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#BDBDBD",
+ "xAxisLabels": {
+ "color": "#BDBDBD"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "bar": {
+ "borderRadius": 2,
+ "border": {
+ "stroke": "#1E1E1E"
+ },
+ "labels": {
+ "color": "#BDBDBD"
+ },
+ "serieName": {
+ "color": "#BDBDBD"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "selector": {
+ "stroke": "#FF8A65",
+ "dot": {
+ "fill": "#424242",
+ "stroke": "#1E1E1E"
+ },
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "xAxis": {
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "yAxis": {
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "zeroLine": {
+ "stroke": "#5D4037"
+ }
+ }
+ }
+ },
+ "hack": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "areas": {
+ "stroke": {
+ "color": "#66CC66"
+ }
+ },
+ "dialog": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "header": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "xyChart": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "timeTag": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#66CC66",
+ "circleMarker": {
+ "color": "#66CC66"
+ }
+ },
+ "grid": {
+ "stroke": "#5F6A5F",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#99AA99",
+ "xAxisLabels": {
+ "color": "#99AA99"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ },
+ "bar": {
+ "borderRadius": 0,
+ "border": {
+ "stroke": "#66CC66"
+ },
+ "labels": {
+ "color": "#AACCAA"
+ },
+ "serieName": {
+ "color": "#99CC99"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#AACCAA"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#AACCAA"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "selector": {
+ "stroke": "#99AA99",
+ "dot": {
+ "fill": "#4A4A4A",
+ "stroke": "#1A1A1A"
+ },
+ "labels": {
+ "color": "#99AA99"
+ }
+ },
+ "xAxis": {
+ "labels": {
+ "color": "#99AA99"
+ }
+ },
+ "yAxis": {
+ "labels": {
+ "color": "#99AA99"
+ }
+ },
+ "zeroLine": {
+ "stroke": "#2A2A2A"
+ }
+ }
+ }
+ },
+ "zen": {
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "areas": {
+ "stroke": {
+ "color": "#8F837A"
+ }
+ },
+ "dialog": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "header": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "xyChart": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "timeTag": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "circleMarker": {
+ "color": "#8A9892"
+ }
+ },
+ "grid": {
+ "stroke": "transparent",
+ "labels": {
+ "show": false,
+ "color": "#99AA99",
+ "xAxisLabels": {
+ "show": false,
+ "color": "#99AA99"
+ },
+ "zeroLine": {
+ "show": false
+ },
+ "yAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "bar": {
+ "borderRadius": 4,
+ "border": {
+ "stroke": "#D7E0D2"
+ },
+ "labels": {
+ "color": "#8F837A"
+ },
+ "serieName": {
+ "color": "#858480"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "selector": {
+ "stroke": "#8F837A",
+ "dot": {
+ "fill": "#8F837A",
+ "stroke": "#fbfafa"
+ },
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "xAxis": {
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "yAxis": {
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "zeroLine": {
+ "stroke": "#8F837A"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "areas": {
+ "stroke": {
+ "color": "#829C98"
+ }
+ },
+ "dialog": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "header": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "xyChart": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "highlighter": {
+ "color": "#7DA9B5"
+ },
+ "timeTag": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "circleMarker": {
+ "color": "#50606C"
+ }
+ },
+ "grid": {
+ "stroke": "#829C98",
+ "showVerticalLines": true,
+ "showHorizontalLines": true,
+ "labels": {
+ "color": "#50606C",
+ "xAxisLabels": {
+ "color": "#50606C"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "bar": {
+ "borderRadius": 2,
+ "border": {
+ "stroke": "#404C4D"
+ },
+ "labels": {
+ "color": "#50606C"
+ },
+ "serieName": {
+ "color": "#61747E"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "selector": {
+ "stroke": "#7DA9B5",
+ "dot": {
+ "fill": "#7DA9B5",
+ "stroke": "#f6f6fb"
+ },
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "xAxis": {
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "yAxis": {
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "zeroLine": {
+ "stroke": "#829C98"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_rings.json b/src/themes/vue_ui_rings.json
new file mode 100644
index 00000000..b1391d71
--- /dev/null
+++ b/src/themes/vue_ui_rings.json
@@ -0,0 +1,237 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "rings": {
+ "stroke": "#3A3A3A"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "rings": {
+ "stroke": "#5D4037",
+ "strokeWidth": 10
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "rings": {
+ "stroke": "#2E2E2E",
+ "strokeWidth": 10
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "rings": {
+ "stroke": "#1A1A1A",
+ "strokeWidth": 10
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "rings": {
+ "stroke": "#fbfafa",
+ "strokeWidth": 10
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "rings": {
+ "stroke": "#fbfafa",
+ "strokeWidth": 10
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_scatter.json b/src/themes/vue_ui_scatter.json
new file mode 100644
index 00000000..6eebab44
--- /dev/null
+++ b/src/themes/vue_ui_scatter.json
@@ -0,0 +1,394 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "axis": {
+ "stroke": "#5A5A5A"
+ },
+ "marginalBars": {
+ "fill": "#5A5A5A"
+ },
+ "plots": {
+ "stroke": "#1A1A1A",
+ "selectors": {
+ "stroke": "#5A5A5A",
+ "labels": {
+ "color": "#CCCCCC"
+ },
+ "markers": {
+ "stroke": "#1A1A1A",
+ "fill": "#5A5A5A"
+ }
+ }
+ },
+ "correlation": {
+ "label": {
+ "color": "#CCCCCC"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#CCCCCC"
+ },
+ "yAxis": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "axis": {
+ "stroke": "#5D403790"
+ },
+ "marginalBars": {
+ "fill": "#5D4037"
+ },
+ "plots": {
+ "stroke": "#FFF8E1",
+ "selectors": {
+ "stroke": "#5D4037",
+ "labels": {
+ "color": "#424242"
+ },
+ "markers": {
+ "stroke": "#FFF8E1",
+ "fill": "#D32F2F"
+ }
+ }
+ },
+ "correlation": {
+ "label": {
+ "color": "#424242"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#424242"
+ },
+ "yAxis": {
+ "color": "#424242"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "axis": {
+ "stroke": "#5D4037"
+ },
+ "marginalBars": {
+ "fill": "#D32F2F"
+ },
+ "plots": {
+ "stroke": "#1E1E1E",
+ "selectors": {
+ "stroke": "#BDBDBD",
+ "labels": {
+ "color": "#BDBDBD"
+ },
+ "markers": {
+ "stroke": "#BDBDBD",
+ "fill": "#D32F2F"
+ }
+ }
+ },
+ "correlation": {
+ "label": {
+ "color": "#BDBDBD"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#BDBDBD"
+ },
+ "yAxis": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "axis": {
+ "stroke": "#334C33"
+ },
+ "marginalBars": {
+ "fill": "#66CC66"
+ },
+ "plots": {
+ "stroke": "#1A1A1A",
+ "selectors": {
+ "stroke": "#66CC66",
+ "labels": {
+ "color": "#AACCAA"
+ },
+ "markers": {
+ "stroke": "#66CC66",
+ "fill": "#1A1A1A"
+ }
+ }
+ },
+ "correlation": {
+ "label": {
+ "color": "#AACCAA"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#AACCAA"
+ },
+ "yAxis": {
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "axis": {
+ "stroke": "transparent"
+ },
+ "marginalBars": {
+ "fill": "#B0B9A8"
+ },
+ "plots": {
+ "stroke": "#fbfafa",
+ "selectors": {
+ "stroke": "#4F5B75",
+ "labels": {
+ "color": "#928A98"
+ },
+ "markers": {
+ "stroke": "#4F5B75",
+ "fill": "#fbfafa"
+ }
+ }
+ },
+ "correlation": {
+ "label": {
+ "color": "#928A98"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#928A98"
+ },
+ "yAxis": {
+ "color": "#928A98"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "axis": {
+ "stroke": "#92B0B5"
+ },
+ "marginalBars": {
+ "fill": "#ABB1BC"
+ },
+ "plots": {
+ "stroke": "#fbfafa",
+ "selectors": {
+ "stroke": "#4F5B75",
+ "labels": {
+ "color": "#404C4D"
+ },
+ "markers": {
+ "stroke": "#4F5B75",
+ "fill": "#f6f6fb"
+ }
+ }
+ },
+ "correlation": {
+ "label": {
+ "color": "#61747E"
+ }
+ },
+ "dataLabels": {
+ "xAxis": {
+ "color": "#61747E"
+ },
+ "yAxis": {
+ "color": "#61747E"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_spark_trend.json b/src/themes/vue_ui_spark_trend.json
new file mode 100644
index 00000000..9cf856c3
--- /dev/null
+++ b/src/themes/vue_ui_spark_trend.json
@@ -0,0 +1,105 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "dataLabel": {
+ "color": "#CCCCCC"
+ },
+ "trendLabel": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "line": {
+ "smooth": false
+ },
+ "dataLabel": {
+ "color": "#424242"
+ },
+ "trendLabel": {
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "line": {
+ "smooth": false
+ },
+ "dataLabel": {
+ "color": "#BDBDBD"
+ },
+ "trendLabel": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "line": {
+ "stroke": "#00FF00",
+ "smooth": false
+ },
+ "dataLabel": {
+ "color": "#AACCAA"
+ },
+ "trendLabel": {
+ "color": "#99CC99"
+ },
+ "arrow": {
+ "colors": {
+ "positive": "#66CC66",
+ "negative": "#196619"
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "line": {
+ "stroke": "#B9B99D"
+ },
+ "dataLabel": {
+ "color": "#8A9892"
+ },
+ "trendLabel": {
+ "color": "#99CC99"
+ },
+ "arrow": {
+ "colors": {
+ "positive": "#B9B99D",
+ "negative": "#C09E85",
+ "neutral": "#A5AFC1"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "line": {
+ "stroke": "#4A6A75"
+ },
+ "dataLabel": {
+ "color": "#61747E"
+ },
+ "trendLabel": {
+ "color": "#8A9892"
+ },
+ "arrow": {
+ "colors": {
+ "positive": "#4A6A75",
+ "negative": "#C09E85",
+ "neutral": "#ABB1BC"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_sparkbar.json b/src/themes/vue_ui_sparkbar.json
new file mode 100644
index 00000000..ce0e79f0
--- /dev/null
+++ b/src/themes/vue_ui_sparkbar.json
@@ -0,0 +1,120 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "gutter": {
+ "backgroundColor": "#3A3A3A"
+ },
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#1A1A1A"
+ }
+ },
+ "labels": {
+ "name": {
+ "color": "#CCCCCC"
+ }
+ },
+ "title": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "gutter": {
+ "backgroundColor": "#ded6ca"
+ },
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#FFF8E1"
+ }
+ },
+ "labels": {
+ "name": {
+ "color": "#424242"
+ }
+ },
+ "title": {
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "gutter": {
+ "backgroundColor": "#2E2E2E"
+ },
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#FFF8E1"
+ }
+ },
+ "labels": {
+ "name": {
+ "color": "#BDBDBD"
+ }
+ },
+ "title": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "gutter": {
+ "backgroundColor": "#333333"
+ },
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#1A1A1A"
+ }
+ },
+ "labels": {
+ "name": {
+ "color": "#99CC99"
+ }
+ },
+ "title": {
+ "color": "#66CC66"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "gutter": {
+ "backgroundColor": "#f5f0eb"
+ },
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#fbfafa"
+ }
+ },
+ "labels": {
+ "name": {
+ "color": "#8A9892"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#f6f6fb"
+ }
+ },
+ "labels": {
+ "name": {
+ "color": "#50606C"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_sparkgauge.json b/src/themes/vue_ui_sparkgauge.json
new file mode 100644
index 00000000..553374db
--- /dev/null
+++ b/src/themes/vue_ui_sparkgauge.json
@@ -0,0 +1,116 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "background": "#1A1A1A",
+ "title": {
+ "color": "#CCCCCC"
+ },
+ "dataLabel": {
+ "color": "#CCCCCC"
+ },
+ "gutter": {
+ "color": "#3A3A3A"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "background": "#FFF8E1",
+ "title": {
+ "color": "#424242"
+ },
+ "dataLabel": {
+ "color": "#424242"
+ },
+ "colors": {
+ "min": "#F57C00",
+ "max": "#D32F2F"
+ },
+ "gutter": {
+ "color": "#5D403740"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "background": "#1E1E1E",
+ "title": {
+ "color": "#BDBDBD"
+ },
+ "dataLabel": {
+ "color": "#BDBDBD"
+ },
+ "colors": {
+ "min": "#F57C00",
+ "max": "#D32F2F"
+ },
+ "gutter": {
+ "color": "#5D403740"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "background": "#1A1A1A",
+ "title": {
+ "color": "#66CC66"
+ },
+ "dataLabel": {
+ "color": "#AACCAA"
+ },
+ "colors": {
+ "min": "#334C33",
+ "max": "#33CC33"
+ },
+ "track": {
+ "color": "#33CC33"
+ },
+ "gutter": {
+ "color": "#333333"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "background": "#fbfafa",
+ "title": {
+ "color": "#8A9892"
+ },
+ "dataLabel": {
+ "color": "#A0AC94"
+ },
+ "colors": {
+ "min": "#C09E85",
+ "max": "#B9B99D"
+ },
+ "track": {
+ "color": "#B9B99D"
+ },
+ "gutter": {
+ "color": "#f5f0eb"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "background": "#f6f6fb",
+ "title": {
+ "color": "#50606C"
+ },
+ "dataLabel": {
+ "color": "#61747E"
+ },
+ "colors": {
+ "min": "#92B0AB",
+ "max": "#4A6A75"
+ },
+ "track": {
+ "color": "#4A6A75"
+ },
+ "gutter": {
+ "color": "#e1e5e8"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_sparkhistogram.json b/src/themes/vue_ui_sparkhistogram.json
new file mode 100644
index 00000000..c73b9ac8
--- /dev/null
+++ b/src/themes/vue_ui_sparkhistogram.json
@@ -0,0 +1,181 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "labels": {
+ "value": {
+ "color": "#CCCCCC"
+ },
+ "valueLabel": {
+ "color": "#CCCCCC"
+ },
+ "timeLabel": {
+ "color": "#CCCCCC"
+ }
+ },
+ "selector": {
+ "stroke": "#5A5A5A"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "bars": {
+ "colors": {
+ "positive": "#D32F2F",
+ "negative": "#F57C00"
+ }
+ },
+ "labels": {
+ "value": {
+ "color": "#424242"
+ },
+ "valueLabel": {
+ "color": "#424242"
+ },
+ "timeLabel": {
+ "color": "#757575"
+ }
+ },
+ "selector": {
+ "stroke": "#D32F2F"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "bars": {
+ "colors": {
+ "positive": "#D32F2F",
+ "negative": "#F57C00"
+ }
+ },
+ "labels": {
+ "value": {
+ "color": "#BDBDBD"
+ },
+ "valueLabel": {
+ "color": "#BDBDBD"
+ },
+ "timeLabel": {
+ "color": "#BDBDBD"
+ }
+ },
+ "selector": {
+ "stroke": "#D32F2F"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "bars": {
+ "colors": {
+ "positive": "#66CC66"
+ }
+ },
+ "labels": {
+ "value": {
+ "color": "#AACCAA"
+ },
+ "valueLabel": {
+ "color": "#99CC99"
+ },
+ "timeLabel": {
+ "color": "#99AA99"
+ }
+ },
+ "selector": {
+ "stroke": "#00FF00"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "bars": {
+ "colors": {
+ "positive": "#B9B99D",
+ "negative": "#C09E85"
+ }
+ },
+ "labels": {
+ "value": {
+ "color": "#A0AC94"
+ },
+ "valueLabel": {
+ "color": "#A0AC94"
+ },
+ "timeLabel": {
+ "color": "#8A9892"
+ }
+ },
+ "selector": {
+ "stroke": "#BBC4D3"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "bars": {
+ "colors": {
+ "positive": "#4A6A75"
+ }
+ },
+ "labels": {
+ "value": {
+ "color": "#61747E"
+ },
+ "valueLabel": {
+ "color": "#8A9892"
+ },
+ "timeLabel": {
+ "color": "#50606C"
+ }
+ },
+ "selector": {
+ "stroke": "#404C4D"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_sparkline.json b/src/themes/vue_ui_sparkline.json
new file mode 100644
index 00000000..45667f5c
--- /dev/null
+++ b/src/themes/vue_ui_sparkline.json
@@ -0,0 +1,180 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "zeroLine": {
+ "color": "#5A5A5A"
+ },
+ "plot": {
+ "stroke": "#1A1A1A"
+ },
+ "verticalIndicator": {
+ "color": "#8A8A8A"
+ },
+ "dataLabel": {
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC"
+ },
+ "tooltip": {
+ "color": "#CCCCCC",
+ "backgroundColor": "#1A1A1A",
+ "borderColor": "#5A5A5A",
+ "backgroundOpacity": 70
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "line": {
+ "color": "#D32F2F"
+ },
+ "bar": {
+ "color": "#D32F2F",
+ "borderRadius": 0
+ },
+ "zeroLine": {
+ "color": "#5D4037"
+ },
+ "plot": {
+ "stroke": "#FFF8E1"
+ },
+ "verticalIndicator": {
+ "color": "#FF9800"
+ },
+ "dataLabel": {
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242"
+ },
+ "area": {
+ "color": "#E64A19"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "line": {
+ "color": "#D32F2F"
+ },
+ "bar": {
+ "color": "#D32F2F",
+ "borderRadius": 0
+ },
+ "zeroLine": {
+ "color": "#5D4037"
+ },
+ "plot": {
+ "stroke": "#1E1E1E"
+ },
+ "verticalIndicator": {
+ "color": "#B71C1C"
+ },
+ "dataLabel": {
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#BDBDBD"
+ },
+ "area": {
+ "color": "#E64A19"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "line": {
+ "color": "#66CC66"
+ },
+ "bar": {
+ "color": "#66CC66",
+ "borderRadius": 0
+ },
+ "zeroLine": {
+ "color": "#5F6A5F"
+ },
+ "plot": {
+ "stroke": "#1A1A1A"
+ },
+ "verticalIndicator": {
+ "color": "#66CC66"
+ },
+ "dataLabel": {
+ "color": "#AACCAA"
+ },
+ "title": {
+ "color": "#66CC66"
+ },
+ "area": {
+ "color": "#66CC66"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "line": {
+ "color": "#B9B99D",
+ "smooth": true
+ },
+ "bar": {
+ "color": "#B9B99D",
+ "borderRadius": 3
+ },
+ "zeroLine": {
+ "strokeWidth": 0
+ },
+ "plot": {
+ "stroke": "#fbfafa"
+ },
+ "verticalIndicator": {
+ "color": "#B9B99D"
+ },
+ "dataLabel": {
+ "color": "#A0AC94"
+ },
+ "title": {
+ "color": "#8A9892"
+ },
+ "area": {
+ "color": "#B9B99D"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "line": {
+ "color": "#4A6A75"
+ },
+ "bar": {
+ "color": "#4A6A75",
+ "borderRadius": 0
+ },
+ "zeroLine": {
+ "color": "#9FA9BE"
+ },
+ "plot": {
+ "stroke": "#f6f6fb"
+ },
+ "verticalIndicator": {
+ "color": "#4A6A75"
+ },
+ "dataLabel": {
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C"
+ },
+ "area": {
+ "color": "#4A6A75"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_sparkstackbar.json b/src/themes/vue_ui_sparkstackbar.json
new file mode 100644
index 00000000..d5453589
--- /dev/null
+++ b/src/themes/vue_ui_sparkstackbar.json
@@ -0,0 +1,183 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#FFFFFF"
+ }
+ },
+ "legend": {
+ "name": {
+ "color": "#CCCCCC"
+ },
+ "value": {
+ "color": "#CCCCCC"
+ },
+ "percentage": {
+ "color": "#CCCCCC"
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#FFF8E1"
+ }
+ },
+ "legend": {
+ "name": {
+ "color": "#424242"
+ },
+ "value": {
+ "color": "#424242"
+ },
+ "percentage": {
+ "color": "#424242"
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "backgroundColor": "#1E1E1E",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#FFF8E1"
+ }
+ },
+ "legend": {
+ "name": {
+ "color": "#BDBDBD"
+ },
+ "value": {
+ "color": "#BDBDBD"
+ },
+ "percentage": {
+ "color": "#BDBDBD"
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#1A1A1A"
+ }
+ },
+ "legend": {
+ "name": {
+ "color": "#99AA99"
+ },
+ "value": {
+ "color": "#AACCAA"
+ },
+ "percentage": {
+ "color": "#99CC99"
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#fbfafa"
+ }
+ },
+ "legend": {
+ "name": {
+ "color": "#8A9892"
+ },
+ "value": {
+ "color": "#A0AC94"
+ },
+ "percentage": {
+ "color": "#8A9892"
+ }
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "bar": {
+ "gradient": {
+ "underlayerColor": "#f6f6fb"
+ }
+ },
+ "legend": {
+ "name": {
+ "color": "#50606C"
+ },
+ "value": {
+ "color": "#8A9892"
+ },
+ "percentage": {
+ "color": "#61747E"
+ }
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_stackbar.json b/src/themes/vue_ui_stackbar.json
new file mode 100644
index 00000000..d7ef3146
--- /dev/null
+++ b/src/themes/vue_ui_stackbar.json
@@ -0,0 +1,410 @@
+{
+ "default": {},
+ "dark": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A",
+ "minimap": {
+ "selectedColor": "#8A8A8A",
+ "lineColor": "#424242",
+ "indicatorColor": "#CCCCCC"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "bars": {
+ "totalValues": {
+ "color": "#CCCCCC"
+ }
+ },
+ "grid": {
+ "frame": {
+ "stroke": "#5A5A5A"
+ },
+ "x": {
+ "axisColor": "#5A5A5A",
+ "linesColor": "#4A4A4A",
+ "axisName": {
+ "color": "#CCCCCC"
+ },
+ "timeLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "y": {
+ "axisColor": "#5A5A5A",
+ "linesColor": "#4A4A4A",
+ "axisName": {
+ "color": "#CCCCCC"
+ },
+ "axisLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "highlighter": {
+ "color": "#424242"
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "bars": {
+ "totalValues": {
+ "color": "#424242"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5D403780",
+ "axisName": {
+ "color": "#424242"
+ },
+ "timeLabels": {
+ "color": "#424242"
+ }
+ },
+ "y": {
+ "axisColor": "#5D403780",
+ "axisName": {
+ "color": "#424242"
+ },
+ "axisLabels": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "highlighter": {
+ "color": "#FFF8E1"
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "bars": {
+ "totalValues": {
+ "color": "#BDBDBD"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5D403740",
+ "axisName": {
+ "color": "#BDBDBD"
+ },
+ "timeLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "y": {
+ "axisColor": "#5D4037",
+ "axisName": {
+ "color": "#BDBDBD"
+ },
+ "axisLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ },
+ "bars": {
+ "totalValues": {
+ "color": "#99AA99"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5F6A5F",
+ "axisName": {
+ "color": "#66CC66"
+ },
+ "timeLabels": {
+ "color": "#99AA99"
+ }
+ },
+ "y": {
+ "axisColor": "#5F6A5F",
+ "axisName": {
+ "color": "#66CC66"
+ },
+ "axisLabels": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "bars": {
+ "borderRadius": 4,
+ "totalValues": {
+ "show": false
+ },
+ "dataLabels": {
+ "show": false
+ }
+ },
+ "grid": {
+ "x": {
+ "showAxis": false,
+ "axisName": {
+ "color": "#8F837A"
+ },
+ "timeLabels": {
+ "show": false
+ }
+ },
+ "y": {
+ "showAxis": false,
+ "axisName": {
+ "color": "#8F837A"
+ },
+ "axisLabels": {
+ "show": false
+ }
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "highlighter": {
+ "color": "#7DA9B5"
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "bars": {
+ "totalValues": {
+ "color": "#50606C"
+ }
+ },
+ "grid": {
+ "x": {
+ "showHorizontalLines": true,
+ "axisColor": "#829C98",
+ "axisName": {
+ "color": "#50606C"
+ },
+ "timeLabels": {
+ "color": "#61747E"
+ }
+ },
+ "y": {
+ "showVerticalLines": true,
+ "axisColor": "#829C98",
+ "axisName": {
+ "color": "#50606C"
+ },
+ "axisLabels": {
+ "color": "#61747E"
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_stackline.json b/src/themes/vue_ui_stackline.json
new file mode 100644
index 00000000..cbeef65c
--- /dev/null
+++ b/src/themes/vue_ui_stackline.json
@@ -0,0 +1,422 @@
+{
+ "default": {},
+ "dark": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A",
+ "minimap": {
+ "selectedColor": "#8A8A8A",
+ "lineColor": "#424242",
+ "indicatorColor": "#CCCCCC"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "lines": {
+ "totalValues": {
+ "color": "#CCCCCC"
+ },
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5A5A5A",
+ "linesColor": "#4A4A4A",
+ "axisName": {
+ "color": "#CCCCCC"
+ },
+ "timeLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "y": {
+ "axisColor": "#5A5A5A",
+ "linesColor": "#4A4A4A",
+ "axisName": {
+ "color": "#CCCCCC"
+ },
+ "axisLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "highlighter": {
+ "color": "#424242"
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "lines": {
+ "totalValues": {
+ "color": "#424242"
+ },
+ "dataLabels": {
+ "color": "#424242"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5D403780",
+ "axisName": {
+ "color": "#424242"
+ },
+ "timeLabels": {
+ "color": "#424242"
+ }
+ },
+ "y": {
+ "axisColor": "#5D403780",
+ "axisName": {
+ "color": "#424242"
+ },
+ "axisLabels": {
+ "color": "#424242"
+ }
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "highlighter": {
+ "color": "#FFF8E1"
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "lines": {
+ "totalValues": {
+ "color": "#BDBDBD"
+ },
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5D403740",
+ "axisName": {
+ "color": "#BDBDBD"
+ },
+ "timeLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "y": {
+ "axisColor": "#5D4037",
+ "axisName": {
+ "color": "#BDBDBD"
+ },
+ "axisLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ },
+ "lines": {
+ "totalValues": {
+ "color": "#99AA99"
+ },
+ "dataLabels": {
+ "color": "#99AA99"
+ }
+ },
+ "grid": {
+ "x": {
+ "axisColor": "#5F6A5F",
+ "axisName": {
+ "color": "#66CC66"
+ },
+ "timeLabels": {
+ "color": "#99AA99"
+ }
+ },
+ "y": {
+ "axisColor": "#5F6A5F",
+ "axisName": {
+ "color": "#66CC66"
+ },
+ "axisLabels": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "lines": {
+ "borderRadius": 4,
+ "totalValues": {
+ "show": false
+ },
+ "dataLabels": {
+ "show": false
+ }
+ },
+ "grid": {
+ "x": {
+ "showAxis": false,
+ "axisName": {
+ "color": "#8F837A"
+ },
+ "timeLabels": {
+ "show": false
+ }
+ },
+ "y": {
+ "showAxis": false,
+ "axisName": {
+ "color": "#8F837A"
+ },
+ "axisLabels": {
+ "show": false
+ }
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ },
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "highlighter": {
+ "color": "#7DA9B5"
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "lines": {
+ "totalValues": {
+ "color": "#50606C"
+ },
+ "dataLabels": {
+ "color": "#50606C"
+ }
+ },
+ "grid": {
+ "x": {
+ "showHorizontalLines": true,
+ "axisColor": "#829C98",
+ "axisName": {
+ "color": "#50606C"
+ },
+ "timeLabels": {
+ "color": "#61747E"
+ }
+ },
+ "y": {
+ "showVerticalLines": true,
+ "axisColor": "#829C98",
+ "axisName": {
+ "color": "#50606C"
+ },
+ "axisLabels": {
+ "color": "#61747E"
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_strip_plot.json b/src/themes/vue_ui_strip_plot.json
new file mode 100644
index 00000000..cd58f9b4
--- /dev/null
+++ b/src/themes/vue_ui_strip_plot.json
@@ -0,0 +1,335 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "grid": {
+ "stroke": "#5A5A5A",
+ "horizontalGrid": {
+ "stroke": "#4A4A4A"
+ },
+ "verticalGrid": {
+ "stroke": "#4A4A4A"
+ }
+ },
+ "plots": {
+ "stroke": "#1A1A1A"
+ },
+ "labels": {
+ "bestPlotLabel": {
+ "color": "#CCCCCC"
+ },
+ "axis": {
+ "color": "#CCCCCC"
+ },
+ "xAxisLabels": {
+ "color": "#CCCCCC"
+ },
+ "yAxisLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "grid": {
+ "stroke": "#5D4037",
+ "horizontalGrid": {
+ "show": false
+ },
+ "verticalGrid": {
+ "show": false
+ }
+ },
+ "plots": {
+ "stroke": "#FFF8E1"
+ },
+ "labels": {
+ "bestPlotLabel": {
+ "color": "#424242"
+ },
+ "axis": {
+ "color": "#424242"
+ },
+ "xAxisLabels": {
+ "color": "#424242"
+ },
+ "yAxisLabels": {
+ "color": "#424242"
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "grid": {
+ "stroke": "#5D4037",
+ "horizontalGrid": {
+ "show": false
+ },
+ "verticalGrid": {
+ "show": false
+ }
+ },
+ "plots": {
+ "stroke": "#1E1E1E"
+ },
+ "labels": {
+ "bestPlotLabel": {
+ "color": "#BDBDBD"
+ },
+ "axis": {
+ "color": "#BDBDBD"
+ },
+ "xAxisLabels": {
+ "color": "#BDBDBD"
+ },
+ "yAxisLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "grid": {
+ "stroke": "#5F6A5F",
+ "horizontalGrid": {
+ "show": false
+ },
+ "verticalGrid": {
+ "show": false
+ }
+ },
+ "plots": {
+ "stroke": "#00FF00"
+ },
+ "labels": {
+ "bestPlotLabel": {
+ "color": "#AACCAA"
+ },
+ "axis": {
+ "color": "#99CC99"
+ },
+ "xAxisLabels": {
+ "color": "#99CC99"
+ },
+ "yAxisLabels": {
+ "color": "#99CC99"
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "grid": {
+ "show": false,
+ "horizontalGrid": {
+ "show": false
+ },
+ "verticalGrid": {
+ "show": false
+ }
+ },
+ "plots": {
+ "stroke": "#fbfafa"
+ },
+ "labels": {
+ "bestPlotLabel": {
+ "color": "#A0AC94"
+ },
+ "axis": {
+ "color": "#A0AC94"
+ },
+ "xAxisLabels": {
+ "color": "#A0AC94"
+ },
+ "yAxisLabels": {
+ "show": false,
+ "color": "#A0AC94"
+ }
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "grid": {
+ "stroke": "#829C98",
+ "horizontalGrid": {
+ "stroke": "#829C98"
+ },
+ "verticalGrid": {
+ "stroke": "#829C98"
+ }
+ },
+ "plots": {
+ "stroke": "#404C5A"
+ },
+ "labels": {
+ "bestPlotLabel": {
+ "color": "#61747E"
+ },
+ "axis": {
+ "color": "#61747E"
+ },
+ "xAxisLabels": {
+ "color": "#61747E"
+ },
+ "yAxisLabels": {
+ "color": "#61747E"
+ }
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_table_heatmap.json b/src/themes/vue_ui_table_heatmap.json
new file mode 100644
index 00000000..113a51fd
--- /dev/null
+++ b/src/themes/vue_ui_table_heatmap.json
@@ -0,0 +1,79 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "table": {
+ "head": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "heatmapColors": {
+ "min": "#FFECB3",
+ "max": "#D32F2F"
+ }
+ },
+ "table": {
+ "head": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "heatmapColors": {
+ "min": "#333333",
+ "max": "#66CC66"
+ }
+ },
+ "table": {
+ "head": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "heatmapColors": {
+ "max": "#C09E85",
+ "min": "#DCDFE7"
+ }
+ },
+ "table": {
+ "head": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "heatmapColors": {
+ "max": "#4A6A75",
+ "min": "#EFECEC"
+ }
+ },
+ "table": {
+ "head": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_table_sparkline.json b/src/themes/vue_ui_table_sparkline.json
new file mode 100644
index 00000000..40e056e3
--- /dev/null
+++ b/src/themes/vue_ui_table_sparkline.json
@@ -0,0 +1,105 @@
+{
+ "default": {},
+ "dark": {
+ "title": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "thead": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "tbody": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ },
+ "celebration": {
+ "title": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "thead": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "tbody": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ },
+ "celebrationNight": {
+ "title": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "thead": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "tbody": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ },
+ "hack": {
+ "title": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "thead": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "tbody": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ }
+ },
+ "zen": {
+ "title": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "thead": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "tbody": {
+ "backgroundColor": "#fbfafa",
+ "color": "#A0AC94"
+ }
+ },
+ "concrete": {
+ "title": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "thead": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "tbody": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_thermometer.json b/src/themes/vue_ui_thermometer.json
new file mode 100644
index 00000000..02392519
--- /dev/null
+++ b/src/themes/vue_ui_thermometer.json
@@ -0,0 +1,141 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "graduations": {
+ "stroke": "#2A2A2A"
+ },
+ "label": {
+ "color": "#CCCCCC"
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "graduations": {
+ "stroke": "#FFF8E1",
+ "strokeWidth": 1,
+ "gradient": {
+ "show": true
+ }
+ },
+ "label": {
+ "color": "#424242"
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "graduations": {
+ "stroke": "#5D4037",
+ "strokeWidth": 1,
+ "gradient": {
+ "show": true
+ }
+ },
+ "label": {
+ "color": "#BDBDBD"
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "graduations": {
+ "stroke": "#1A1A1A",
+ "strokeWidth": 1,
+ "gradient": {
+ "show": true
+ }
+ },
+ "label": {
+ "color": "#66CC66"
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "graduations": {
+ "show": false,
+ "gradient": {
+ "show": true
+ }
+ },
+ "label": {
+ "color": "#B9B99D"
+ }
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "graduations": {
+ "stroke": "#1A1A1A",
+ "gradient": {
+ "show": true
+ }
+ },
+ "label": {
+ "color": "#61747E"
+ }
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_tiremarks.json b/src/themes/vue_ui_tiremarks.json
new file mode 100644
index 00000000..2ca13b11
--- /dev/null
+++ b/src/themes/vue_ui_tiremarks.json
@@ -0,0 +1,143 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "inactiveColor": "#4A4A4A"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "crescendo": false,
+ "inactiveColor": "#5D403760",
+ "activeColor": "#D32F2F",
+ "ticks": {
+ "gradient": {
+ "shiftHueIntensity": 0
+ }
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "crescendo": false,
+ "inactiveColor": "#5D403760",
+ "activeColor": "#D32F2F",
+ "ticks": {
+ "gradient": {
+ "shiftHueIntensity": 0
+ }
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "crescendo": false,
+ "inactiveColor": "#333333",
+ "activeColor": "#66CC66",
+ "ticks": {
+ "gradient": {
+ "shiftHueIntensity": 15
+ }
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "crescendo": true,
+ "curved": true,
+ "curveAngleX": 5,
+ "curveAngleY": 5,
+ "inactiveColor": "#F7EDE2",
+ "activeColor": "#B1A7AD",
+ "ticks": {
+ "gradient": {
+ "shiftHueIntensity": 15
+ }
+ }
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "crescendo": false,
+ "inactiveColor": "#BBCBC7",
+ "activeColor": "#6C94A0",
+ "ticks": {
+ "gradient": {
+ "shiftHueIntensity": 10
+ }
+ }
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_treemap.json b/src/themes/vue_ui_treemap.json
new file mode 100644
index 00000000..7f7472bc
--- /dev/null
+++ b/src/themes/vue_ui_treemap.json
@@ -0,0 +1,252 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "rects": {
+ "stroke": "#1A1A1A",
+ "selected": {
+ "stroke": "#5A5A5A"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "rects": {
+ "stroke": "#FFF8E1",
+ "selected": {
+ "stroke": "#FFF8E1"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "rects": {
+ "stroke": "#1E1E1E",
+ "selected": {
+ "stroke": "#1E1E1E"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "rects": {
+ "stroke": "#1A1A1A",
+ "selected": {
+ "stroke": "#1A1A1A"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "rects": {
+ "stroke": "#fbfafa",
+ "strokeWidth": 2,
+ "borderRadius": 12,
+ "selected": {
+ "stroke": "#fbfafa"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "rects": {
+ "stroke": "#1A1A1A",
+ "selected": {
+ "stroke": "#1A1A1A"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_vertical_bar.json b/src/themes/vue_ui_vertical_bar.json
new file mode 100644
index 00000000..ef494f59
--- /dev/null
+++ b/src/themes/vue_ui_vertical_bar.json
@@ -0,0 +1,327 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "separators": {
+ "color": "#4A4A4A"
+ },
+ "bars": {
+ "dataLabels": {
+ "color": "#CCCCCC"
+ },
+ "nameLabels": {
+ "color": "#CCCCCC"
+ },
+ "parentLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": false,
+ "dataLabels": {
+ "color": "#424242"
+ },
+ "nameLabels": {
+ "color": "#424242"
+ },
+ "parentLabels": {
+ "color": "#424242"
+ }
+ },
+ "highlighter": {
+ "color": "#FF8A65"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": false,
+ "dataLabels": {
+ "color": "#BDBDBD"
+ },
+ "nameLabels": {
+ "color": "#BDBDBD"
+ },
+ "parentLabels": {
+ "color": "#FFF8E1"
+ }
+ },
+ "highlighter": {
+ "color": "#FF8A65"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": false,
+ "dataLabels": {
+ "color": "#AACCAA"
+ },
+ "nameLabels": {
+ "color": "#99CC99"
+ },
+ "parentLabels": {
+ "color": "#99CC99"
+ }
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "bars": {
+ "borderRadius": 8,
+ "useGradient": true,
+ "dataLabels": {
+ "color": "#A0AC94"
+ },
+ "nameLabels": {
+ "color": "#8A9892"
+ },
+ "parentLabels": {
+ "color": "#8A9892"
+ }
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "separators": {
+ "show": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "bars": {
+ "borderRadius": 0,
+ "useGradient": true,
+ "dataLabels": {
+ "color": "#61747E"
+ },
+ "nameLabels": {
+ "color": "#8A9892"
+ },
+ "parentLabels": {
+ "color": "#8A9892"
+ }
+ },
+ "highlighter": {
+ "color": "#50606C"
+ },
+ "separators": {
+ "show": true,
+ "color": "#DEE1DE"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_waffle.json b/src/themes/vue_ui_waffle.json
new file mode 100644
index 00000000..d2b108b0
--- /dev/null
+++ b/src/themes/vue_ui_waffle.json
@@ -0,0 +1,242 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "rect": {
+ "rounded": false,
+ "stroke": "#1A1A1A"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "rect": {
+ "rounded": false,
+ "stroke": "#FFF8E1",
+ "useGradient": false
+ }
+ },
+ "legend": {
+ "color": "#424242",
+ "backgroundColor": "#FFF8E1"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "rect": {
+ "rounded": false,
+ "stroke": "#1E1E1E",
+ "useGradient": false
+ }
+ },
+ "legend": {
+ "color": "#BDBDBD",
+ "backgroundColor": "#1E1E1E"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "rect": {
+ "rounded": false,
+ "stroke": "#66CC66",
+ "useGradient": false
+ }
+ },
+ "legend": {
+ "color": "#99AA99",
+ "backgroundColor": "#1A1A1A"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "rect": {
+ "rounding": 4,
+ "stroke": "#fbfafa"
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "rect": {
+ "rounded": false,
+ "stroke": "#404C5A",
+ "useGradient": false
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_wheel.json b/src/themes/vue_ui_wheel.json
new file mode 100644
index 00000000..fea10136
--- /dev/null
+++ b/src/themes/vue_ui_wheel.json
@@ -0,0 +1,169 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "layout": {
+ "wheel": {
+ "ticks": {
+ "inactiveColor": "#4A4A4A"
+ }
+ },
+ "innerCircle": {
+ "stroke": "#3A3A3A"
+ }
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "layout": {
+ "wheel": {
+ "ticks": {
+ "inactiveColor": "#5D403760",
+ "activeColor": "#D32F2F",
+ "gradient": {
+ "shiftHueIntensity": 0
+ }
+ }
+ },
+ "innerCircle": {
+ "stroke": "#5D403760"
+ }
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ }
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "layout": {
+ "wheel": {
+ "ticks": {
+ "inactiveColor": "#5D403780",
+ "activeColor": "#D32F2F",
+ "gradient": {
+ "shiftHueIntensity": 0
+ }
+ }
+ },
+ "innerCircle": {
+ "stroke": "#5D403760"
+ }
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ }
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "layout": {
+ "wheel": {
+ "ticks": {
+ "rounded": false,
+ "inactiveColor": "#333333",
+ "activeColor": "#66CC66",
+ "gradient": {
+ "shiftHueIntensity": 15
+ }
+ }
+ },
+ "innerCircle": {
+ "show": false
+ }
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "layout": {
+ "wheel": {
+ "ticks": {
+ "inactiveColor": "#F7EDE2",
+ "activeColor": "#B1A7AD",
+ "gradient": {
+ "shiftHueIntensity": 100
+ }
+ }
+ },
+ "innerCircle": {
+ "show": false
+ }
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ }
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "layout": {
+ "wheel": {
+ "ticks": {
+ "rounded": false,
+ "inactiveColor": "#BBCBC7",
+ "activeColor": "#6C94A0",
+ "gradient": {
+ "shiftHueIntensity": 10
+ }
+ }
+ },
+ "innerCircle": {
+ "stroke": "#BBCBC7"
+ }
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_word_cloud.json b/src/themes/vue_ui_word_cloud.json
new file mode 100644
index 00000000..5bb61b3f
--- /dev/null
+++ b/src/themes/vue_ui_word_cloud.json
@@ -0,0 +1,191 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "words": {
+ "selectedStroke": "#1A1A1A"
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "words": {
+ "selectedStroke": "#FFF8E1"
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "words": {
+ "selectedStroke": "#1E1E1E"
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "words": {
+ "selectedStroke": "#1A1A1A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "words": {
+ "selectedStroke": "#fbfafa"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "words": {
+ "selectedStroke": "#f6f6fb"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_xy.json b/src/themes/vue_ui_xy.json
new file mode 100644
index 00000000..987178ca
--- /dev/null
+++ b/src/themes/vue_ui_xy.json
@@ -0,0 +1,493 @@
+{
+ "default": {},
+ "dark": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A",
+ "minimap": {
+ "selectedColor": "#8A8A8A",
+ "lineColor": "#424242",
+ "indicatorColor": "#CCCCCC"
+ }
+ },
+ "highlighter": {
+ "color": "#CCCCCC"
+ },
+ "timeTag": {
+ "backgroundColor": "#2A2A2A",
+ "color": "#CCCCCC",
+ "circleMarker": {
+ "color": "#2A2A2A"
+ }
+ },
+ "grid": {
+ "stroke": "#5A5A5A",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#CCCCCC",
+ "xAxisLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "legend": {
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ }
+ },
+ "bar": {
+ "border": {
+ "stroke": "#1A1A1A"
+ },
+ "labels": {
+ "color": "#CCCCCC"
+ },
+ "serieName": {
+ "color": "#CCCCCC"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65",
+ "minimap": {
+ "selectedColor": "#FF8A65",
+ "lineColor": "#424242",
+ "indicatorColor": "#FF8A65"
+ }
+ },
+ "highlighter": {
+ "color": "#424242"
+ },
+ "timeTag": {
+ "backgroundColor": "#424242",
+ "color": "#FFF8E1",
+ "circleMarker": {
+ "color": "#424242"
+ }
+ },
+ "grid": {
+ "stroke": "#5D4037",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#424242",
+ "xAxisLabels": {
+ "color": "#424242"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "bar": {
+ "borderRadius": 2,
+ "border": {
+ "stroke": "#FFF8E1"
+ },
+ "labels": {
+ "color": "#424242"
+ },
+ "serieName": {
+ "color": "#424242"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#424242"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65",
+ "minimap": {
+ "selectedColor": "#FF8A65",
+ "lineColor": "#FF6B6B",
+ "indicatorColor": "#FF8A65"
+ }
+ },
+ "highlighter": {
+ "color": "#FFF8E1"
+ },
+ "timeTag": {
+ "backgroundColor": "#5D4037",
+ "color": "#FFF8E1",
+ "circleMarker": {
+ "color": "#5D4037"
+ }
+ },
+ "grid": {
+ "stroke": "#5D4037",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#BDBDBD",
+ "xAxisLabels": {
+ "color": "#BDBDBD"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ }
+ },
+ "bar": {
+ "borderRadius": 2,
+ "border": {
+ "stroke": "#1E1E1E"
+ },
+ "labels": {
+ "color": "#BDBDBD"
+ },
+ "serieName": {
+ "color": "#BDBDBD"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "highlighter": {
+ "color": "#66CC66"
+ },
+ "timeTag": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#66CC66",
+ "circleMarker": {
+ "color": "#66CC66"
+ }
+ },
+ "grid": {
+ "stroke": "#5F6A5F",
+ "showVerticalLines": false,
+ "labels": {
+ "color": "#99AA99",
+ "xAxisLabels": {
+ "color": "#99AA99"
+ },
+ "xAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66"
+ }
+ },
+ "bar": {
+ "borderRadius": 0,
+ "border": {
+ "stroke": "#66CC66"
+ },
+ "labels": {
+ "color": "#AACCAA"
+ },
+ "serieName": {
+ "color": "#99CC99"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#AACCAA"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#AACCAA"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "highlighter": {
+ "color": "#8F837A"
+ },
+ "timeTag": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "circleMarker": {
+ "color": "#8A9892"
+ }
+ },
+ "grid": {
+ "stroke": "transparent",
+ "labels": {
+ "show": false,
+ "color": "#99AA99",
+ "xAxisLabels": {
+ "show": false,
+ "color": "#99AA99"
+ },
+ "zeroLine": {
+ "show": false
+ },
+ "yAxis": {
+ "showBaseline": false
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ }
+ },
+ "bar": {
+ "borderRadius": 4,
+ "border": {
+ "stroke": "#D7E0D2"
+ },
+ "labels": {
+ "color": "#8F837A"
+ },
+ "serieName": {
+ "color": "#858480"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#8F837A"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "highlighter": {
+ "color": "#7DA9B5"
+ },
+ "timeTag": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "circleMarker": {
+ "color": "#50606C"
+ }
+ },
+ "grid": {
+ "stroke": "#829C98",
+ "showVerticalLines": true,
+ "showHorizontalLines": true,
+ "labels": {
+ "color": "#50606C",
+ "xAxisLabels": {
+ "color": "#50606C"
+ }
+ }
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ },
+ "bar": {
+ "borderRadius": 2,
+ "border": {
+ "stroke": "#404C4D"
+ },
+ "labels": {
+ "color": "#50606C"
+ },
+ "serieName": {
+ "color": "#61747E"
+ }
+ },
+ "line": {
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "plot": {
+ "labels": {
+ "color": "#50606C"
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/themes/vue_ui_xy_canvas.json b/src/themes/vue_ui_xy_canvas.json
new file mode 100644
index 00000000..b2745835
--- /dev/null
+++ b/src/themes/vue_ui_xy_canvas.json
@@ -0,0 +1,404 @@
+{
+ "default": {},
+ "dark": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC",
+ "zoom": {
+ "color": "#4A4A4A",
+ "highlightColor": "#9A9A9A",
+ "minimap": {
+ "selectedColor": "#8A8A8A",
+ "lineColor": "#424242",
+ "indicatorColor": "#CCCCCC"
+ }
+ },
+ "selector": {
+ "color": "#CCCCCC"
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "title": {
+ "color": "#CCCCCC",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1A1A1A",
+ "backgroundOpacity": 70,
+ "color": "#CCCCCC",
+ "borderColor": "#5A5A5A"
+ },
+ "grid": {
+ "y": {
+ "axisColor": "#5A5A5A",
+ "axisLabels": {
+ "color": "#CCCCCC"
+ },
+ "verticalLines": {
+ "color": "#4A4A4A"
+ }
+ },
+ "x": {
+ "axisColor": "#5A5A5A",
+ "horizontalLines": {
+ "color": "#4A4A4A"
+ },
+ "timeLabels": {
+ "color": "#CCCCCC"
+ }
+ },
+ "zeroLine": {
+ "color": "#5A5A5A"
+ }
+ },
+ "dataLabels": {
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#CCCCCC"
+ }
+ }
+ },
+ "celebration": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "selector": {
+ "color": "#5D4037"
+ },
+ "legend": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "title": {
+ "color": "#424242",
+ "subtitle": {
+ "color": "#757575"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#FFECB3",
+ "backgroundOpacity": 30,
+ "color": "#424242",
+ "borderColor": "#FF8A65"
+ },
+ "grid": {
+ "y": {
+ "axisColor": "#5D4037",
+ "axisLabels": {
+ "color": "#424242"
+ },
+ "verticalLines": {
+ "show": false
+ }
+ },
+ "x": {
+ "axisColor": "#5D4037",
+ "horizontalLines": {
+ "color": "#9A9A9A"
+ },
+ "timeLabels": {
+ "color": "#424242"
+ }
+ },
+ "zeroLine": {
+ "color": "#424242"
+ }
+ },
+ "dataLabels": {
+ "color": "#424242"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ },
+ "td": {
+ "backgroundColor": "#FFF8E1",
+ "color": "#424242"
+ }
+ }
+ },
+ "celebrationNight": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD",
+ "zoom": {
+ "color": "#5D4037",
+ "highlightColor": "#FF8A65"
+ },
+ "selector": {
+ "color": "#BDBDBD"
+ },
+ "legend": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "title": {
+ "color": "#FFF8E1",
+ "subtitle": {
+ "color": "#BDBDBD"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#1E1E1E",
+ "backgroundOpacity": 30,
+ "color": "#FFF8E1",
+ "borderColor": "#FF8A65"
+ },
+ "grid": {
+ "y": {
+ "axisColor": "#5D4037",
+ "axisLabels": {
+ "color": "#BDBDBD"
+ },
+ "verticalLines": {
+ "show": false
+ }
+ },
+ "x": {
+ "axisColor": "#5D4037",
+ "horizontalLines": {
+ "color": "#3A3A3A"
+ },
+ "timeLabels": {
+ "color": "#BDBDBD"
+ }
+ },
+ "zeroLine": {
+ "color": "#5D4037"
+ }
+ },
+ "dataLabels": {
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ },
+ "td": {
+ "backgroundColor": "#1E1E1E",
+ "color": "#BDBDBD"
+ }
+ }
+ },
+ "hack": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99",
+ "zoom": {
+ "color": "#5F6A5F",
+ "highlightColor": "#66CC66"
+ },
+ "selector": {
+ "color": "#66CC66"
+ },
+ "legend": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#66CC66",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#2A2F2A",
+ "color": "#AACCAA",
+ "borderColor": "#66CC66",
+ "borderRadius": 0
+ },
+ "grid": {
+ "y": {
+ "axisColor": "#5F6A5F",
+ "axisLabels": {
+ "color": "#99AA99"
+ },
+ "verticalLines": {
+ "show": false
+ }
+ },
+ "x": {
+ "axisColor": "#5F6A5F",
+ "horizontalLines": {
+ "color": "#3A3A3A"
+ },
+ "timeLabels": {
+ "color": "#99AA99"
+ }
+ },
+ "zeroLine": {
+ "color": "#444444"
+ }
+ },
+ "dataLabels": {
+ "color": "#99AA99"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#99AA99"
+ },
+ "td": {
+ "backgroundColor": "#1A1A1A",
+ "color": "#AACCAA"
+ }
+ }
+ },
+ "zen": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892",
+ "zoom": {
+ "color": "#E0CFC3",
+ "highlightColor": "#8F837A"
+ },
+ "selector": {
+ "color": "#8F837A"
+ },
+ "legend": {
+ "backgroundColor": "#fbfafa",
+ "color": "#99AA99"
+ },
+ "title": {
+ "color": "#8A9892",
+ "subtitle": {
+ "color": "#99AA99"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8A9892"
+ },
+ "grid": {
+ "y": {
+ "axisColor": "#8F837A",
+ "axisLabels": {
+ "color": "#8F837A"
+ },
+ "verticalLines": {
+ "show": false
+ }
+ },
+ "x": {
+ "axisColor": "#8F837A",
+ "horizontalLines": {
+ "show": false,
+ "alternate": false
+ },
+ "timeLabels": {
+ "color": "#8F837A"
+ }
+ },
+ "zeroLine": {
+ "color": "#444444"
+ }
+ },
+ "dataLabels": {
+ "color": "#8F837A"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ },
+ "td": {
+ "backgroundColor": "#fbfafa",
+ "color": "#8F837A"
+ }
+ }
+ },
+ "concrete": {
+ "style": {
+ "chart": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C",
+ "zoom": {
+ "color": "#92B0AB",
+ "highlightColor": "#50606C"
+ },
+ "selector": {
+ "color": "#7DA9B5"
+ },
+ "legend": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#61747E"
+ },
+ "title": {
+ "color": "#50606C",
+ "subtitle": {
+ "color": "#718890"
+ }
+ },
+ "tooltip": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "grid": {
+ "y": {
+ "axisColor": "#829C98",
+ "axisLabels": {
+ "color": "#50606C"
+ },
+ "verticalLines": {
+ "show": false
+ }
+ },
+ "x": {
+ "axisColor": "#829C98",
+ "timeLabels": {
+ "color": "#50606C"
+ }
+ },
+ "zeroLine": {
+ "color": "#444444"
+ }
+ },
+ "dataLabels": {
+ "color": "#50606C"
+ }
+ }
+ },
+ "table": {
+ "th": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ },
+ "td": {
+ "backgroundColor": "#f6f6fb",
+ "color": "#50606C"
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/useConfig.js b/src/useConfig.js
index eb68257b..2d218647 100755
--- a/src/useConfig.js
+++ b/src/useConfig.js
@@ -261,6 +261,208 @@ export function useConfig() {
merged: false,
}
+ const vue_ui_stackline = {
+ loading: false,
+ debug: false,
+ theme: '',
+ responsive: false,
+ events: {
+ datapointEnter: null,
+ datapointLeave: null,
+ datapointClick: null,
+ },
+ customPalette: [],
+ useCssAnimation: false,
+ table: {
+ ...TABLE,
+ useDialog: false,
+ columnNames: {
+ period: 'Period',
+ total: 'Total'
+ },
+ th: TABLE_TH,
+ td: {
+ ...TABLE_TD,
+ roundingValue: 0
+ },
+ },
+ userOptions: USER_OPTIONS({
+ tooltip: true,
+ pdf: true,
+ csv: true,
+ img: true,
+ table: true,
+ labels: true,
+ fullscreen: true,
+ annotator: true,
+ svg: true
+ }),
+ style: {
+ fontFamily: 'inherit',
+ chart: {
+ backgroundColor: COLOR_WHITE,
+ color: COLOR_BLACK,
+ height: 500,
+ width: 800,
+ padding: PADDING([12, 12, 12, 12]),
+ title: TITLE,
+ legend: {
+ ...LEGEND,
+ position: 'bottom'
+ },
+ zoom: {
+ ...ZOOM,
+ minimap: MINIMAP_BASE,
+ preview: {
+ enable: true,
+ fill: '#CCCCCC50',
+ stroke: '#6A6A6A',
+ strokeWidth: 2,
+ strokeDasharray: 0,
+ },
+ useDefaultFormat: true,
+ timeFormat: 'yyyy-MM-dd HH:mm:ss', // When datetimeFormatter is enabled and useDefaultFormat is false
+ customFormat: null // overrides all if callback => string
+ },
+ highlighter: {
+ color: COLOR_BLACK,
+ opacity: 5,
+ useLine: false,
+ lineDasharray: 2,
+ lineWidth: 1
+ },
+ tooltip: {
+ ...TOOLTIP,
+ showValue: true,
+ showPercentage: true,
+ roundingValue: 0,
+ roundingPercentage: 0,
+ showTimeLabel: true,
+ showTotal: false,
+ totalTranslation: 'Total',
+ useDefaultTimeFormat: true,
+ timeFormat: 'yyyy-MM-dd HH:mm:ss' // When datetimeFormatter is enabled and useDefaultFormat is false
+ },
+ grid: {
+ scale: {
+ ticks: 10,
+ scaleMin: null, // Force min scale (defaults to dataset's min)
+ scaleMax: null, // Force max scale (defaults to dataset's max)
+ },
+ frame: {
+ show: false,
+ stroke: COLOR_GREY_LIGHT,
+ strokeWidth: 2,
+ strokeLinecap: 'round',
+ strokeLinejoin: 'round',
+ strokeDasharray: 0
+ },
+ x: {
+ showAxis: true,
+ showHorizontalLines: false,
+ axisColor: COLOR_GREY_LIGHT,
+ linesColor: COLOR_GREY_LIGHT,
+ linesThickness: 1,
+ linesStrokeDasharray: 0,
+ axisThickness: 2,
+ axisName: {
+ show: true,
+ text: '',
+ fontSize: FONT._14,
+ color: COLOR_BLACK,
+ bold: false,
+ offsetY: 0,
+ },
+ timeLabels: {
+ show: true,
+ values: [],
+ datetimeFormatter: AXIS_DATE_FORMATTER,
+ offsetY: 0,
+ rotation: 0,
+ autoRotate: {
+ enable: true,
+ angle: -30
+ },
+ fontSize: FONT._14,
+ color: COLOR_BLACK,
+ bold: false,
+ showOnlyFirstAndLast: false,
+ showOnlyAtModulo: false,
+ modulo: 12
+ }
+ },
+ y: {
+ showAxis: true,
+ showVerticalLines: false,
+ linesColor: COLOR_GREY_LIGHT,
+ linesThickness: 1,
+ linesStrokeDasharray: 0,
+ axisColor: COLOR_GREY_LIGHT,
+ axisThickness: 2,
+ axisName: {
+ show: true,
+ text: '',
+ fontSize: FONT._14,
+ color: COLOR_BLACK,
+ bold: false,
+ offsetX: 0,
+ },
+ axisLabels: {
+ formatter: null,
+ show: true,
+ color: COLOR_BLACK,
+ fontSize: FONT._14,
+ bold: false,
+ rounding: 0
+ }
+ },
+ },
+ lines: {
+ useArea: true,
+ smooth: false,
+ areaOpacity: 0.5,
+ distributed: false,
+ showDistributedPercentage: true,
+ strokeWidth: 1,
+ gradient: {
+ show: true,
+ intensity: 40
+ },
+ dot: {
+ hideAboveMaxSerieLength: 62,
+ useSerieColor: true,
+ fill: COLOR_WHITE,
+ strokeWidth: 0.5,
+ radius: 4,
+ },
+ totalValues: {
+ show: true,
+ offsetY: 0,
+ fontSize: FONT._16,
+ bold: true,
+ color: COLOR_BLACK
+ },
+ dataLabels: {
+ hideAboveMaxSerieLength: 62,
+ offsetY: 0,
+ show: true,
+ hideEmptyValues: true,
+ hideUnderValue: null,
+ hideEmptyPercentages: true,
+ hideUnderPercentage: null,
+ color: COLOR_BLACK,
+ fontSize: FONT._14,
+ bold: false,
+ rounding: 0,
+ prefix: '',
+ suffix: '',
+ formatter: null
+ }
+ },
+ }
+ }
+ }
+
const vue_ui_stackbar = {
loading: false, // v3
debug: false, // v3
@@ -332,6 +534,8 @@ export function useConfig() {
roundingValue: 0,
roundingPercentage: 0,
showTimeLabel: true,
+ showTotal: false,
+ totalTranslation: 'Total',
useDefaultTimeFormat: true,
timeFormat: 'yyyy-MM-dd HH:mm:ss' // When datetimeFormatter is enabled and useDefaultFormat is false
},
@@ -352,6 +556,7 @@ export function useConfig() {
totalValues: {
show: true,
offsetY: 0,
+ offsetX: 0,
fontSize: FONT._16,
bold: false,
color: COLOR_BLACK
@@ -378,6 +583,14 @@ export function useConfig() {
scaleMin: null, // Force min scale (defaults to dataset's min)
scaleMax: null, // Force max scale (defaults to dataset's max)
},
+ frame: {
+ show: false,
+ stroke: COLOR_GREY_LIGHT,
+ strokeWidth: 2,
+ strokeLinecap: 'round',
+ strokeLinejoin: 'round',
+ strokeDasharray: 0
+ },
x: {
showAxis: true,
showHorizontalLines: false,
@@ -1001,7 +1214,15 @@ export function useConfig() {
prefix: 'Value: ',
suffix: '',
rounding: 0,
- formatter: null
+ formatter: null,
+ name: {
+ show: true,
+ bold: true
+ },
+ value: {
+ show: true,
+ bold: false
+ }
}
},
legend: {
@@ -1869,7 +2090,7 @@ export function useConfig() {
const vue_ui_vertical_bar = { // v3 renamed to _horizontal_ (yet still works)
debug: false, // v3
loading: false, // v3
- autoSize: true, // v3
+ autoSize: true, // Legacy - removed
responsive: false,
theme: '',
customPalette: [],
@@ -1884,15 +2105,17 @@ export function useConfig() {
chart: {
backgroundColor: COLOR_WHITE,
color: COLOR_BLACK,
+ width: 512,
+ height: 316,
layout: {
bars: {
sort: SORT.DESC,
useStroke: false,
strokeWidth: 2,
- height: 32,
+ height: 32, // legacy - unused now
gap: 6,
borderRadius: 4,
- offsetX: 64,
+ offsetX: 12,
paddingRight: 0,
useGradient: true,
gradientIntensity: 20,
@@ -2436,7 +2659,7 @@ export function useConfig() {
open: "Open",
high: "High",
low: "Low",
- last: "Last",
+ last: "Close",
volume: "Volume"
},
userOptions: USER_OPTIONS({
@@ -2716,6 +2939,7 @@ export function useConfig() {
},
labels: {
value: {
+ show: true,
fontSize: FONT._14,
minFontSize: MIN_FONT_SIZE, // v3
color: COLOR_BLACK,
@@ -2727,6 +2951,7 @@ export function useConfig() {
formatter: null,
},
valueLabel: {
+ show: true,
fontSize: FONT._14,
minFontSize: MIN_FONT_SIZE, // v3
color: COLOR_BLACK,
@@ -2734,6 +2959,7 @@ export function useConfig() {
rounding: 0,
},
timeLabel: {
+ show: true,
fontSize: FONT._12,
minFontSize: MIN_FONT_SIZE, // v3
color: COLOR_BLACK,
@@ -4368,7 +4594,7 @@ export function useConfig() {
customPalette: [],
useCssAnimation: false, // v2 = true
animationDelayMs: 20,
- strictPixelPadding: false, // If true, strict per-pixel padding is used (dilateWordMask); if false, just rectangular bounding box (or pad).
+ strictPixelPadding: true, // If true, strict per-pixel padding is used (dilateWordMask); if false, just rectangular bounding box (or pad).
userOptions: USER_OPTIONS({
tooltip: true,
pdf: true,
@@ -4664,7 +4890,8 @@ export function useConfig() {
formatter: null
},
stroke: COLOR_WHITE,
- strokeWidth: 1
+ strokeWidth: 1,
+ borderRadius: 0,
},
links: {
// width: 200, // v3 deprecated
@@ -6100,6 +6327,7 @@ export function useConfig() {
const vue_ui_circle_pack = {
debug: false, // v3
loading: false, // v3
+ responsive: false,
events: { // v3
datapointEnter: null, // v3
datapointLeave: null, // v3
@@ -6108,7 +6336,7 @@ export function useConfig() {
theme: '',
customPalette: [],
userOptions: USER_OPTIONS({
- tooltip: false,
+ tooltip: true,
pdf: true,
csv: true,
img: true,
@@ -6135,9 +6363,12 @@ export function useConfig() {
backgroundColor: COLOR_WHITE,
color: COLOR_BLACK,
title: TITLE,
+ width: 512,
+ height: 316,
circles: {
stroke: COLOR_WHITE,
strokeWidth: 1,
+ selectedShadowColor: COLOR_BLACK,
gradient: {
show: true,
intensity: 40
@@ -6162,32 +6393,8 @@ export function useConfig() {
offsetY: 0
},
},
- zoom: {
- show: true,
- shadowForce: 1,
- opacity: 0.8,
- animationFrameMs: 200, // The higher the slower
- zoomRatio: 1,
- label: {
- name: {
- fontSize: FONT._14,
- bold: false,
- offsetY: 0,
- color: 'auto'
- },
- value: {
- fontSize: FONT._14,
- bold: false,
- offsetY: 0,
- rounding: 0,
- prefix: '',
- suffix: '',
- formatter: null,
- color: 'auto'
- }
- }
- }
- }
+ },
+ tooltip: TOOLTIP,
}
}
}
@@ -6590,6 +6797,7 @@ export function useConfig() {
vue_ui_world,
vue_ui_ridgeline,
vue_ui_chord,
+ vue_ui_stackline,
// non chart components
vue_ui_cursor,
vue_ui_accordion,
diff --git a/src/useThemeCheck.js b/src/useThemeCheck.js
new file mode 100644
index 00000000..7c5682e7
--- /dev/null
+++ b/src/useThemeCheck.js
@@ -0,0 +1,28 @@
+import { computed } from "vue";
+
+export function useThemeCheck() {
+ const isThemeValid = computed(() => {
+ return (config) => {
+ if (!config || !config.theme) return false;
+ return [
+ 'default',
+ 'dark',
+ 'celebration',
+ 'celebrationNight',
+ 'hack',
+ 'zen',
+ 'concrete'
+ ].includes(config.theme)
+ }
+ });
+
+ function warnInvalidTheme(config) {
+ if (!config?.debug) return;
+ console.warn(`Vue Data UI - "${config?.theme}" is not a valid theme.\n\nAvailable themes:\n\n- default (or "")\n- dark\n- celebration\n- celebrationNight \n- hack\n- zen\n- concrete`);
+ }
+
+ return {
+ isThemeValid,
+ warnInvalidTheme
+ }
+}
\ No newline at end of file
diff --git a/src/wordcloud.js b/src/wordcloud.js
index f8e36ccc..e7e88dd1 100644
--- a/src/wordcloud.js
+++ b/src/wordcloud.js
@@ -10,6 +10,8 @@
* - position words inside a given area using a spiral placement algorithm (the actual function of this file used in the component @generateWordCloud)
*/
+import { createUid } from "./lib";
+
function getTightBoundingBox(canvas, ctx) {
const { width, height } = canvas;
const img = ctx.getImageData(0, 0, width, height);
@@ -147,6 +149,7 @@ export function dilateWordMask({ wordMask, w, h, dilation }) {
}
/**
+ * LEGACY (blocks main thread, but we keep it for now in case we can make it faster some day)
* Attempts to position an array of words inside a given SVG region without overlap.
* Words are sorted by value and placed largest-first.
* @param {Object} params
@@ -204,7 +207,7 @@ export function positionWords({
});
if (strictPixelPadding) {
- wordMask = dilateWordMask({ wordMask, w, h, dilation: 1 });
+ wordMask = dilateWordMask({ wordMask, w, h, dilation: 2 });
}
let r = 0;
@@ -262,8 +265,259 @@ export function positionWords({
return positionedWords.sort((a, b) => b.fontSize - a.fontSize);
}
+/**
+ * Attempts to position an array of words inside a given SVG region without overlap.
+ * Words are sorted by value and placed largest-first.
+ * @param {Object} params
+ * @param {Array<{ name: string, value: number }>} params.words - List of word objects to place.
+ * @param {number} [params.proximity=0] - Padding between words (in pixels).
+ * @param {Object} params.svg - SVG config (must include width, height, minFontSize, maxFontSize, and optionally style).
+ * @param {Function} params.onProgress - Callback gradually returning positioned words
+ * @returns {Array<Object>} The positioned word objects, each with { x, y, fontSize, width, height, angle, ... }.
+ */
+export async function positionWordsAsync({
+ words,
+ proximity = 0,
+ svg,
+ strictPixelPadding,
+ onProgress
+}) {
+ function yieldAfterWord() {
+ return new Promise(resolve => setTimeout(resolve, 0));
+ }
+
+ const { width, height } = svg;
+ const maskW = Math.round(width);
+ const maskH = Math.round(height);
+ const minFontSize = 1;
+ const configMinFontSize = svg.minFontSize;
+ const maxFontSize = Math.min(svg.maxFontSize, 100);
+ const values = words.map(w => w.value);
+ const minValue = Math.min(...values);
+ const maxValue = Math.max(...values);
+ const mask = new Uint8Array(maskW * maskH);
+ const canvas = document.createElement('canvas');
+ const ctx = canvas.getContext('2d', { willReadFrequently: true });
+
+ canvas.width = maskW;
+ canvas.height = maskH;
+
+ const spiralStep = 6, spiralRadiusStep = 2;
+ const fallbackSpiralStep = 2, fallbackSpiralRadiusStep = 1;
+ const cx = Math.floor(maskW / 2), cy = Math.floor(maskH / 2);
+
+ const wordsWithId = words.map((w, index) => ({
+ ...w,
+ __wcIndex: index,
+ id: w.id != null ? w.id : `${w.name}__${index}`
+ }));
+
+ const sorted = [...wordsWithId].sort((a, b) => b.value - a.value);
+ const positionedWords = [];
+
+ for (const wordRaw of sorted) {
+ const beforeLen = positionedWords.length;
+
+ let targetFontSize = configMinFontSize;
+ if (maxValue !== minValue) {
+ targetFontSize =
+ (wordRaw.value - minValue) /
+ (maxValue - minValue) *
+ (maxFontSize - configMinFontSize) +
+ configMinFontSize;
+ }
+ targetFontSize = Math.max(
+ configMinFontSize,
+ Math.min(maxFontSize, targetFontSize)
+ );
+
+ let placed = false;
+ let fontSize = targetFontSize;
+
+ while (!placed && fontSize >= minFontSize) {
+ let {
+ w,
+ h,
+ wordMask,
+ minX,
+ minY,
+ maxX,
+ maxY
+ } = getWordBitmap({
+ word: wordRaw,
+ fontSize,
+ pad: proximity,
+ canvas,
+ ctx,
+ svg
+ });
+
+ if (strictPixelPadding) {
+ wordMask = dilateWordMask({ wordMask, w, h, dilation: 2 });
+ }
+
+ let r = 0;
+ let attempts = 0;
+
+ while (
+ r < Math.max(maskW, maskH) &&
+ !placed &&
+ attempts < 10000
+ ) {
+ for (let theta = 0; theta < 360; theta += spiralStep) {
+ attempts += 1;
+ const px = Math.round(
+ cx + r * Math.cos((theta * Math.PI) / 180) - w / 2
+ );
+ const py = Math.round(
+ cy + r * Math.sin((theta * Math.PI) / 180) - h / 2
+ );
+ if (
+ px < 0 ||
+ py < 0 ||
+ px + w > maskW ||
+ py + h > maskH
+ ) continue;
+ if (
+ canPlaceAt({
+ mask,
+ maskW,
+ maskH,
+ wx: px,
+ wy: py,
+ wordMask
+ })
+ ) {
+ const { __wcIndex, ...wordClean } = wordRaw;
+ positionedWords.push({
+ ...wordClean,
+ x: px - maskW / 2,
+ y: py - maskH / 2,
+ fontSize,
+ width: w,
+ height: h,
+ angle: 0,
+ minX,
+ minY,
+ maxX,
+ maxY
+ });
+ markMask({
+ mask,
+ maskW,
+ maskH,
+ wx: px,
+ wy: py,
+ wordMask
+ });
+ placed = true;
+ break;
+ }
+ }
+ r += spiralRadiusStep;
+ }
+ if (!placed) fontSize -= 1;
+ }
+
+ if (!placed && fontSize < minFontSize) {
+ fontSize = minFontSize;
+ const {
+ w,
+ h,
+ wordMask,
+ minX,
+ minY,
+ maxX,
+ maxY
+ } = getWordBitmap({
+ word: wordRaw,
+ fontSize,
+ pad: proximity,
+ canvas,
+ ctx,
+ svg
+ });
+
+ let r = 0;
+ let attempts = 0;
+
+ while (
+ r < Math.max(maskW, maskH) &&
+ !placed &&
+ attempts < 25000
+ ) {
+ for (
+ let theta = 0;
+ theta < 360;
+ theta += fallbackSpiralStep
+ ) {
+ attempts += 1;
+ const px = Math.round(
+ cx + r * Math.cos((theta * Math.PI) / 180) - w / 2
+ );
+ const py = Math.round(
+ cy + r * Math.sin((theta * Math.PI) / 180) - h / 2
+ );
+ if (
+ px < 0 ||
+ py < 0 ||
+ px + w > maskW ||
+ py + h > maskH
+ ) continue;
+ if (
+ canPlaceAt({
+ mask,
+ maskW,
+ maskH,
+ wx: px,
+ wy: py,
+ wordMask
+ })
+ ) {
+ const { __wcIndex, ...wordClean } = wordRaw;
+ positionedWords.push({
+ ...wordClean,
+ x: px - maskW / 2,
+ y: py - maskH / 2,
+ fontSize,
+ width: w,
+ height: h,
+ angle: 0,
+ minX,
+ minY,
+ maxX,
+ maxY
+ });
+ markMask({
+ mask,
+ maskW,
+ maskH,
+ wx: px,
+ wy: py,
+ wordMask
+ });
+ placed = true;
+ break;
+ }
+ }
+ r += fallbackSpiralRadiusStep;
+ }
+ }
+
+ if (onProgress && positionedWords.length > beforeLen) {
+ const last = positionedWords[positionedWords.length - 1];
+ onProgress({ word: last, all: positionedWords });
+ }
+
+ await yieldAfterWord();
+ }
+
+ return positionedWords.sort((a, b) => b.fontSize - a.fontSize);
+}
+
const wordcloud = {
positionWords,
+ positionWordsAsync,
getWordBitmap,
canPlaceAt,
markMask,
diff --git a/tests/getThemeConfig.test.js b/tests/getThemeConfig.test.js
index 8495169c..74e1a727 100644
--- a/tests/getThemeConfig.test.js
+++ b/tests/getThemeConfig.test.js
@@ -1,62 +1,60 @@
-import { expect, test, describe } from "vitest";
-import sut from '../src/themes.json'
-import getThemeConfig from "../src/getThemeConfig";
-
-const components = [
- '3d_bar',
- 'age_pyramid',
- 'candlestick',
- 'chestnut',
- 'donut',
- 'donut_evolution',
- 'dumbbell',
- 'galaxy',
- 'gauge',
- 'heatmap',
- 'molecule',
- 'mood_radar',
- 'nested_donuts',
- 'onion',
- 'parallel_coordinate_plot',
- 'quadrant',
- 'quick_chart',
- 'radar',
- 'relation_circle',
- 'rings',
- 'scatter',
- 'spark_trend',
- 'sparkbar',
- 'sparkgauge',
- 'sparkhistogram',
- 'sparkline',
- 'sparkstackbar',
- 'strip_plot',
- 'table_heatmap',
- 'table_sparkline',
- 'thermometer',
- 'tiremarks',
- 'treemap',
- 'vertical_bar',
- 'waffle',
- 'wheel',
- 'xy',
- 'xy_canvas'
-]
-
-const themes = [
- "default",
- "zen",
- "hack",
- "concrete"
-]
+import { describe, test, expect, vi, beforeEach } from 'vitest';
+import { preloadTheme, getThemeConfigSync, __testing } from '../src/getThemeConfig';
describe('getThemeConfig', () => {
- components.forEach(component => {
- themes.forEach(theme => {
- test(`returns vue_ui_${component} ${theme} theme`, () => {
- expect(getThemeConfig(`vue_ui_${component}`)[theme]).not.toBeUndefined()
- expect(getThemeConfig(`vue_ui_${component}`)[theme]).toStrictEqual(sut[`vue_ui_${component}`][theme])
- })
- })
- })
-})
\ No newline at end of file
+ let calls;
+ let loader;
+
+ beforeEach(() => {
+ __testing.clearCache();
+ calls = 0;
+
+ // Fake loader so tests don't touch the real filesystem
+ loader = vi.fn(async (type) => {
+ calls += 1;
+ if (type === 'vue_ui_chord') {
+ return { debug: true };
+ }
+ const err = new Error('ENOENT');
+ err.code = 'ENOENT';
+ throw err;
+ });
+
+ __testing.setLoader(loader);
+ });
+
+ test('returns theme object when JSON file exists (after preload)', async () => {
+ await preloadTheme('vue_ui_chord'); // loads once
+ const theme = getThemeConfigSync('vue_ui_chord'); // sync read
+ expect(theme).toEqual({ debug: true });
+ expect(calls).toBe(1);
+ });
+
+ test('returns null when theme file does not exist', async () => {
+ const warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => { });
+ const res = await preloadTheme('non_existing_theme');
+ expect(res).toBeNull();
+ expect(warnSpy).toHaveBeenCalled();
+ expect(calls).toBe(1);
+ const theme = getThemeConfigSync('non_existing_theme');
+ expect(theme).toBeNull();
+ warnSpy.mockRestore();
+ });
+
+ test('uses cached theme on second call (module loaded once)', async () => {
+ await preloadTheme('vue_ui_chord'); // first (and only) load
+ const first = getThemeConfigSync('vue_ui_chord'); // from cache
+ const second = getThemeConfigSync('vue_ui_chord'); // from cache
+ expect(second).toBe(first); // same ref
+ expect(calls).toBe(1); // loader once
+ expect(__testing.cacheSize()).toBe(1);
+ });
+
+ test('returns null when called with undefined or empty type', () => {
+ const a = getThemeConfigSync();
+ const b = getThemeConfigSync('');
+ expect(a).toBeNull();
+ expect(b).toBeNull();
+ expect(calls).toBe(0);
+ });
+});
diff --git a/tests/lib.test.js b/tests/lib.test.js
index 14686dea..faff1582 100644
--- a/tests/lib.test.js
+++ b/tests/lib.test.js
@@ -51,10 +51,11 @@ import {
dataLabel,
degreesToRadians,
error,
+ escapeXml,
+ escapeXmlAttr,
forceValidValue,
formatSmallValue,
functionReturnsString,
- generateSpiralCoordinates,
getAreaSegments,
getCloserPoint,
getCumulativeAverage,
@@ -269,13 +270,18 @@ describe("treeShake", () => {
bool0: false
},
},
- key4: {}
+ key4: {},
+ key5: [],
+ key6: ['A', null, 1],
+ key7: null
};
const userConfig0 = {};
const userConfig1 = {
key1: "",
+ key6: ['B', true],
+ key7: true
};
const userConfig2 = {
@@ -296,23 +302,7 @@ describe("treeShake", () => {
}
};
- expect(treeShake({ defaultConfig, userConfig: userConfig0 })).toStrictEqual(
- {
- key1: "val1",
- key2: {
- subkey: "subkey",
- },
- key3: {
- subkey: {
- subsubkey: "subsubkey",
- withNull: null,
- bool1: true,
- bool0: false
- },
- },
- key4: {}
- }
- );
+ expect(treeShake({ defaultConfig, userConfig: userConfig0 })).toStrictEqual(defaultConfig);
expect(treeShake({ defaultConfig, userConfig: userConfig1 })).toStrictEqual(
{
@@ -328,7 +318,10 @@ describe("treeShake", () => {
bool0: false
},
},
- key4: {}
+ key4: {},
+ key5: [],
+ key6: ['B', true],
+ key7: true
}
);
@@ -346,7 +339,10 @@ describe("treeShake", () => {
bool0: false
},
},
- key4: {}
+ key4: {},
+ key5: [],
+ key6: ['A', null, 1],
+ key7: null
}
);
@@ -366,7 +362,10 @@ describe("treeShake", () => {
},
key4: {
A: '1',
- }
+ },
+ key5: [],
+ key6: ['A', null, 1],
+ key7: null
}
);
});
@@ -4207,4 +4206,51 @@ describe('buildInterLineAreas', () => {
expect(areas.length).toBeGreaterThan(0);
expect(allClosed(areas)).toBe(true);
});
+});
+
+describe('escapeXml', () => {
+ test('handles empty string', () => {
+ expect(escapeXml('')).toBe('');
+ });
+ test('escapes &, <, >', () => {
+ expect(escapeXml('&<>')).toBe('&<>');
+ });
+ test('does not escape double quotes', () => {
+ expect(escapeXml('"')).toBe('"');
+ expect(escapeXml('some "attr" & <tag>')).toBe('some "attr" & <tag>');
+ });
+ test('leaves safe characters unchanged', () => {
+ expect(escapeXml('abc 123_-.:,')).toBe('abc 123_-.:,');
+ });
+ test('coerces non-strings via String()', () => {
+ expect(escapeXml(42)).toBe('42');
+ expect(escapeXml(null)).toBe('null');
+ expect(escapeXml(undefined)).toBe('undefined');
+ });
+ test('already-escaped entities get "&" re-escaped', () => {
+ expect(escapeXml('< > &')).toBe('< > &');
+ });
+});
+
+describe('escapeXmlAttr', () => {
+ test('handles empty string', () => {
+ expect(escapeXmlAttr('')).toBe('');
+ });
+ test('escapes &, ", <, >', () => {
+ expect(escapeXmlAttr('&"<>')).toBe('&"<>');
+ expect(escapeXmlAttr('a & b "quote" <x>')).toBe('a & b "quote" <x>');
+ });
+ test('does not escape single quote/apostrophe', () => {
+ expect(escapeXmlAttr("abc'd efg")).toBe("abc'd efg");
+ });
+ test('leaves safe characters unchanged', () => {
+ expect(escapeXmlAttr('abc 123_-.:,')).toBe('abc 123_-.:,');
+ });
+ test('coerces to string', () => {
+ expect(escapeXmlAttr(0)).toBe('0');
+ expect(escapeXmlAttr(false)).toBe('false');
+ });
+ test('already-escaped entities get "&" re-escaped', () => {
+ expect(escapeXmlAttr('< > " &')).toBe('< > " &');
+ });
});
\ No newline at end of file
diff --git a/tests/wordcloud.test.js b/tests/wordcloud.test.js
index 15b03b13..bee4aebb 100644
--- a/tests/wordcloud.test.js
+++ b/tests/wordcloud.test.js
@@ -5,6 +5,7 @@ import {
markMask,
dilateWordMask,
positionWords,
+ positionWordsAsync
} from "../src/wordcloud"
function createMockContext2D() {
@@ -327,3 +328,48 @@ describe("positionWords", () => {
expect(result[1].fontSize).toBe(svg.minFontSize);
});
});
+
+describe("positionWordsAsync", () => {
+ test("places words asynchronously and calls onProgress", async () => {
+ const words = [
+ { name: "one", value: 10 },
+ { name: "two", value: 5 },
+ ];
+
+ const svg = {
+ width: 100,
+ height: 100,
+ minFontSize: 10,
+ maxFontSize: 20,
+ style: {},
+ };
+
+ const onProgress = vi.fn();
+
+ const result = await positionWordsAsync({
+ words,
+ svg,
+ onProgress,
+ });
+
+ expect(result.length).toBe(words.length);
+
+ for (const w of result) {
+ expect(typeof w.x).toBe("number");
+ expect(typeof w.y).toBe("number");
+ expect(typeof w.fontSize).toBe("number");
+ expect(w.fontSize).toBeGreaterThanOrEqual(svg.minFontSize);
+ expect(w.fontSize).toBeLessThanOrEqual(svg.maxFontSize);
+ expect(w.width).toBeGreaterThan(0);
+ expect(w.height).toBeGreaterThan(0);
+ }
+
+ expect(onProgress).toHaveBeenCalled();
+ expect(onProgress.mock.calls.length).toBeLessThanOrEqual(words.length);
+
+ const [firstCallArg] = onProgress.mock.calls[0];
+ expect(firstCallArg).toHaveProperty("word");
+ expect(firstCallArg).toHaveProperty("all");
+ expect(Array.isArray(firstCallArg.all)).toBe(true);
+ });
+});
diff --git a/types/vue-data-ui.d.ts b/types/vue-data-ui.d.ts
index 448d46fd..8c87be0d 100644
--- a/types/vue-data-ui.d.ts
+++ b/types/vue-data-ui.d.ts
@@ -65,7 +65,8 @@ declare module "vue-data-ui" {
| VueUiCirclePackDatasetItem[]
| VueUiWorldDataset
| VueUiRidgelineDatasetItem[]
- | VueUiChordDataset;
+ | VueUiChordDataset
+ | VueUiStacklineDatasetItem[];
export type VueDataUiAnyConfig =
| VueUi3dBarConfig
@@ -127,7 +128,8 @@ declare module "vue-data-ui" {
| VueUiCirclePackConfig
| VueUiWorldConfig
| VueUiRidgelineConfig
- | VueUiChordConfig;
+ | VueUiChordConfig
+ | VueUiStacklineConfig;
export type VueDataUiProps = {
loader?: VueDataUiLoader | null;
@@ -271,6 +273,15 @@ declare module "vue-data-ui" {
bold?: boolean;
};
+ export type ChartFrame = {
+ show?: boolean;
+ stroke?: string;
+ strokeWidth?: number;
+ strokeLinecap?: "round" | "butt" | "square";
+ strokeLinejoin?: "arcs" | "bevel" | "miter" | "miter-clip" | "round";
+ strokeDasharray?: number;
+ }
+
export type ChartUserOptions = {
show?: boolean;
showOnChartHover?: boolean;
@@ -382,6 +393,7 @@ declare module "vue-data-ui" {
export type Theme =
| ""
| "zen"
+ | "dark"
| "hack"
| "concrete"
| "celebration"
@@ -512,6 +524,14 @@ declare module "vue-data-ui" {
suffix?: string;
rounding?: number;
formatter?: Formatter;
+ name?: {
+ show?: boolean;
+ bold?: boolean;
+ };
+ value?: {
+ show?: boolean;
+ bold?: boolean;
+ }
};
};
legend?: ChartBaseLegend & {
@@ -588,6 +608,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleAnnotator(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiTreemap: DefineComponent<
@@ -755,6 +777,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleAnnotator(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiGalaxy: DefineComponent<
@@ -1483,7 +1507,8 @@ declare module "vue-data-ui" {
| "bringToBack"
| "printer"
| "save"
- | "svg";
+ | "svg"
+ | "chartStackline";
export const VueUiIcon: DefineComponent<{
name: VueUiIconName;
@@ -1660,6 +1685,8 @@ declare module "vue-data-ui" {
toggleAnnotator(): void
toggleTable(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiDonutEvolution: DefineComponent<
@@ -1935,6 +1962,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleAnnotator(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiRings: DefineComponent<
@@ -1989,6 +2018,7 @@ declare module "vue-data-ui" {
};
labels?: {
value?: {
+ show?: boolean;
fontSize?: number;
minFontSize?: number; // v3
color?: string;
@@ -2000,6 +2030,7 @@ declare module "vue-data-ui" {
formatter?: Formatter;
};
valueLabel?: {
+ show?: boolean;
fontSize?: number;
minFontSize?: number; // v3
color?: string;
@@ -2007,6 +2038,7 @@ declare module "vue-data-ui" {
rounding?: number;
};
timeLabel?: {
+ show?: boolean;
fontSize?: number;
minFontSize?: number; // v3
color?: string;
@@ -2160,10 +2192,18 @@ declare module "vue-data-ui" {
width?: number;
};
- export const VueUiSparkStackbar: DefineComponent<{
- config?: VueUiSparkStackbarConfig;
- dataset: VueUiSparkStackbarDatasetItem[];
- }>;
+ export type VueUiSparkStackbarExpose = {
+ showSeries(name: string): void
+ hideSeries(name: string): void
+ }
+
+ export const VueUiSparkStackbar: DefineComponent<
+ {
+ config?: VueUiSparkStackbarConfig;
+ dataset: VueUiSparkStackbarDatasetItem[];
+ },
+ VueUiSparkStackbarExpose
+ >;
export type VueUiThermometerConfig = {
debug?: boolean; // v3
@@ -2926,6 +2966,7 @@ declare module "vue-data-ui" {
>;
export type VueUiScatterDatasetValueItem = {
+ [key: string]: any;
name: string;
x: number;
y: number;
@@ -2934,6 +2975,7 @@ declare module "vue-data-ui" {
};
export type VueUiScatterDatasetItem = {
+ [key: string]: any;
name: string;
values: VueUiScatterDatasetValueItem[];
color?: string;
@@ -3118,12 +3160,14 @@ declare module "vue-data-ui" {
};
export type VueUiScatterDatapoint = {
+ [key: string]: any;
clusterName: string | undefined;
color: string;
deviation: number;
id: string;
shape: Shape | null;
v: {
+ [key: string]: any;
x: number;
y: number;
name: string;
@@ -3161,6 +3205,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleAnnotator(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiScatter: DefineComponent<
@@ -3466,14 +3512,7 @@ declare module "vue-data-ui" {
showHorizontalLines?: boolean;
showVerticalLines?: boolean;
position?: "middle" | "start";
- frame?: {
- show?: boolean;
- stroke?: string;
- strokeWidth?: number;
- strokeLinecap?: "round" | "butt" | "square";
- strokeLinejoin?: "arcs" | "bevel" | "miter" | "miter-clip" | "round";
- strokeDasharray?: number;
- };
+ frame?: ChartFrame;
labels?: {
color?: string;
show?: boolean;
@@ -3688,6 +3727,7 @@ declare module "vue-data-ui" {
};
export type VueUiXyDatasetItem = {
+ [key: string]: any; // which can be recovered through the #svg slot
name: string;
series: Array<number | null>;
type: "bar" | "line" | "plot";
@@ -3776,6 +3816,8 @@ declare module "vue-data-ui" {
toggleStack(): void
toggleTable(): void
toggleTooltip(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiXy: DefineComponent<
@@ -3892,6 +3934,7 @@ declare module "vue-data-ui" {
};
};
donut?: {
+ radiusRatio?: number;
borderWidth?: number;
strokeWidth?: number;
useShadow?: boolean;
@@ -3998,6 +4041,8 @@ declare module "vue-data-ui" {
toggleTable(): void
toggleTooltip(): void
autoSize(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiDonut: DefineComponent<
@@ -4207,6 +4252,8 @@ declare module "vue-data-ui" {
toggleTable(): void
toggleTooltip(): void
autoSize(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiNestedDonuts: DefineComponent<
@@ -4358,6 +4405,8 @@ declare module "vue-data-ui" {
toggleFullscreen(): void
toggleTable(): void
toggleTooltip(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiWaffle: DefineComponent<
@@ -4527,6 +4576,8 @@ declare module "vue-data-ui" {
toggleAnnotator(): void
toggleTooltip(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiRadar: DefineComponent<
@@ -4730,6 +4781,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleAnnotator(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiQuadrant: DefineComponent<
@@ -5238,6 +5291,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleTable(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiOnion: DefineComponent<
@@ -5271,7 +5326,7 @@ declare module "vue-data-ui" {
export type VueUiVerticalBarConfig = {
debug?: boolean;
loading?: boolean;
- autoSize?: boolean;
+ autoSize?: boolean; // Legacy - unused
responsive?: boolean;
theme?: Theme;
customPalette?: string[];
@@ -5286,12 +5341,14 @@ declare module "vue-data-ui" {
chart?: {
backgroundColor?: string;
color?: string;
+ width?: number;
+ height?: number;
layout?: {
bars?: {
sort?: "desc" | "asc" | "none";
useStroke?: boolean;
strokeWidth?: number;
- height?: number;
+ height?: number; // Legacy - unused
gap?: number;
borderRadius?: number;
offsetX?: number;
@@ -5439,6 +5496,9 @@ declare module "vue-data-ui" {
toggleAnnotator(): void
toggleTooltip(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
+ autoSize(): void // Legacy - unused, just logs a warning
}
export type VueUiHorizontalBarExpose = VueUiVerticalBarExpose; // v3 renaming
@@ -7223,6 +7283,8 @@ declare module "vue-data-ui" {
toggleStack(): void
toggleTooltip(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiXyCanvas: DefineComponent<
@@ -7334,6 +7396,7 @@ declare module "vue-data-ui" {
};
stroke?: string;
strokeWidth?: number;
+ borderRadius?: number;
};
links?: {
// width?: number; // v3 deprecated
@@ -7588,6 +7651,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleAnnotator(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiParallelCoordinatePlot: DefineComponent<
@@ -7789,6 +7854,7 @@ declare module "vue-data-ui" {
}>;
export type VueUiStackbarDatasetItem = {
+ [key: string]: any; // To be recovered through the #svg slot
name: string;
series: Array<number | null>;
color?: string;
@@ -7882,6 +7948,8 @@ declare module "vue-data-ui" {
showTimeLabel?: boolean;
useDefaultTimeFormat?: boolean;
timeFormat?: string;
+ showTotal?: boolean;
+ totalTranslation?: string;
};
highlighter?: {
color?: string;
@@ -7900,6 +7968,7 @@ declare module "vue-data-ui" {
totalValues?: {
show?: boolean;
offsetY?: number;
+ offsetX?: number;
fontSize?: number;
bold?: boolean;
color?: string;
@@ -7921,6 +7990,7 @@ declare module "vue-data-ui" {
};
};
grid?: {
+ frame?: ChartFrame;
scale?: {
ticks?: number;
scaleMin?: number | null;
@@ -8015,6 +8085,8 @@ declare module "vue-data-ui" {
toggleLabels(): void
toggleTooltip(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiStackbar: DefineComponent<
@@ -8026,6 +8098,250 @@ declare module "vue-data-ui" {
VueUiStackbarExpose
>;
+ export type VueUiStacklineDatapointItem = VueUiStackbarDatapointItem & {
+ shape: Shape;
+ standalone: boolean;
+ };
+
+ export type VueUiStacklineSeriesItem = VueUiStackbarSeriesItem & {
+ shape: Shape;
+ standalone: boolean;
+ };
+
+ export type VueUiStacklineDatasetItem = VueUiStackbarDatasetItem & {
+ shape?: Shape;
+ standalone?: boolean; // If true, series will not be part of stacked series
+ }
+
+ export type VueUiStacklineConfig = {
+ loading?: boolean;
+ debug?: boolean;
+ theme?: Theme;
+ responsive?: boolean;
+ events?: {
+ datapointEnter?: VueUiStacklineEvent;
+ datapointLeave?: VueUiStacklineEvent;
+ datapointClick?: VueUiStacklineEvent;
+ };
+ customPalette?: string[];
+ useCssAnimation?: boolean;
+ table?: {
+ show?: boolean;
+ useDialog?: boolean;
+ responsiveBreakpoint?: number;
+ columnNames?: {
+ period?: string;
+ total?: string;
+ };
+ th: ChartTableCell;
+ td: ChartTableCell & {
+ roundingValue?: number;
+ };
+ };
+ userOptions?: ChartUserOptions;
+ style?: {
+ fontFamily?: string;
+ chart?: {
+ backgroundColor?: string;
+ color?: string;
+ height?: number;
+ width?: number;
+ padding?: ChartPadding;
+ title?: ChartTitle;
+ legend?: ChartBaseLegend & {
+ backgroundColor?: string;
+ position?: 'top' | 'bottom';
+ };
+ zoom?: ChartZoom & {
+ preview?: {
+ enable?: boolean;
+ fill?: string;
+ stroke?: string;
+ strokeWidth?: number;
+ strokeDasharray?: number;
+ };
+ useDefaultFormat?: boolean;
+ timeFormat?: string;
+ customFormat?:
+ | null
+ | ((params: MinimalCustomFormatParams<Array<VueUiStacklineDatapointItem & { absoluteIndex: number }>>) => string);
+ };
+ highlighter?: {
+ color?: string;
+ opacity?: number;
+ useLine?: boolean;
+ lineDasharray?: number;
+ lineWidth?: number;
+ };
+ tooltip?: ChartTooltip & {
+ showValue?: boolean;
+ showPercentage?: boolean;
+ roundingValue?: number;
+ roundingPercentage?: number;
+ customFormat?:
+ | null
+ | ((
+ params: VueUiTooltipParams<
+ VueUiStacklineDatapointItem[],
+ VueUiStacklineSeriesItem[],
+ VueUiStacklineConfig
+ >
+ ) => string);
+ showTimeLabel?: boolean;
+ useDefaultTimeFormat?: boolean;
+ timeFormat?: string;
+ showTotal?: boolean;
+ totalTranslation?: string;
+ };
+ lines?: {
+ useArea?: boolean; // Only applied on stacked series (!standalone)
+ smooth?: boolean;
+ areaOpacity?: number;
+ distributed?: boolean;
+ showDistributedPercentage?: boolean;
+ strokeWidth?: number;
+ gradient?: {
+ show?: boolean;
+ intensity?: number;
+ };
+ dot?: {
+ hideAboveMaxSerieLength?: number;
+ useSerieColor?: boolean;
+ fill?: string;
+ strokeWidth?: number;
+ radius?: number;
+ };
+ totalValues?: {
+ show?: boolean;
+ offsetY?: number;
+ fontSize?: number;
+ bold?: boolean;
+ color?: string;
+ };
+ dataLabels?: {
+ hideAboveMaxSerieLength?: number;
+ offsetY?: number;
+ show?: boolean;
+ hideEmptyValues?: boolean;
+ hideUnderValue?: number | null;
+ hideEmptyPercentages?: boolean;
+ hideUnderPercentage?: number | null;
+ color?: string;
+ fontSize?: number;
+ bold?: boolean;
+ rounding?: number;
+ prefix?: string;
+ formatter?: Formatter;
+ }
+ };
+ grid?: {
+ frame?: ChartFrame;
+ scale?: {
+ ticks?: number;
+ scaleMin?: number | null;
+ scaleMax?: number | null;
+ };
+ x?: {
+ showAxis?: boolean;
+ showHorizontalLines?: boolean;
+ linesColor?: string;
+ linesThickness?: number;
+ linesStrokeDasharray?: number;
+ axisColor?: string;
+ axisThickness?: number;
+ axisName?: {
+ show?: boolean;
+ text?: string;
+ fontSize?: number;
+ color?: string;
+ bold?: boolean;
+ offsetY?: number;
+ };
+ timeLabels?: {
+ show?: boolean;
+ values?: Array<number | string>;
+ datetimeFormatter?: AxisDateFormatter;
+ offsetY?: number;
+ rotation?: number;
+ autoRotate?: {
+ enable?: boolean;
+ angle?: number;
+ };
+ fontSize?: number;
+ color?: string;
+ bold?: boolean;
+ showOnlyFirstAndLast?: boolean;
+ showOnlyAtModulo?: boolean;
+ modulo?: number;
+ };
+ };
+ y?: {
+ showAxis?: boolean;
+ showVerticalLines?: boolean;
+ linesColor?: string;
+ linesThickness?: number;
+ linesStrokeDasharray?: number;
+ axisColor?: string;
+ axisThickness?: number;
+ axisName?: {
+ show?: boolean;
+ text?: string;
+ fontSize?: number;
+ color?: string;
+ bold?: boolean;
+ offsetX?: number;
+ };
+ axisLabels?: {
+ formatter?: Formatter;
+ show?: boolean;
+ color?: string;
+ fontSize?: number;
+ bold?: boolean;
+ rounding?: number;
+ };
+ };
+ };
+ }
+ }
+ }
+
+ export type VueUiStacklineExpose = {
+ getData(): Promise<Array<{
+ absoluteIndex: number
+ color: string
+ height: number[],
+ horizontal_width: number[],
+ horizontal_x: number[],
+ horizontal_y: number[],
+ id: string
+ name: string
+ proportions: number[],
+ series: number[],
+ signedSeries: number[],
+ x: number[],
+ y: number[],
+ standalone?: boolean
+ }>>
+ getImage(options?: { scale?: number }): GetImagePromise
+ generateCsv(): void
+ generateImage(): void
+ generatePdf(): void
+ toggleAnnotator(): void
+ toggleTable(): void
+ toggleLabels(): void
+ toggleTooltip(): void
+ toggleFullscreen(): void
+ }
+
+ export const VueUiStackline: DefineComponent<
+ {
+ config?: VueUiStacklineConfig;
+ dataset: VueUiStacklineDatasetItem[];
+ selectedXIndex?: number | null;
+ },
+ VueUiStacklineExpose
+ >;
+
export type VueUiBulletSegment = {
name: string;
from: number;
@@ -8474,6 +8790,8 @@ declare module "vue-data-ui" {
toggleTooltip(): void
toggleTable(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiHistoryPlot: DefineComponent<
@@ -8502,6 +8820,7 @@ declare module "vue-data-ui" {
export type VueUiCirclePackConfig = {
debug?: boolean; // v3
+ responsive?: boolean;
loading?: boolean; // v3
events?: { // v3
datapointEnter?: VueUiCirclePackEvent; // v3
@@ -8525,12 +8844,15 @@ declare module "vue-data-ui" {
style?: {
fontFamily?: string;
chart?: {
+ width?: number;
+ height?: number;
backgroundColor?: string;
color?: string;
title?: ChartTitle;
circles?: {
stroke?: string;
strokeWidth?: number;
+ selectedShadowColor?: string;
gradient?: {
show?: boolean;
intensity?: number;
@@ -8555,32 +8877,18 @@ declare module "vue-data-ui" {
fontSizeRatio?: number;
};
};
- zoom?: {
- show?: boolean;
- shadowForce?: number;
- opacity?: number;
- animationFrameMs?: number;
- zoomRatio?: number;
- label?: {
- name?: {
- fontSize?: number;
- bold?: boolean;
- offsetY?: number;
- color?: string;
- };
- value?: {
- fontSize?: number;
- bold?: boolean;
- offsetY?: number;
- rounding?: number;
- prefix?: string;
- suffix?: string;
- formatter?: Formatter;
- color?: string;
- };
- };
- };
};
+ tooltip?: ChartTooltip & {
+ customFormat?:
+ | null
+ | ((
+ params: VueUiTooltipParams<
+ VueUiCirclePackDatapoint,
+ VueUiCirclePackDatapoint[],
+ VueUiCirclePackConfig
+ >
+ ) => string);
+ }
};
};
};
@@ -8920,6 +9228,8 @@ declare module "vue-data-ui" {
toggleAnnotator(): void
toggleTable(): void
toggleFullscreen(): void
+ showSeries(name: string): void
+ hideSeries(name: string): void
}
export const VueUiRidgeline: DefineComponent<
@@ -9144,7 +9454,8 @@ declare module "vue-data-ui" {
| VueUiCirclePackConfig
| VueUiWorldConfig
| VueUiRidgelineConfig
- | VueUiChordConfig;
+ | VueUiChordConfig
+ | VueUiStacklineConfig;
export type VueDataUiConfigKey =
| "vue_ui_3d_bar"
@@ -9208,7 +9519,8 @@ declare module "vue-data-ui" {
| "vue_ui_circle_pack"
| "vue_ui_world"
| "vue_ui_ridgeline"
- | "vue_ui_chord";
+ | "vue_ui_chord"
+ | "vue_ui_stackline";
export type VueDataUiWordCloudTransformCallback =
| ((word: string) => string)
diff --git a/types/vue-ui-stackline.d.ts b/types/vue-ui-stackline.d.ts
new file mode 100644
index 00000000..9c7a5d7d
--- /dev/null
+++ b/types/vue-ui-stackline.d.ts
@@ -0,0 +1,18 @@
+import { DefineComponent } from 'vue';
+
+export type {
+ VueUiStacklineDatasetItem,
+ VueUiStacklineDatapointItem,
+ VueUiStacklineSeriesItem,
+ VueUiStacklineConfig,
+ VueUiStacklineExpose,
+ VueUiStacklineEvent
+} from "./vue-data-ui";
+
+declare const VueUiStackline: DefineComponent<{
+ config?: VueUiStacklineConfig;
+ dataset: VueUiStacklineDatasetItem[];
+}, VueUiStacklineExpose>;
+
+export default VueUiStackline;
+export { VueUiStackline }
\ No newline at end of file
diff --git a/vite.config.js b/vite.config.js
index 2573c4dd..7c735a48 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -72,6 +72,7 @@ const entries = {
"components/vue-ui-carousel-table": resolve(__dirname, "src/entries/vue-ui-carousel-table.js"),
"components/vue-ui-gizmo": resolve(__dirname, "src/entries/vue-ui-gizmo.js"),
"components/vue-ui-stackbar": resolve(__dirname, "src/entries/vue-ui-stackbar.js"),
+ "components/vue-ui-stackline": resolve(__dirname, "src/entries/vue-ui-stackline.js"),
"components/vue-ui-bullet": resolve(__dirname, "src/entries/vue-ui-bullet.js"),
"components/vue-ui-funnel": resolve(__dirname, "src/entries/vue-ui-funnel.js"),
"components/vue-ui-history-plot": resolve(__dirname, "src/entries/vue-ui-history-plot.js"),