fusioncharts
Version:
FusionCharts JavaScript charting framework
1,930 lines (1,813 loc) • 65 kB
JavaScript
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css = "@font-face {\r\n font-family: \"Fira Sans Light\";\r\n font-style: normal;\r\n font-weight: 300;\r\n src: local(\"Fira Sans Light\"), local(\"FiraSans-Light\"),\r\n url(https://fonts.gstatic.com/s/firasans/v8/va9B4kDNxMZdWfMOD5VnPKreRhf6Xl7Glw.woff2)\r\n format(\"woff2\");\r\n unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,\r\n U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,\r\n U+FEFF, U+FFFD;\r\n}\r\n\r\n@font-face {\r\n font-family: \"Fira Sans Regular\";\r\n font-style: normal;\r\n font-weight: 400;\r\n src: local(\"Fira Sans Regular\"), local(\"FiraSans-Regular\"),\r\n url(https://fonts.gstatic.com/s/firasans/v8/va9E4kDNxMZdWfMOD5Vvl4jLazX3dA.woff2)\r\n format(\"woff2\");\r\n unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,\r\n U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,\r\n U+FEFF, U+FFFD;\r\n}\r\n\r\n/* ft calendar customiztion */\r\n.fc-cal-day-candy {\r\n background-color: rgb(52, 52, 52);\r\n color: rgb(204, 204, 204);\r\n font-family: \"Fira Sans Light\";\r\n border: none;\r\n}\r\n\r\n.fc-cal-date-normal-candy {\r\n background-color: rgb(52, 52, 52);\r\n color: rgb(204, 204, 204);\r\n font-family: \"Fira Sans Light\";\r\n border: none;\r\n}\r\n\r\n.fc-cal-date-normal-candy:hover {\r\n background-color: rgb(110, 110, 110);\r\n color: rgb(255, 255, 255);\r\n font-family: \"Fira Sans Light\";\r\n border: none;\r\n}\r\n\r\n.fc-cal-date-disabled-candy {\r\n background-color: rgb(52, 52, 52);\r\n color: rgba(153, 156, 165, 0.75);\r\n font-family: \"Fira Sans Light\";\r\n border: none;\r\n}\r\n\r\n.fc-cal-month-header-candy {\r\n background-color: rgb(54, 134, 156);\r\n font-family: \"Fira Sans Light\";\r\n}\r\n\r\n.fc-cal-weekend-candy {\r\n background-color: rgb(53, 85, 93);\r\n}\r\n\r\n.fc-cal-container-candy {\r\n border: 0.5px solid rgb(75, 75, 75);\r\n}\r\n\r\n.fc-cal-nav-next-candy,\r\n.fc-cal-nav-prev-candy {\r\n font-family: \"Fira Sans Light\";\r\n font-size: 12px;\r\n}\r\n\r\n.fc-cal-date-selected-candy {\r\n background-color: rgb(54, 134, 156);\r\n color: rgb(255, 255, 255);\r\n font-family: \"Fira Sans Regular\";\r\n}";
styleInject(css);
/*
Candy Theme v0.6
FusionCharts JavaScript Library
Copyright FusionCharts, Inc.
License Information at <http://www.fusioncharts.com/license>
*/
/* jshint ignore:end */
var themeObject = {
name: "candy",
theme: {
base: {
chart: {
// plot customization
usePlotGradientColor: "0",
showPlotBorder: "0",
paletteColors:
"#36B5D8, #F0DC46, #F066AC, #6EC85A, #6E80CA, #E09653, #E1D7AD, #61C8C8, #EBE4F4, #E64141",
showShadow: "0",
// hover effects
showHoverEffect: "1",
plotHoverEffect: "1",
plotFillHoverAlpha: "80",
columnHoverAlpha: "80",
barHoverAlpha: "80",
plotBorderHoverThickness: "0",
// borders, margins, padding and canvas customization
showBorder: "0",
showCanvasBorder: "0",
bgAlpha: "100",
canvasBgAlpha: "0",
bgColor: "#262A33",
captionPadding: "15",
labelPadding: "6",
yAxisValuesPadding: "6",
xAxisNamePadding: "8",
yAxisNamePadding: "8",
// axis and grid lines
showAlternateHGridColor: "0",
showAlternateVGridColor: "0",
divLineAlpha: "50",
divLineColor: "#4B4B4B",
divLineThickness: "0.5",
vDivLineColor: "#4B4B4B",
vDivLineThickness: "0.5",
vDivLineAlpha: "50",
transposeAxis: "1",
crossLineColor: "#4B4B4B",
crossLineAnimation: "1",
crossLineAlpha: "60",
drawCrossLineOnTop: "0",
trendlineColor: "#F6F6F6",
trendlineThickness: "1",
vtrendlineColor: "#F6F6F6",
vtrendlineThickness: "1",
// font & typography customization
baseFont: "Fira Sans Light",
outCnvBaseFont: "Fira Sans Light",
baseFontSize: "13",
outCnvBaseFontSize: "13",
baseFontColor: "#999CA5",
outCnvBaseFontColor: "#999CA5",
labelFontColor: "#F6F6F6",
captionFontBold: "0",
captionFontSize: "18",
captionFont: "Fira Sans Regular",
captionFontColor: "#F6F6F6",
subCaptionFontBold: "0",
subCaptionFontSize: "15",
subCaptionFont: "Fira Sans Light",
subCaptionFontColor: "#999CA5",
valueFontColor: "#F6F6F6",
valueFontBold: "1",
valueFontSize: "14",
valueFont: "Fira Sans Regular",
xAxisNameFontSize: "14",
xAxisNameFontBold: "0",
xAxisNameFont: "Fira Sans Regular",
xAxisNameFontColor: "#999CA5",
yAxisNameFontSize: "14",
yAxisNameFontBold: "0",
yAxisNameFont: "Fira Sans Regular",
yAxisNameFontColor: "#999CA5",
sYAxisNameFontSize: "14",
sYAxisNameFontBold: "0",
sYAxisNameFont: "Fira Sans Regular",
sYAxisNameFontColor: "#999CA5",
showValues: "0",
// tooltip customization
toolTipColor: "#F6F6F6",
toolTipBgColor: "#000000",
toolTipBorderAlpha: "0",
toolTipBgAlpha: "70",
toolTipPadding: "7",
toolTipBorderRadius: "2",
// legend customization
drawCustomLegendIcon: "1",
legendShadow: "0",
legendBorderAlpha: "0",
legendBorderThickness: "0",
legendItemFont: "Fira Sans Regular",
legendItemFontColor: "#999CA5",
legendIconBorderThickness: "0",
legendBgAlpha: "0",
legendItemFontSize: "14",
legendItemFontBold: "1",
legendCaptionFont: "Fira Sans Regular",
legendCaptionFontColor: "#F6F6F6",
legendCaptionFontSize: "14",
legendCaptionFontBold: "0",
legendScrollBgColor: "#ABABAB"
}
},
// 1. Column 2D Chart
column2d: {
chart: {
showValues: "1",
paletteColors: "#36B5D8"
}
},
// 2. Column 3D Chart
column3d: {
chart: {
paletteColors: "#36B5D8",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 3. Line 2D Chart
line: {
chart: {
paletteColors: "#36B5D8",
anchorBgColor: "#36B5D8",
drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBgHoverColor: "#262A33",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 4. Area 2D Chart
area2d: {
chart: {
drawAnchors: "0",
paletteColors: "#36B5D8",
drawCrossLine: "1",
plotFillAlpha: "85"
}
},
// 5. Bar 2D Chart
bar2d: {
chart: {
showValues: "1",
paletteColors: "#36B5D8"
}
},
// 6. Bar 3D Chart
bar3d: {
chart: {
paletteColors: "#36B5D8",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 7. Pie 2D Chart
pie2d: {
chart: {
showZeroPies: "1",
use3DLighting: "0",
showPercentValues: "1",
showValues: "1",
showPercentInTooltip: "0",
useDataPlotColorForLabels: "0",
showLegend: "1",
legendIconSides: "2",
labelFontBold: "0",
labelFont: "Fira Sans Light",
labelFontColor: "#999CA5",
enableMultiSlicing: "0",
isSmartLineSlanted: "0",
smartLineColor: "#999CA5",
smartLineThickness: "1",
smartLabelClearance: "0"
}
},
// 8. Pie 3D Chart
pie3d: {
chart: {
showZeroPies: "1",
showPercentValues: "1",
showValues: "1",
showPercentInToolTip: "0",
use3DLighting: "0",
enableMultiSlicing: "0",
pieYScale: "55",
pieSliceDepth: "10",
isSmartLineSlanted: "0",
smartLineColor: "#999CA5",
smartLineThickness: "1",
smartLabelClearance: "0",
showLegend: "1",
legendIconSides: "2",
labelFontBold: "0",
labelFont: "Fira Sans Light",
labelFontColor: "#999CA5"
}
},
// 9. Doughnut 2D Chart
doughnut2d: {
chart: {
showZeroPies: "1",
showPercentValues: "1",
showValues: "1",
showPercentInToolTip: "0",
use3DLighting: "0",
enableMultiSlicing: "0",
isSmartLineSlanted: "0",
smartLineColor: "#999CA5",
smartLineThickness: "1",
smartLabelClearance: "0",
showLegend: "1",
legendIconSides: "2",
labelFontBold: "0",
labelFont: "Fira Sans Light",
labelFontColor: "#999CA5",
centerLabelFont: "Fira Sans Light",
centerLabelBold: "0"
}
},
// 10. Doughnut 3D Chart
doughnut3d: {
chart: {
showZeroPies: "1",
showValues: "1",
showPercentValues: "1",
showPercentInToolTip: "0",
use3DLighting: "0",
enableMultiSlicing: "0",
pieYScale: "55",
pieSliceDepth: "10",
isSmartLineSlanted: "0",
smartLineColor: "#999CA5",
smartLineThickness: "1",
smartLabelClearance: "0",
showLegend: "1",
legendIconSides: "2",
labelFontBold: "0",
labelFont: "Fira Sans Light",
labelFontColor: "#999CA5"
}
},
// 11. Pareto 2D Chart
pareto2d: {
chart: {
paletteColors: "#36B5D8",
lineColor: "#F0DC46",
lineThickness: "3",
drawAnchors: "1",
anchorBgColor: "#F0DC46",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverColor: "#262A33",
anchorBgHoverAlpha: "100"
}
},
// 12. Pareto 3D Chart
pareto3d: {
chart: {
paletteColors: "#36B5D8",
lineColor: "#F0DC46",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058",
lineThickness: "3",
drawAnchors: "1",
anchorBgColor: "#F0DC46",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverColor: "#262A33",
anchorBgHoverAlpha: "100"
}
},
// 13. Multi-Series Column2D Chart
mscolumn2d: {
chart: {
drawCrossLine: "1",
showLegend: "1",
legendIconSides: "4"
}
},
// 14. Multi-Series Column3D Chart
mscolumn3d: {
chart: {
showLegend: "1",
legendIconSides: "4",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 15. Multi-series Line2D Chart
msline: {
chart: {
showLegend: "1",
legendIconSides: "2",
drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 16. Multi-series Bar2D Chart
msbar2d: {
chart: {
drawCrossLine: "1",
showLegend: "1",
legendIconSides: "4"
}
},
// 17. Multi-series Bar3D Chart
msbar3d: {
chart: {
showLegend: "1",
legendIconSides: "4",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 18. Multi-series Area2D Chart
msarea: {
chart: {
showLegend: "1",
legendIconSides: "4",
plotFillAlpha: "70",
drawCrossLine: "1"
}
},
// 19. Marimekko Chart
marimekko: {
chart: {
showLegend: "1",
legendIconSides: "4",
showSum: "0",
valueBgColor: "#262A33",
valueBgAlpha: "70",
drawCrossLine: "1",
showPlotBorder: "1",
plotBorderColor: "#262A33",
plotBorderThickness: "0.75",
plotBorderAlpha: "100"
}
},
// 20. Zoom Line Chart
zoomline: {
chart: {
paletteColors:
"#36B5D8, #6EC85A, #6E80CA, #E09653, #E1D7AD, #61C8C8, #EBE4F4, #E64141, #F0DC46, #F066AC",
crossLineValueFont: "Fira Sans Regular",
lineThickness: "2.5",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10",
crossLineThickness: "1",
crossLineColor: "#4B4B4B",
crossLineAlpha: "100",
showLegend: "1",
legendIconSides: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 21. Zoom Line Dual Y-Axis Chart
zoomlinedy: {
chart: {
paletteColors:
"#36B5D8, #6EC85A, #6E80CA, #E09653, #E1D7AD, #61C8C8, #EBE4F4, #E64141, #F0DC46, #F066AC",
crossLineValueFont: "Fira Sans Regular",
lineThickness: "2.5",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10",
crossLineThickness: "1",
crossLineColor: "#4B4B4B",
crossLineAlpha: "100",
showLegend: "1",
legendIconSides: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 22. Stacked Column2D Chart
stackedcolumn2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
drawCrossLine: "1"
}
},
// 23. Stacked Column3D Chart
stackedcolumn3d: {
chart: {
showLegend: "1",
legendIconSides: "4",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 24. Stacked Bar2D Chart
stackedbar2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
drawCrossLine: "1"
}
},
// 25. Stacked Bar3D Chart
stackedbar3d: {
chart: {
showLegend: "1",
legendIconSides: "4",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 26. Stacked Area 2D Chart
stackedarea2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
plotFillAlpha: "85",
drawCrossLine: "1"
}
},
// 27. Multi-series Stacked Column2D Chart
msstackedcolumn2d: {
chart: {
showLegend: "1",
legendIconSides: "4"
}
},
// 28. Multi-series 2D Single Y Combination Chart
mscombi2d: {
chart: {
lineThickness: "3",
showLegend: "1",
drawCrossLine: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 29. Multi-series 3D Single Y Combination Chart
mscombi3d: {
chart: {
lineThickness: "3",
showLegend: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 30. Multi-series Column 3D + Line - Single Y Axis Chart
mscolumnline3d: {
chart: {
lineThickness: "3",
showLegend: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 31. Stacked Column 2D + Line Single Y Axis Chart
stackedcolumn2dline: {
chart: {
lineThickness: "3",
showLegend: "1",
drawCrossLine: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 32. Stacked Column 3D + Line Single Y Axis Chart
stackedcolumn3dline: {
chart: {
lineThickness: "3",
showLegend: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 33. Multi-series 2D Dual Y Combination Chart
mscombidy2d: {
chart: {
lineThickness: "3",
showLegend: "1",
drawCrossLine: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 34. Multi-series Column 3D + Line - Dual Y Axis Chart
mscolumn3dlinedy: {
chart: {
lineThickness: "3",
showLegend: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 35. Stacked Column 3D + Line Dual Y Axis Chart
stackedcolumn3dlinedy: {
chart: {
lineThickness: "3",
showLegend: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
canvasBaseDepth: "2",
canvasBaseColor: "#4D5058"
}
},
// 36. Multi-series Stacked Column 2D + Line Dual Y Axis Chart
msstackedcolumn2dlinedy: {
chart: {
lineThickness: "3",
showLegend: "1",
drawCrossLine: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 37. Scatter Chart
scatter: {
chart: {
showLegend: "1",
drawCustomLegendIcon: "0",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
outCnvBaseFontColor: "#F6F6F6",
divLineAlpha: "100",
vDivLineAlpha: "100"
},
dataset: [
{
regressionLineColor: "#F6F6F6",
regressionLineThickness: "1"
}
]
},
// 38. Bubble Chart
bubble: {
chart: {
use3DLighting: "0",
showLegend: "1",
legendIconSides: "2",
plotFillAlpha: "50",
outCnvBaseFontColor: "#F6F6F6",
divLineAlpha: "100",
vDivLineAlpha: "100",
quadrantLineThickness: "2",
quadrantLineColor: "#4B4B4B",
quadrantLineAlpha: "100",
setAdaptiveYMin: "1",
setAdaptiveXMin: "1"
}
},
// 39. Zoom Scatter Chart
zoomscatter: {
chart: {
showLegend: "1",
legendIconBorderThickness: "2",
outCnvBaseFontColor: "#F6F6F6",
divLineAlpha: "100",
vDivLineAlpha: "100"
},
dataset: [
{
drawLine: "0",
anchorRadius: "6",
anchorBorderThickness: "0.1",
anchorAlpha: "50",
hoverColor: "#999CA5",
regressionLineColor: "#F6F6F6",
regressionLineAlpha: "100",
regressionLineThickness: "1"
}
]
},
// 40. Scroll Column 2D
scrollcolumn2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10"
}
},
// 41. Scroll Line 2D
scrollline2d: {
chart: {
showLegend: "1",
legendIconSides: "2",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 42. Scroll Area 2D
scrollarea2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10",
plotFillAlpha: "70"
}
},
// 43. Scroll Stacked Column 2D Chart
scrollstackedcolumn2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10"
}
},
// 44. Scroll Combination 2D (Single Y)
scrollcombi2d: {
chart: {
lineThickness: "3",
showLegend: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10"
}
},
// 45. Scroll Combination 2D (Dual Y)
scrollcombidy2d: {
chart: {
lineThickness: "3",
showLegend: "1",
drawCrossLine: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
flatScrollBars: "1",
scrollShowButtons: "0",
scrollColor: "#ABABAB",
scrollheight: "10"
}
},
// 46. Real-time Angular
angulargauge: {
chart: {
setAdaptiveMin: "1",
adjustTM: "1",
tickvaluedistance: "10",
placeTicksInside: "0",
autoAlignTickValues: "1",
showGaugeBorder: "0",
minortmnumber: "1",
minortmHeight: "5",
majorTMHeight: "10",
majortmthickness: "1.5",
minortmthickness: "1.5",
minorTMAlpha: "50",
gaugeFillMix: "{light-0}",
pivotbgcolor: "#000000",
pivotfillmix: "0",
showpivotborder: "1",
pivotBorderColor: "#F6F6F6",
showValue: "0",
valueBelowPivot: "1"
},
dials: {
dial: [
{
bgColor: "#F6F6F6",
borderColor: "#262A33",
borderThickness: "0.5"
}
]
}
},
// 47. Real-time bulb
bulb: {
chart: {
is3D: "0",
placeValuesInside: "1",
valueFontColor: "#262A33",
valueFontBold: "1",
valueFontSize: "14",
valueFont: "Fira Sans Regular"
}
},
// 48. Real-time Cylinder
cylinder: {
chart: {
cylRadius: "50",
cylYScale: "13",
cylFillColor: "#36B5D8",
adjustTM: "1",
majorTMColor: "#F6F6F6",
minortmnumber: "1",
minortmHeight: "5",
majorTMHeight: "10",
minorTMAlpha: "50",
setAdaptiveMin: "1",
tickValueDistance: "5"
}
},
// 49. Real-time Horizontal LED
hled: {
chart: {
majorTMColor: "#F6F6F6",
minortmnumber: "1",
minortmHeight: "5",
majorTMHeight: "10",
minorTMAlpha: "50",
setAdaptiveMin: "1",
tickValueDistance: "5",
adjustTM: "1",
showValue: "0"
}
},
// 50. Real-time Horizontal Linear Gauge
hlineargauge: {
chart: {
showGaugeBorder: "0",
setAdaptiveMin: "1",
adjustTM: "1",
placeTicksInside: "0",
autoAlignTickValues: "1",
majorTMColor: "#F6F6F6",
minortmnumber: "1",
minortmHeight: "5",
minorTMAlpha: "50",
majorTMHeight: "10",
tickValueDistance: "5",
gaugeFillMix: "{light-0}",
baseFontColor: "#262A33",
pointerOnTop: "0",
valueAbovePointer: "1",
pointerRadius: "10",
pointerBgAlpha: "100",
pointerBgColor: "#F6F6F6",
pointerBorderColor: "#262A33",
valueBgColor: "#262A33",
valueBgAlpha: "70",
showPointerShadow: "1"
}
},
// 51. Real-time Thermometer
thermometer: {
chart: {
use3DLighting: "0",
manageResize: "1",
autoScale: "1",
showGaugeBorder: "1",
placeTicksInside: "0",
autoAlignTickValues: "1",
majorTMColor: "#F6F6F6",
setAdaptiveMin: "1",
minortmnumber: "1",
minortmHeight: "5",
minorTMAlpha: "50",
majorTMHeight: "10",
tickValueDistance: "5",
thmFillColor: "#36B5D8",
adjustTM: "1",
gaugeBorderColor: "#999CA5",
gaugeBorderAlpha: "80",
gaugeBorderThickness: "1"
}
},
// 52. Real-time Vertical LED Gauge
vled: {
chart: {
adjustTM: "1",
majorTMColor: "#F6F6F6",
minortmnumber: "1",
setAdaptiveMin: "1",
minortmHeight: "5",
majorTMHeight: "10",
minorTMAlpha: "50",
tickValueDistance: "5",
showValue: "0"
}
},
// 53. Real-time Area
realtimearea: {
chart: {
showLegend: "1",
legendIconSides: "4",
plotFillAlpha: "70",
showRealTimeValue: "0"
}
},
// 54. Real-time Column
realtimecolumn: {
chart: {
showLegend: "1",
legendIconSides: "4",
showRealTimeValue: "0"
}
},
// 55. Real-time Line
realtimeline: {
chart: {
showLegend: "1",
legendIconSides: "2",
setAdaptiveYMin: "1",
lineThickness: "2.5",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
showRealTimeValue: "0"
}
},
// 56. Real-time Stacked Area
realtimestackedarea: {
chart: {
showLegend: "1",
legendIconSides: "4",
plotFillAlpha: "85",
showRealTimeValue: "0"
}
},
// 57. Real-time Stacked Column
realtimestackedcolumn: {
chart: {
showLegend: "1",
legendIconSides: "4",
showRealTimeValue: "0"
}
},
// 58. Real-time Line (Dual Y)
realtimelinedy: {
chart: {
showLegend: "1",
legendIconSides: "2",
setAdaptiveYMin: "1",
lineThickness: "2.5",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
showRealTimeValue: "0"
}
},
// 59. Spark Line
sparkline: {
chart: {
plotFillColor: "#36B5D8",
anchorRadius: "4",
highColor: "#6EC85A",
lowColor: "#E64141",
showOpenAnchor: "0",
showCloseAnchor: "0",
showOpenValue: "0",
showCloseValue: "0",
showHighLowValue: "0",
periodColor: "#4B4B4B",
periodAlpha: "50",
chartLeftMargin: "15",
chartRightMargin: "10"
}
},
// 60. Spark Column
sparkcolumn: {
chart: {
plotFillColor: "#36B5D8",
highColor: "#6EC85A",
lowColor: "#E64141",
periodColor: "#4B4B4B",
periodAlpha: "50",
chartLeftMargin: "15",
chartRightMargin: "10"
}
},
// 61. Spark Win/Loss
sparkwinloss: {
chart: {
winColor: "#6EC85A",
lossColor: "#E64141",
drawColor: "F0DC46",
scoreLessColor: "#36B5D8",
periodColor: "#4B4B4B",
periodAlpha: "50",
chartLeftMargin: "15",
chartRightMargin: "10"
}
},
// 62. Horizontal bullet graph
hbullet: {
chart: {
adjustTM: "1",
majorTMColor: "#F6F6F6",
minortmnumber: "1",
setAdaptiveMin: "1",
minortmHeight: "5",
majorTMHeight: "10",
minorTMAlpha: "50",
tickValueDistance: "5",
showValue: "0",
colorRangeFillMix: "{light+0}",
targetCapStyle: "round",
plotFillColor: "#3A3A3A",
targetColor: "#3A3A3A"
}
},
// 63. Vertical bullet graph
vbullet: {
chart: {
adjustTM: "1",
majorTMColor: "#F6F6F6",
minortmnumber: "1",
setAdaptiveMin: "1",
minortmHeight: "5",
majorTMHeight: "10",
minorTMAlpha: "50",
tickValueDistance: "5",
showValue: "0",
colorRangeFillMix: "{light+0}",
targetCapStyle: "round",
plotFillColor: "#3A3A3A",
targetColor: "#3A3A3A"
}
},
// 64. Funnel Chart
funnel: {
chart: {
is2D: "1",
isSmartLineSlanted: "0",
smartLineColor: "#999CA5",
smartLineThickness: "1",
smartLabelClearance: "0",
streamlinedData: "1",
useSameSlantAngle: "1",
alignCaptionWithCanvas: "1",
showPlotBorder: "1",
plotBorderColor: "#262A33",
plotBorderThickness: "1",
plotBorderAlpha: "100",
labelFontColor: "#999CA5"
}
},
// 65. Pyramid Chart
pyramid: {
chart: {
is2D: "1",
isSmartLineSlanted: "0",
smartLineColor: "#999CA5",
smartLineThickness: "1",
smartLabelClearance: "0",
streamlinedData: "1",
useSameSlantAngle: "1",
alignCaptionWithCanvas: "1",
use3dlighting: "0",
showPlotBorder: "1",
plotBorderColor: "#262A33",
plotBorderThickness: "1",
plotBorderAlpha: "100",
labelFontColor: "#999CA5"
}
},
// 66. Gantt Chart
gantt: {
chart: {
taskBarFillMix: "{light+0}",
flatScrollBars: "1",
gridBorderAlpha: "100",
gridBorderColor: "#4B4B4B",
ganttLineColor: "#4B4B4B",
ganttLineAlpha: "100",
taskBarRoundRadius: "3",
showHoverEffect: "1",
plotHoverEffect: "1",
plotFillHoverAlpha: "50",
showCategoryHoverBand: "1",
categoryHoverBandAlpha: "50",
showGanttPaneVerticalHoverBand: "1",
showProcessHoverBand: "1",
processHoverBandAlpha: "50",
showGanttPaneHorizontalHoverBand: "1",
showConnectorHoverEffect: "1",
connectorHoverAlpha: "50",
showTaskHoverEffect: "1",
taskHoverFillAlpha: "50",
slackHoverFillAlpha: "50",
scrollShowButtons: "0",
drawCustomLegendIcon: "0",
legendShadow: "0",
legendBorderAlpha: "0",
legendBorderThickness: "0",
legendIconBorderThickness: "0",
legendBgAlpha: "0"
},
categories: [
{
fontcolor: "#F6F6F6",
fontsize: "14",
bgcolor: "#888A8F",
hoverBandAlpha: "45",
showGanttPaneHoverBand: "1",
bgAlpha: "50",
headerbgAlpha: "50",
showHoverBand: "1",
category: [
{
fontcolor: "#F6F6F6",
fontsize: "14",
bgAlpha: "50",
bgcolor: "#888A8F"
}
]
}
],
tasks: {
showBorder: "0",
showHoverEffect: "0",
task: [
{
color: "#36B5D8"
}
]
},
processes: {
fontcolor: "#F6F6F6",
isanimated: "0",
bgcolor: "#888A8F",
headerbgAlpha: "50",
bgAlpha: "50",
headerbgcolor: "#888A8F",
headerfontcolor: "#F6F6F6",
showGanttPaneHoverBand: "1",
showHoverBand: "1"
},
text: {
fontcolor: "#F6F6F6",
bgcolor: "#888A8F",
bgAlpha: "50"
},
datatable: {
fontcolor: "#F6F6F6",
bgcolor: "#888A8F",
bgAlpha: "50",
datacolumn: [
{
bgcolor: "#888A8F",
bgAlpha: "50"
}
]
},
connectors: [
{
hoverThickness: "2",
connector: [
{
color: "#E09653"
}
]
}
],
milestones: {
milestone: [
{
color: "#6EC85A"
}
]
}
},
// 67. Logarithmic Column 2D Chart
logmscolumn2d: {
chart: {
drawCrossLine: "1",
showLegend: "1",
legendIconSides: "4"
}
},
// 68. Logarithmic Line 2D Chart
logmsline: {
chart: {
showLegend: "1",
legendIconSides: "2",
drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 69. Single-Series Spline 2D
spline: {
chart: {
paletteColors: "#36B5D8",
anchorBgColor: "#36B5D8",
// drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBgHoverColor: "#262A33",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 70. Single-Series Spline Area 2D
splinearea: {
chart: {
drawAnchors: "0",
paletteColors: "#36B5D8",
// drawCrossLine: "1",
plotFillAlpha: "85"
}
},
// 71. Multi-Series Spline 2D
msspline: {
chart: {
showLegend: "1",
legendIconSides: "2",
// drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 72. Multi-Series Spline Area 2D
mssplinearea: {
chart: {
showLegend: "1",
legendIconSides: "4",
plotFillAlpha: "70"
// drawCrossLine: "1"
}
},
// 73. Error Bar Chart
errorbar2d: {
chart: {
showLegend: "1",
legendIconSides: "4",
errorBarColor: "#999CA5",
errorBarThickness: "1"
}
},
// 74. Error Line 2D Chart
errorline: {
chart: {
showLegend: "1",
legendIconSides: "2",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
errorBarColor: "#999CA5",
errorBarThickness: "1"
}
},
// 75. Error Scatter Chart
errorscatter: {
chart: {
showLegend: "1",
drawCustomLegendIcon: "0",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
outCnvBaseFontColor: "#F6F6F6",
divLineAlpha: "100",
vDivLineAlpha: "100",
errorBarColor: "#999CA5",
errorBarThickness: "1"
},
dataset: [
{
regressionLineColor: "#F6F6F6",
regressionLineThickness: "1"
}
]
},
// 76. Inverse Y-Axis Area 2D Chart
inversemsarea: {
chart: {
showLegend: "1",
legendIconSides: "2",
plotFillAlpha: "70",
drawCrossLine: "1"
}
},
// 77. Inverse Y-Axis Column 2D Chart
inversemscolumn2d: {
chart: {
drawCrossLine: "1",
showLegend: "1",
legendIconSides: "4"
}
},
// 78. Inverse Y-Axis Line 2D Chart
inversemsline: {
chart: {
showLegend: "1",
legendIconSides: "2",
drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
}
},
// 79. Drag-able Column 2D Chart
dragcolumn2d: {
chart: {
showLegend: "1",
legendIconSides: "4"
},
categories: [
{
category: [
{
fontItalic: "1"
}
]
}
],
dataset: [
{
allowDrag: "1",
data: [
{
alpha: "70"
}
]
}
]
},
// 80. Drag-able Line 2D Chart
dragline: {
chart: {
showLegend: "1",
legendIconSides: "2",
drawCrossLine: "1",
setAdaptiveYMin: "1",
lineThickness: "2",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
},
categories: [
{
category: [
{
fontItalic: "1"
}
]
}
],
dataset: [
{
allowDrag: "1",
data: [
{
alpha: "70",
dashed: "1"
}
]
}
]
},
// 81. Drag-able Area 2D Chart
dragarea: {
chart: {
showLegend: "1",
legendIconSides: "2",
plotFillAlpha: "70",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100"
},
categories: [
{
category: [
{
fontItalic: "1"
}
]
}
],
dataset: [
{
allowDrag: "1"
}
]
},
// 82. Treemap Chart
treemap: {
chart: {
parentLabelLineHeight: "13",
baseFontSize: "11",
labelFontSize: "11",
showParent: "1",
showNavigationBar: "0",
plotBorderThickness: "0.75",
plotBorderColor: "#4B4B4B",
labelGlow: "0",
btnBackChartTooltext: "Back",
btnResetChartTooltext: "Home",
legendScaleLineThickness: "0",
legendaxisborderalpha: "0",
legendShadow: "0",
toolbarButtonScale: "1.55",
legendPointerColor: "#262A33",
legendpointerbordercolor: "#F6F6F6",
legendPointerAlpha: "80",
defaultParentBgColor: "#36B5D8",
fontcolor: "#F6F6F6"
},
data: [
{
fillColor: "#4A5264"
}
]
},
// 83. Radar Chart
radar: {
chart: {
showLegend: "1",
legendIconSides: "2",
lineThickness: "2",
drawAnchors: "0",
legendIconBorderThickness: "2",
plotFillAlpha: "45",
anchorBgAlpha: "45",
radarBorderColor: "#4B4B4B",
radarBorderThickness: "1.5",
radarSpikeColor: "#4B4B4B",
radarSpikeThickness: "1",
radarSpikeAlpha: "50",
radarFillColor: "#262A33",
outCnvBaseFontColor: "#F6F6F6"
}
},
// 84. Heat Map Chart
heatmap: {
chart: {
labelFontSize: "13",
showPlotBorder: "1",
plotBorderAlpha: "100",
plotBorderThickness: "0.75",
plotBorderColor: "#979797",
tlFontColor: "#F6F6F6",
tlFont: "Fira Sans Light",
tlFontSize: "11",
trFontColor: "#F6F6F6",
trFont: "Fira Sans Light",
trFontSize: "11",
blFontColor: "#F6F6F6",
blFont: "Fira Sans Light",
blFontSize: "11",
brFontColor: "#F6F6F6",
brFont: "Fira Sans Light",
brFontSize: "11",
captionPadding: "20",
legendScaleLineThickness: "0",
legendaxisborderalpha: "0",
legendShadow: "0",
outCnvBaseFontColor: "#F6F6F6",
legendPointerColor: "#262A33",
legendpointerbordercolor: "#F6F6F6",
legendPointerAlpha: "80"
},
colorrange: {
gradient: "1",
code: "#36B5D8"
}
},
// 85. Box and Whisker Chart
boxandwhisker2d: {
chart: {
paletteColors: "#36B5D8, #8BD4E9, #F0DC46, #F9F1B4, #F066AC, #F8B3D6",
drawCustomLegendIcon: "0",
showLegend: "1",
showDetailedLegend: "1",
showAllOutliers: "1",
outlierIconShape: "polygon",
outlierIconRadius: "6",
outlierIconSides: "2",
outlierIconColor: "#F6F6F6",
outlierIconAlpha: "70",
upperWhiskerColor: "#999CA5",
upperWhiskerAlpha: "100",
upperWhiskerThickness: "1",
lowerWhiskerColor: "#999CA5",
lowerWhiskerAlpha: "100",
lowerWhiskerThickness: "1",
medianColor: "#262A33",
medianThickness: "1.3",
medianAlpha: "100",
meanIconShape: "polygon",
meanIconSides: "2",
meanIconColor: "#F6F6F6",
meanIconAlpha: "70",
meanIconRadius: "3",
SDIconColor: "#F6F6F6",
SDIconAlpha: "80",
MDIconColor: "#F6F6F6",
MDIconAlpha: "80",
QDIconColor: "#F6F6F6",
QSDIconAlpha: "80",
connectNullData: "1"
}
},
// 86. Candle-Stick Chart
candlestick: {
chart: {
showShadow: "0",
showVPlotBorder: "0",
bearFillColor: "#E64141",
bullFillColor: "#6EC85A",
plotLineThickness: "0.5",
plotLineAlpha: "100",
divLineDashed: "0",
showDetailedLegend: "1",
legendIconSides: "2",
showHoverEffect: "1",
plotHoverEffect: "1",
showVolumeChart: "0",
trendLineColor: "#F6F6F6",
trendLineThickness: "1",
trendValueAlpha: "100",
rollOverBandAlpha: "60",
rollOverBandColor: "#4B4B4B",
trendlineAlpha: "100",
showTrendlinesOnTop: "1"
},
categories: [
{
verticalLineColor: "#4B4B4B",
verticalLineThickness: "1",
verticalLineAlpha: "50"
}
],
trendlines: [
{
line: [
{
color: "#F6F6F6"
}
]
}
],
vTRendlines: [
{
line: [
{
color: "#F6F6F6"
}
]
}
]
},
// 87. Drag Node Chart
dragnode: {
chart: {
use3DLighting: "0",
plotBorderThickness: "0",
plotBorderAlpha: "0",
showDetailedLegend: "1",
divLineAlpha: "0"
},
dataset: [
{
color: "#36B5D8"
}
],
connectors: [
{
connector: [
{
color: "#F0DC46",
strength: "1"
}
]
}
]
},
// 88. Step Line Chart
msstepline: {
chart: {
drawAnchors: "0",
lineThickness: "2",
showValues: "0",
legendIconSides: "2",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
setAdaptiveYMin: "1"
}
},
// 89. Multi-axis Line Chart
multiaxisline: {
chart: {
showValues: "0",
showLegend: "1",
legendIconSides: "2",
lineThickness: "2",
connectNullData: "1",
divLineDashed: "0",
divLineColor: "#4B4B4B",
divLineAlpha: "50",
vDivLineColor: "#4B4B4B",
vdivLineAlpha: "50",
vDivLineDashed: "0",
yAxisNameFontSize: "12",
setAdaptiveYMin: "1",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
checkBoxColor: "#262A33"
},
axis: [
{
divLineColor: "#4B4B4B",
divLineAlpha: "50",
setAdaptiveYMin: "1",
divLineDashed: "0"
}
]
},
// 90. Multi-level Pie Chart
multilevelpie: {
chart: {
valueFontColor: "#F6F6F6",
valueFontBold: "1",
valueFontSize: "12.5",
valueFont: "Fira Sans Light",
useHoverColor: "1",
hoverFillColor: "#4B4B4B",
showHoverEffect: "1",
plotHoverEffect: "1",
showPlotBorder: "1",
plotBorderColor: "#262A33",
plotBorderThickness: "0.75",
plotBorderAlpha: "100"
},
category: [
{
color: "#262A33",
category: [
{
color: "#36B5D8",
category: [
{
color: "#36B5D8"
}
]
}
]
}
]
},
// 91. Select-Scatter Chart
selectscatter: {
chart: {
showLegend: "1",
drawCustomLegendIcon: "0",
drawAnchors: "1",
legendIconBorderThickness: "2",
anchorBgColor: "#262A33",
anchorRadius: "4",
anchorHoverRadius: "7",
anchorBorderHoverThickness: "1",
anchorBorderHoverColor: "#ECEBE4",
anchorBgHoverAlpha: "100",
outCnvBaseFontColor: "#F6F6F6",
divLineAlpha: "100",
vDivLineAlpha: "100"
}
},
// 92. Waterfall / Cascade Chart
waterfall2d: {
chart: {
showValues: "0",
positiveColor: "#6EC85A",
negativeColor: "#E64141",
showConnectors: "1",
connectorDashed: "1",
connectorThickness: "1",
connectorColor: "#F6F6F6",
connectorAlpha: "40"
}
},
// 93. Kagi Chart
kagi: {
chart: {
rallyThickness: "2",
declineThickness: "2",
drawAnchors: "0",
rallyColor: "#6EC85A",
declineColor: "#E64141",
showValues: "0"
}
},
// 94 Geo Maps
geo: {
chart: {
showLabels: "0",
legendScaleLineThickness: "0",
legendaxisborderalpha: "0",
legendShadow: "0",
fillColor: "#36B5D8"