const rootStyles = getComputedStyle(document.documentElement);
const color = ["#8ec5ff", "#2b7fff", "#1d6ed4", "#155ab6", "#0f4c8a"];
const waitForECharts = () => {
	if (typeof echarts !== "undefined") {
		console.log("ECharts is loaded");
		echarts.registerTheme("shadcn", {
			seriesCnt: "5",
			backgroundColor: "rgba(0,0,0,0)",
			titleColor: "#0a0a0a",
			subtitleColor: "#737373",
			textColorShow: false,
			textColor: "#333",
			textStyle: {
				fontFamily: "Geist",
			},
			markTextColor: "#ffffff",
			color: color,
			borderColor: "#e5e5e5",
			borderWidth: 0,
			visualMapColor: [
				"#09090b",
				"#18181b",
				"#27272a",
				"#3f3f46",
				"#52525b",
				"#71717a",
				"#a1a1aa",
				"#d4d4d8",
				"#e4e4e7",
				"#f4f4f5",
				"#fafafa",
			],
			legendTextColor: "#0a0a0a",
			kColor: "#eb5454",
			kColor0: "#47b262",
			kBorderColor: "#eb5454",
			kBorderColor0: "#47b262",
			kBorderWidth: 1,
			lineWidth: 2,
			symbolSize: 4,
			symbol: "emptyCircle",
			symbolBorderWidth: 1,
			lineSmooth: true,
			graphLineWidth: 1,
			graphLineColor: "#aaaaaa",
			mapLabelColor: "#000",
			mapLabelColorE: "rgb(100,0,0)",
			mapBorderColor: "#444",
			mapBorderColorE: "#444",
			mapBorderWidth: 0.5,
			mapBorderWidthE: 1,
			mapAreaColor: "#eee",
			mapAreaColorE: "rgba(255,215,0,0.8)",
			axes: [
				{
					type: "all",
					name: "通用坐标轴",
					axisLineShow: true,
					axisLineColor: "#6E7079",
					axisTickShow: true,
					axisTickColor: "#6E7079",
					axisLabelShow: true,
					axisLabelColor: "#6E7079",
					splitLineShow: true,
					splitLineColor: ["#E0E6F1"],
					splitAreaShow: false,
					splitAreaColor: ["rgba(250,250,250,0.2)", "rgba(210,219,238,0.2)"],
				},
				{
					type: "category",
					name: "类目坐标轴",
					axisLineShow: true,
					axisLineColor: "#6e7079",
					axisTickShow: true,
					axisTickColor: "#6e7079",
					axisLabelShow: true,
					axisLabelColor: "#6e7079",
					splitLineShow: false,
					splitLineColor: ["#E0E6F1"],
					splitAreaShow: false,
					splitAreaColor: ["rgba(250,250,250,0.2)", "rgba(210,219,238,0.2)"],
				},
				{
					type: "value",
					name: "数值坐标轴",
					axisLineShow: false,
					axisLineColor: "#6e7079",
					axisTickShow: false,
					axisTickColor: "#6e7079",
					axisLabelShow: true,
					axisLabelColor: "#6e7079",
					splitLineShow: true,
					splitLineColor: ["#E0E6F1"],
					splitAreaShow: false,
					splitAreaColor: ["rgba(250,250,250,0.2)", "rgba(210,219,238,0.2)"],
				},
				{
					type: "log",
					name: "对数坐标轴",
					axisLineShow: false,
					axisLineColor: "#6e7079",
					axisTickShow: false,
					axisTickColor: "#6e7079",
					axisLabelShow: true,
					axisLabelColor: "#6e7079",
					splitLineShow: true,
					splitLineColor: ["#E0E6F1"],
					splitAreaShow: false,
					splitAreaColor: ["rgba(250,250,250,0.2)", "rgba(210,219,238,0.2)"],
				},
				{
					type: "time",
					name: "时间坐标轴",
					axisLineShow: true,
					axisLineColor: "#6e7079",
					axisTickShow: true,
					axisTickColor: "#6e7079",
					axisLabelShow: true,
					axisLabelColor: "#6e7079",
					splitLineShow: false,
					splitLineColor: ["#E0E6F1"],
					splitAreaShow: false,
					splitAreaColor: ["rgba(250,250,250,0.2)", "rgba(210,219,238,0.2)"],
				},
			],
			axisSeperateSetting: true,
			toolboxColor: "#999999",
			toolboxEmphasisColor: "#666666",
			tooltipAxisColor: "#cccccc",
			tooltipAxisWidth: 1,
			timelineLineColor: "#e5e5e5",
			timelineLineWidth: 2,
			timelineItemColor: "#e5e5e5",
			timelineItemColorE: "#ffffff",
			timelineCheckColor: "#171717",
			timelineCheckBorderColor: "#ffffff",
			timelineItemBorderWidth: 1,
			timelineControlColor: "#737373",
			timelineControlBorderColor: "#171717",
			timelineControlBorderWidth: "0.0",
			timelineLabelColor: "#737373",
		});
	} else {
		setTimeout(waitForECharts, 300);
	}
};

waitForECharts();
