mirror of
https://github.com/plan-player-analytics/Plan.git
synced 2024-11-08 03:39:42 +01:00
HighCharts night -> day mode
This commit is contained in:
parent
6b5d44019e
commit
84f2cfdb3a
@ -103,101 +103,68 @@
|
||||
|
||||
function changeHighChartsNightMode() {
|
||||
try {
|
||||
console.log(Highcharts.getOptions());
|
||||
Highcharts.theme = nightMode ? {
|
||||
chart: {
|
||||
backgroundColor: '#44475a',
|
||||
plotBorderColor: '#606063'
|
||||
},
|
||||
title: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
},
|
||||
subtitle: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
},
|
||||
xAxis: {
|
||||
gridLineColor: '#707073',
|
||||
labels: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
},
|
||||
lineColor: '#707073',
|
||||
minorGridLineColor: '#505053',
|
||||
tickColor: '#707073',
|
||||
title: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
gridLineColor: '#707073',
|
||||
labels: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
},
|
||||
lineColor: '#707073',
|
||||
minorGridLineColor: '#505053',
|
||||
tickColor: '#707073',
|
||||
tickWidth: 1,
|
||||
title: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
backgroundColor: '#44475a',
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
dataLabels: {
|
||||
color: '#B0B0B3'
|
||||
},
|
||||
marker: {
|
||||
lineColor: '#333'
|
||||
}
|
||||
dataLabels: {color: '#B0B0B3'},
|
||||
marker: {lineColor: '#333'}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
itemStyle: {
|
||||
color: '#eee8d5'
|
||||
},
|
||||
itemHoverStyle: {
|
||||
color: '#eee8d5'
|
||||
},
|
||||
itemHiddenStyle: {
|
||||
color: '#606063'
|
||||
}
|
||||
itemStyle: {color: '#eee8d5'},
|
||||
itemHoverStyle: {color: '#eee8d5'},
|
||||
itemHiddenStyle: {color: '#606063'}
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
style: {color: '#eee8d5'}
|
||||
},
|
||||
drilldown: {
|
||||
activeAxisLabelStyle: {
|
||||
color: '#eee8d5'
|
||||
},
|
||||
activeDataLabelStyle: {
|
||||
color: '#eee8d5'
|
||||
}
|
||||
activeAxisLabelStyle: {color: '#eee8d5'},
|
||||
activeDataLabelStyle: {color: '#eee8d5'}
|
||||
},
|
||||
navigation: {
|
||||
buttonOptions: {
|
||||
symbolStroke: '#eee8d5',
|
||||
theme: {
|
||||
fill: '#44475a'
|
||||
}
|
||||
theme: {fill: '#44475a'}
|
||||
}
|
||||
},
|
||||
// scroll charts
|
||||
@ -205,23 +172,17 @@
|
||||
buttonTheme: {
|
||||
fill: '#505053',
|
||||
stroke: '#646e8c',
|
||||
style: {
|
||||
color: '#CCC'
|
||||
},
|
||||
style: {color: '#CCC'},
|
||||
states: {
|
||||
hover: {
|
||||
fill: '#707073',
|
||||
stroke: '#000000',
|
||||
style: {
|
||||
color: 'white'
|
||||
}
|
||||
fill: '#646e9d',
|
||||
stroke: '#646e8c',
|
||||
style: {color: 'white'}
|
||||
},
|
||||
select: {
|
||||
fill: '#646e9d',
|
||||
stroke: '#646e8c',
|
||||
style: {
|
||||
color: 'white'
|
||||
}
|
||||
style: {color: 'white'}
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -230,9 +191,7 @@
|
||||
backgroundColor: '#333',
|
||||
color: 'silver'
|
||||
},
|
||||
labelStyle: {
|
||||
color: 'silver'
|
||||
}
|
||||
labelStyle: {color: 'silver'}
|
||||
},
|
||||
|
||||
navigator: {
|
||||
@ -242,13 +201,8 @@
|
||||
},
|
||||
outlineColor: '#CCC',
|
||||
maskFill: 'rgba(255,255,255,0.1)',
|
||||
series: {
|
||||
color: '#7798BF',
|
||||
lineColor: '#A6C7ED'
|
||||
},
|
||||
xAxis: {
|
||||
gridLineColor: '#505053'
|
||||
}
|
||||
series: {lineColor: '#A6C7ED'},
|
||||
xAxis: {gridLineColor: '#505053'}
|
||||
},
|
||||
|
||||
scrollbar: {
|
||||
@ -261,10 +215,118 @@
|
||||
trackBackgroundColor: '#404043',
|
||||
trackBorderColor: '#404043'
|
||||
}
|
||||
} : {
|
||||
} : { // Defaults
|
||||
chart: {
|
||||
backgroundColor: '#fff'
|
||||
} // TODO Get the defaults from print above
|
||||
backgroundColor: '#fff',
|
||||
plotBorderColor: '#cccccc'
|
||||
},
|
||||
title: {
|
||||
style: {color: '#3E576F'}
|
||||
},
|
||||
subtitle: {
|
||||
style: {color: '#3E576F'}
|
||||
},
|
||||
xAxis: {
|
||||
gridLineColor: '#E6E6E6',
|
||||
labels: {
|
||||
style: {color: '#333333'}
|
||||
},
|
||||
lineColor: '#E6E6E6',
|
||||
minorGridLineColor: '#505053',
|
||||
tickColor: '#E6E6E6',
|
||||
title: {
|
||||
style: {color: '#333333'}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
gridLineColor: '#E6E6E6',
|
||||
labels: {
|
||||
style: {color: '#333333'}
|
||||
},
|
||||
lineColor: '#E6E6E6',
|
||||
minorGridLineColor: '#505053',
|
||||
tickColor: '#E6E6E6',
|
||||
tickWidth: 1,
|
||||
title: {
|
||||
style: {color: '#333333'}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
backgroundColor: 'rgba(247,247,247,0.85)',
|
||||
style: {color: '#333333'}
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
dataLabels: {color: undefined},
|
||||
marker: {lineColor: undefined}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
itemStyle: {color: '#333333'},
|
||||
itemHoverStyle: {color: '#000000'},
|
||||
itemHiddenStyle: {color: '#cccccc'}
|
||||
},
|
||||
labels: {
|
||||
style: {color: '#333333'}
|
||||
},
|
||||
drilldown: {
|
||||
activeAxisLabelStyle: {color: '#333333'},
|
||||
activeDataLabelStyle: {color: '#333333'}
|
||||
},
|
||||
navigation: {
|
||||
buttonOptions: {
|
||||
symbolStroke: '#333333',
|
||||
theme: {fill: '#CCCCCC'}
|
||||
}
|
||||
},
|
||||
// scroll charts
|
||||
rangeSelector: {
|
||||
buttonTheme: {
|
||||
fill: '#F7F7F7',
|
||||
stroke: '#333',
|
||||
style: {color: '#4B336A'},
|
||||
states: {
|
||||
hover: {
|
||||
fill: '#E6EBF5',
|
||||
stroke: '#333',
|
||||
style: {color: 'black'}
|
||||
},
|
||||
select: {
|
||||
fill: '#E6EBF5',
|
||||
stroke: '#333',
|
||||
style: {color: 'black'}
|
||||
}
|
||||
}
|
||||
},
|
||||
inputBoxBorderColor: '#CCCCCC',
|
||||
inputStyle: {
|
||||
backgroundColor: '#333',
|
||||
color: '#666666'
|
||||
},
|
||||
labelStyle: {color: "#666666"}
|
||||
},
|
||||
|
||||
navigator: {
|
||||
handles: {
|
||||
backgroundColor: '#f2f2f2',
|
||||
borderColor: '#999999'
|
||||
},
|
||||
outlineColor: '#cccccc',
|
||||
maskFill: 'rgba(102,133,194,0.3)',
|
||||
series: {lineColor: "#3FA0FF"},
|
||||
xAxis: {gridLineColor: '#e6e6e6'}
|
||||
},
|
||||
|
||||
scrollbar: {
|
||||
barBackgroundColor: '#cccccc',
|
||||
barBorderColor: '#cccccc',
|
||||
buttonArrowColor: '#333333',
|
||||
buttonBackgroundColor: '#e6e6e6',
|
||||
buttonBorderColor: '#cccccc',
|
||||
rifleColor: '#333333',
|
||||
trackBackgroundColor: '#f2f2f2',
|
||||
trackBorderColor: '#f2f2f2'
|
||||
}
|
||||
};
|
||||
Highcharts.setOptions(Highcharts.theme);
|
||||
updateGraphs();
|
||||
|
Loading…
Reference in New Issue
Block a user