This commit is contained in:
2025-09-12 08:50:43 +08:00
3 changed files with 34 additions and 117 deletions

View File

@@ -65,7 +65,9 @@ option_1_1 = {
type: "line",
yAxisIndex: 1,
data: [],
tooltip: { valueFormatter: (v) => typeof v === "number" ? v + " 万人" : v },
tooltip: {
valueFormatter: (v) => (typeof v === "number" ? v + " 万人" : v),
},
},
],
};
@@ -100,8 +102,14 @@ option_1_2 = {
},
],
yAxis: [
{ type: "value", axisLabel: { formatter: "{value}", color: "#fff" } },
{ type: "value", axisLabel: { formatter: "{value}", color: "#fff" } },
{
type: "value",
axisLabel: { formatter: "{value}", color: "#fff" },
},
{
type: "value",
axisLabel: { formatter: "{value}", color: "#fff" },
},
],
series: [
{
@@ -137,7 +145,9 @@ option_1_2 = {
type: "line",
yAxisIndex: 1,
data: [],
tooltip: { valueFormatter: (v) => typeof v === "number" ? v + " 万人" : v },
tooltip: {
valueFormatter: (v) => (typeof v === "number" ? v + " 万人" : v),
},
},
],
};

View File

@@ -159,120 +159,27 @@ $(function () {
});
}
function echarts_3() {
function echarts_1_2() {
var myChart = echarts.init(document.getElementById("echarts01"));
option = {
grid: {
left: 0,
right: 0,
top: 40,
bottom: 0,
containLabel: true,
},
textStyle: {
color: "#fff",
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
crossStyle: { color: "#999" },
},
textStyle: { color: "#fff" },
// 1. 背景色
backgroundColor: "rgba(96,98,102,0.8)", // 半透明黑
// 2. 边框
borderColor: "rgba(255,255,255,0.3)",
borderWidth: 1,
},
legend: {
data: ["城区", "镇区", "乡村", "总入园数", "2022年基数"],
top: 0,
textStyle: { color: "#fff" },
icon: "roundRect",
itemWidth: 12,
itemHeight: 12,
},
xAxis: [
{
type: "category",
data: ["2019", "2021", "2022", "2023", "2024", "2025", "2026"],
axisPointer: { type: "shadow" },
axisLine: { lineStyle: { color: "#fff" } },
axisLabel: { color: "#fff" },
nameTextStyle: { color: "#fff" },
},
],
yAxis: [
{
type: "value",
min: 0,
max: 250,
interval: 50,
axisLabel: { formatter: "{value}", color: "#fff" },
},
{
type: "value",
min: 0,
max: 25,
interval: 5,
axisLabel: { formatter: "{value}", color: "#fff" },
},
],
series: [
{
name: "城区",
type: "bar",
tooltip: { valueFormatter: (v) => v + " 万人" },
data: [201.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6],
itemStyle: {
borderRadius: [6, 6, 0, 0],
},
},
{
name: "镇区",
type: "bar",
tooltip: { valueFormatter: (v) => v + " 万人" },
data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6],
itemStyle: {
borderRadius: [6, 6, 0, 0],
},
},
{
name: "乡村",
type: "bar",
tooltip: { valueFormatter: (v) => v + " 万人" },
data: [2.4, 5.2, 8.0, 25.4, 27.7, 73.7, 155.6],
itemStyle: {
borderRadius: [6, 6, 0, 0],
},
},
{
name: "总入园数",
type: "line",
yAxisIndex: 1,
tooltip: { valueFormatter: (v) => v + " 万人" },
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3],
},
// 2. 新增折线
{
name: "2022年基数",
type: "line",
yAxisIndex: 1,
tooltip: { valueFormatter: (v) => v + " 万人" },
// 3. 数据整体 +0.8
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3].map((v) =>
(v + 0.8).toFixed(1)
),
},
],
};
myChart.setOption(option);
$.ajax({
type: "GET",
async: false,
dataType: "json",
url: "/RuYuanZaiYuan/school/preschool/inschool/chart",
success: function (res) {
option_1_2.xAxis[0].data = res.xAxis_data;
option_1_2.series[0].data = res.series_data_0;
option_1_2.series[1].data = res.series_data_1;
option_1_2.series[2].data = res.series_data_2;
option_1_2.series[3].data = res.series_data_3;
option_1_2.series[4].data = res.series_data_4;
myChart.setOption(option_1_2);
window.addEventListener("resize", function () {
myChart.resize();
});
},
});
}
$(".tab-item").click(function () {
@@ -288,7 +195,7 @@ $(function () {
echarts_1_1();
break;
case "在园数":
echarts_3();
echarts_1_2();
break;
}
});