106 lines
2.8 KiB
JavaScript
106 lines
2.8 KiB
JavaScript
const defaultTheme = function () {
|
|
const { SolidLine, SolidFill, ColorCSS, Themes, emptyLine, customTheme } =
|
|
lcjs;
|
|
var themeStyles = {};
|
|
var baseTheme = Themes.darkGold;
|
|
baseTheme.themeKey = "baseTheme";
|
|
|
|
const baseBgColor = "#000";
|
|
const baseLineColor = "#FFF";
|
|
const textColor = "#FFF";
|
|
const lineColor = "#FFF";
|
|
const tickLineColor = "#FFF";
|
|
const axisLineColor = "#FFF";
|
|
// 刻度面板颜色
|
|
const panelBackgroundFillStyle = new SolidFill({
|
|
color: ColorCSS(baseBgColor), //#120453
|
|
});
|
|
|
|
// 主要面板颜色
|
|
const seriesBackgroundFillStyle = new SolidFill({
|
|
color: ColorCSS(baseBgColor),
|
|
});
|
|
//设置x轴的样式
|
|
function SetTickStyle(tick) {
|
|
return tick.setLabelFont((font) =>
|
|
font
|
|
.setWeight("normal")
|
|
.setSize(5)
|
|
.setStyle("normal")
|
|
.setFamily("Arial")
|
|
.setVariant(true)
|
|
)
|
|
.setLabelFillStyle(
|
|
//new SolidFill({ color: ColorCSS("#9dbdd2") })
|
|
new SolidFill({ color: ColorCSS(textColor) })
|
|
)
|
|
.setGridStrokeStyle(
|
|
new SolidLine({
|
|
thickness: .25,
|
|
fillStyle: new SolidFill({
|
|
color: ColorCSS(baseLineColor),
|
|
}),
|
|
})
|
|
)
|
|
// 刻度线内间距
|
|
.setTickPadding(-2)
|
|
// 刻度线 长度
|
|
.setTickLength(0)
|
|
// 刻度线 样式 非文本 , 受 setTickLength 影响
|
|
.setTickStyle(
|
|
new SolidLine({
|
|
thickness: .5,
|
|
fillStyle: new SolidFill({
|
|
color: ColorCSS(tickLineColor),
|
|
}),
|
|
})
|
|
)
|
|
}
|
|
|
|
// 数字轴的策略
|
|
const numericTickStrategy = baseTheme.numericTickStrategy
|
|
.setMinorTickStyle((ticks) =>SetTickStyle(ticks))
|
|
.setMajorTickStyle((ticks) =>SetTickStyle(ticks));
|
|
// 图标标题文本颜色
|
|
const chartTitleFillStyle = new SolidFill({
|
|
color: ColorCSS(textColor),
|
|
});
|
|
// 轴标题文本颜色
|
|
const axisTitleFillStyle = new SolidFill({
|
|
color: ColorCSS(textColor),
|
|
});
|
|
// UI元素文本颜色
|
|
const uiTextFillStyle = new SolidFill({
|
|
color: ColorCSS(textColor),
|
|
});
|
|
// 轴样式
|
|
const axisStyle = new SolidLine({
|
|
thickness: 1,
|
|
fillStyle: new SolidFill({ color: ColorCSS(axisLineColor) }),
|
|
}); //lcjs.emptyLine;//
|
|
|
|
const chartXYZoomingRectangleFillStyle = new SolidFill({
|
|
color: ColorCSS("#00FF0A66"),
|
|
});
|
|
const chartXYFittingRectangleFillStyle = new SolidFill({
|
|
color: ColorCSS("#CCCCCC55"),
|
|
});
|
|
const chartXYZoomingRectangleStrokeStyle = emptyLine;
|
|
const chartXYFittingRectangleStrokeStyle = emptyLine;
|
|
|
|
Object.assign(baseTheme, themeStyles, {
|
|
panelBackgroundFillStyle,
|
|
seriesBackgroundFillStyle,
|
|
numericTickStrategy,
|
|
chartTitleFillStyle,
|
|
axisTitleFillStyle,
|
|
uiTextFillStyle,
|
|
axisStyle,
|
|
chartXYZoomingRectangleFillStyle,
|
|
chartXYFittingRectangleFillStyle,
|
|
chartXYZoomingRectangleStrokeStyle,
|
|
chartXYFittingRectangleStrokeStyle,
|
|
});
|
|
};
|
|
defaultTheme();
|