You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
224 lines
5.8 KiB
224 lines
5.8 KiB
/* |
|
* Licensed to the Apache Software Foundation (ASF) under one |
|
* or more contributor license agreements. See the NOTICE file |
|
* distributed with this work for additional information |
|
* regarding copyright ownership. The ASF licenses this file |
|
* to you under the Apache License, Version 2.0 (the |
|
* "License"); you may not use this file except in compliance |
|
* with the License. You may obtain a copy of the License at |
|
* |
|
* http://www.apache.org/licenses/LICENSE-2.0 |
|
* |
|
* Unless required by applicable law or agreed to in writing, |
|
* software distributed under the License is distributed on an |
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY |
|
* KIND, either express or implied. See the License for the |
|
* specific language governing permissions and limitations |
|
* under the License. |
|
*/ |
|
|
|
(function(root, factory) { |
|
if (typeof define === 'function' && define.amd) { |
|
// AMD. Register as an anonymous module. |
|
define(['exports', 'echarts'], factory); |
|
} else if ( |
|
typeof exports === 'object' && |
|
typeof exports.nodeName !== 'string' |
|
) { |
|
// CommonJS |
|
factory(exports, require('echarts/lib/echarts')); |
|
} else { |
|
// Browser globals |
|
factory({}, root.echarts); |
|
} |
|
})(this, function(exports, echarts) { |
|
var log = function(msg) { |
|
if (typeof console !== 'undefined') { |
|
console && console.error && console.error(msg); |
|
} |
|
}; |
|
if (!echarts) { |
|
log('ECharts is not Loaded'); |
|
return; |
|
} |
|
var contrastColor = '#B9B8CE'; |
|
var backgroundColor = '#100C2A'; |
|
var axisCommon = function () { |
|
return { |
|
axisLine: { |
|
lineStyle: { |
|
color: contrastColor |
|
} |
|
}, |
|
splitLine: { |
|
lineStyle: { |
|
color: '#484753' |
|
} |
|
}, |
|
splitArea: { |
|
areaStyle: { |
|
color: ['rgba(255,255,255,0.02)', 'rgba(255,255,255,0.05)'] |
|
} |
|
}, |
|
minorSplitLine: { |
|
lineStyle: { |
|
color: '#20203B' |
|
} |
|
} |
|
}; |
|
}; |
|
|
|
var colorPalette = [ |
|
'#4992ff', |
|
'#7cffb2', |
|
'#fddd60', |
|
'#ff6e76', |
|
'#58d9f9', |
|
'#05c091', |
|
'#ff8a45', |
|
'#8d48e3', |
|
'#dd79ff' |
|
]; |
|
var theme = { |
|
darkMode: true, |
|
|
|
color: colorPalette, |
|
backgroundColor: backgroundColor, |
|
axisPointer: { |
|
lineStyle: { |
|
color: '#817f91' |
|
}, |
|
crossStyle: { |
|
color: '#817f91' |
|
}, |
|
label: { |
|
// TODO Contrast of label backgorundColor |
|
color: '#fff' |
|
} |
|
}, |
|
legend: { |
|
textStyle: { |
|
color: contrastColor |
|
} |
|
}, |
|
textStyle: { |
|
color: contrastColor |
|
}, |
|
title: { |
|
textStyle: { |
|
color: '#EEF1FA' |
|
}, |
|
subtextStyle: { |
|
color: '#B9B8CE' |
|
} |
|
}, |
|
toolbox: { |
|
iconStyle: { |
|
borderColor: contrastColor |
|
} |
|
}, |
|
dataZoom: { |
|
borderColor: '#71708A', |
|
textStyle: { |
|
color: contrastColor |
|
}, |
|
brushStyle: { |
|
color: 'rgba(135,163,206,0.3)' |
|
}, |
|
handleStyle: { |
|
color: '#353450', |
|
borderColor: '#C5CBE3' |
|
}, |
|
moveHandleStyle: { |
|
color: '#B0B6C3', |
|
opacity: 0.3 |
|
}, |
|
fillerColor: 'rgba(135,163,206,0.2)', |
|
emphasis: { |
|
handleStyle: { |
|
borderColor: '#91B7F2', |
|
color: '#4D587D' |
|
}, |
|
moveHandleStyle: { |
|
color: '#636D9A', |
|
opacity: 0.7 |
|
} |
|
}, |
|
dataBackground: { |
|
lineStyle: { |
|
color: '#71708A', |
|
width: 1 |
|
}, |
|
areaStyle: { |
|
color: '#71708A' |
|
} |
|
}, |
|
selectedDataBackground: { |
|
lineStyle: { |
|
color: '#87A3CE' |
|
}, |
|
areaStyle: { |
|
color: '#87A3CE' |
|
} |
|
} |
|
}, |
|
visualMap: { |
|
textStyle: { |
|
color: contrastColor |
|
} |
|
}, |
|
timeline: { |
|
lineStyle: { |
|
color: contrastColor |
|
}, |
|
label: { |
|
color: contrastColor |
|
}, |
|
controlStyle: { |
|
color: contrastColor, |
|
borderColor: contrastColor |
|
} |
|
}, |
|
calendar: { |
|
itemStyle: { |
|
color: backgroundColor |
|
}, |
|
dayLabel: { |
|
color: contrastColor |
|
}, |
|
monthLabel: { |
|
color: contrastColor |
|
}, |
|
yearLabel: { |
|
color: contrastColor |
|
} |
|
}, |
|
timeAxis: axisCommon(), |
|
logAxis: axisCommon(), |
|
valueAxis: axisCommon(), |
|
categoryAxis: axisCommon(), |
|
|
|
line: { |
|
symbol: 'circle' |
|
}, |
|
graph: { |
|
color: colorPalette |
|
}, |
|
gauge: { |
|
title: { |
|
color: contrastColor |
|
} |
|
}, |
|
candlestick: { |
|
itemStyle: { |
|
color: '#FD1050', |
|
color0: '#0CF49B', |
|
borderColor: '#FD1050', |
|
borderColor0: '#0CF49B' |
|
} |
|
} |
|
}; |
|
|
|
theme.categoryAxis.splitLine.show = false; |
|
echarts.registerTheme('dark', theme); |
|
});
|
|
|