diff --git a/web/OJ/template/hznu/daliy_detail.php b/web/OJ/template/hznu/daliy_detail.php
index d11e3ea4..e8bef664 100644
--- a/web/OJ/template/hznu/daliy_detail.php
+++ b/web/OJ/template/hznu/daliy_detail.php
@@ -127,4 +127,4 @@ function getDaliyDetailData(lastday, today, alldata) {
   }
 
   window.addEventListener('resize', myChart.resize);
-</script>
\ No newline at end of file
+</script>
diff --git a/web/OJ/template/hznu/study_detail.php b/web/OJ/template/hznu/study_detail.php
index 688f9673..a193b67d 100644
--- a/web/OJ/template/hznu/study_detail.php
+++ b/web/OJ/template/hznu/study_detail.php
@@ -2,100 +2,26 @@
 
 require_once("header.php");
 
-require_once("study_detail_data.php");
 ?>
 
-<?php
-$user = $_GET['user'];
-if (!is_valid_user_name($user)) {
-  echo "No such User!";
-  exit(0);
-}
-
-$studydata = array();
-$studydata = array_fill_keys($studytags, 0);
-//studydata['xx']=0;
-
-$sql = "SELECT pt.tag, COUNT(DISTINCT s.problem_id) as count
-        FROM solution s
-        JOIN problem_tag pt ON s.problem_id = pt.problem_id
-        WHERE s.user_id = '$user' AND s.result = 4 AND pt.tag IN ('" . implode("', '", $studytags) . "')
-        GROUP BY pt.tag;";
-$result = $mysqli->query($sql);
-
-while ($row = $result->fetch_assoc()) {
-  $studydata[$row['tag']] = $row['count'];
-}
-
-$result->free();
-
-
-///////////////////////////////////////////////////////////////////////////////cs
-// if($user == "admin")
-//   foreach ($studytags as $tag)
-//     $studydata[$tag] = 1;
-
-///////////////////////////////////////////////////////////////////////////////cs
-
-//此处修改层次颜色
-$color = ['#cccccc', '#d0f0c0', '#aadf8f', '#85c96e'];
-
-$neednum = array();
-$neednum = array_fill_keys($studytags, [0, 1, 2, 4]);
-//neednum['xx'] = [0, 1, 2, 4];
-
-
-foreach ($studytags3 as $tag) {
-  $studydata[$tagfa[$tag]] = 0;
-  $neednum[$tagfa[$tag]] = [0, 0, 0, 0];
-}
-foreach ($studytags2 as $tag) {
-  $studydata[$tagfa[$tag]] = 0;
-  $neednum[$tagfa[$tag]] = [0, 0, 0, 0];
-}
-
-foreach ($studytags3 as $tag) {
-  $studydata[$tagfa[$tag]] += $studydata[$tag];
-  $counts = $neednum[$tag];
-  for ($i = 0; $i < count($counts); $i++) {
-    $neednum[$tagfa[$tag]][$i] += $counts[$i];
-  }
-}
-foreach ($studytags2 as $tag) {
-  $studydata[$tagfa[$tag]] += $studydata[$tag];
-  $counts = $neednum[$tag];
-  for ($i = 0; $i < count($counts); $i++) {
-    $neednum[$tagfa[$tag]][$i] += $counts[$i];
+<style>
+  html {
+    width: 100%;
+    height: 100%;
   }
-}
 
-
-$nowcolor = array();
-
-foreach ($studytags as $tag) {
-  for ($i = 3; $i >= 0; $i--) {
-    if ($studydata[$tag] >= $neednum[$tag][$i]) {
-      $nowcolor[$tag] = $color[$i];
-      break;
-    }
+  body {
+    width: 100%;
+    height: 100%;
   }
-}
-
-?>
-
-<style>
 </style>
 
-<div class="am-g" style="margin-top: 0px;">
-  <div class="am-u-sm-12" style="justify-content: center;">
-    <div id="main" style="width: 3100px;height: 700px;"></div>
+<div class="am-g" style="width:85%;height:78%">
+  <div class="am-u-sm-12" style="justify-content: center;width: 100%;height: 100%;">
+    <div id="main" style="width: 100%;height: 100%;"></div>
   </div>
 </div>
 
-<?php
-require_once("footer.php");
-?>
-
 <div class="am-modal am-modal-no-btn" tabindex="-1" id="modal-study">
   <div class="am-modal-dialog" style="font-size: 20px; width:30%; border-radius: 20px" tabindex="-1" id="modal-study">
 
@@ -117,9 +43,11 @@
   </div>
 </div>
 
-<?php require_once("footer.php") ?>
+<?php
+require_once("footer.php");
+?>
 
-<script src="../../plugins/echarts/echarts.min.5.4.js"></script>
+<script src="plugins/echarts/echarts.min.5.4.js"></script>
 <script type="text/javascript">
   var chartDom = document.getElementById('main');
   var width = chartDom.offsetWidth;
@@ -127,9 +55,23 @@
   var myChart = echarts.init(chartDom);
   var option;
 
-  var studydata = <?php echo json_encode($studydata); ?>;
+  var studydata = <?php echo json_encode($studydata);  ?>;
   var neednum = <?php echo json_encode($neednum); ?>;
 
+  var updatedData = [];
+  <?php
+  $maxX = max(array_column($pointposition, 'x')) - 150;
+  $maxY = max(array_column($pointposition, 'y'));
+
+  foreach ($pointposition as $tag => $position) {
+    $relativeX = $position['x'] / $maxX;
+    $relativeY = $position['y'] / $maxY;
+
+    echo "updatedData.push({name: '" . $tag . "', x: " . $relativeX . " * width, y: " . $relativeY .
+      " * height, symbol:'circle', symbolSize: 50, itemStyle: {color:'" . $nowcolor[$tag] . "'}});";
+  }
+  ?>
+
   option = {
     title: {
       text: '学习里程碑',
@@ -160,62 +102,44 @@
       type: 'graph',
       layout: 'none',
       symbol: "roundRect",
-      symbolSize: 70,
+      symbolSize: 50,
       roam: false,
       label: {
         show: true,
-        fontSize: 12
+        fontSize: 10
       },
-      edgeSymbolSize: [0, 14],
+      edgeSymbolSize: [0, 10],
       edgeLabel: {
         fontSize: 30
       },
       categories: [{
         name: 'Newbie',
         itemStyle: {
-          color: '#cccccc',
+          color: '<?php echo $pointcolor[0]; ?>',
         }
       }, {
         name: 'Learner',
         itemStyle: {
-          color: '#d0f0c0'
+          color: '<?php echo $pointcolor[1]; ?>',
         }
       }, {
         name: 'Expert',
         itemStyle: {
-          color: '#aadf8f'
+          color: '<?php echo $pointcolor[2]; ?>',
         }
       }, {
         name: 'Master',
         itemStyle: {
-          color: '#85c96e'
+          color: '<?php echo $pointcolor[3]; ?>',
         }
       }],
-      data: [
-        <?php
-        $count = 0;
-        foreach ($pointposition as $tag => $position) {
-          if ($count < 8) { //前八个方形
-            echo "{name: '" . $tag . "',x: " . $position['x'] . ",y: " . $position['y'] .
-              ",itemStyle: {color:'" . $nowcolor[$tag] . "' }},";
-          } else {
-            echo "{name: '" . $tag . "',x: " . $position['x'] . ",y: " . $position['y'] .
-              ", symbol:'circle', symbolSize: 70, itemStyle: {color:'" . $nowcolor[$tag] . "'}},";
-          }
-          $count++;
-        }
-        foreach ($breakpoint as $tag => $position) {
-          echo "{name: '" . $tag . "',x: " . $position['x'] . ",y: " . $position['y'] .
-            ", symbol:'circle', symbolSize: 0, tooltip: { show: false }, label: {show: false}},";
-        }
-        ?>
-      ],
+      data: updatedData,
       links: links,
       lineStyle: {
         opacity: 0.9,
-        width: 3,
-        curveness: 0,
-        color: '#996633'
+        width: 2,
+        curveness: 0.1,
+        color: '#ffbc61'
       }
     }, ]
   };
@@ -224,13 +148,22 @@
 
   myChart.on('click', function(params) {
 
-    if (params.dataType === 'node' && params.data.name[0] != 'b') {
+    if (fatarray.includes(params.data.name)) {
+      var dataIndex = params.dataIndex;
+      // 收起或展开节点
+      myChart.dispatchAction({
+        type: params.data.collapsed ? 'expand' : 'collapse',
+        seriesIndex: 0,
+        dataIndex: dataIndex
+      });
+    } else {
+
       // 获取被点击的标签
       var tag = params.data.name;
 
       // 发送 AJAX 请求
       $.ajax({
-        url: 'getstudyproblems.php',
+        url: './template/hznu/getstudyproblems.php',
         type: 'POST',
         data: {
           user: '<?php echo $user; ?>',
@@ -266,14 +199,6 @@
             else if (score <= 80) colorClass = 'am-badge-warning';
             else colorClass = 'am-badge-danger';
 
-            /////////////////////////////////cs
-            // if (index <= 2) colorClass = 'am-badge-success';
-            // else if (index <= 4) colorClass = 'am-badge-secondary';
-            // else if (index <= 6) colorClass = 'am-badge-primary';
-            // else if (index <= 8) colorClass = 'am-badge-warning';
-            // else colorClass = 'am-badge-danger';
-            //////////////////////////////////cs
-
             return '<span class="am-badge ' + colorClass + ' am-round">' +
               '<a href="/OJ/problem.php?id=' + problem.id + '" style="color: white;">' + problem.id + '</a></span>';
           });
diff --git a/web/OJ/template/hznu/study_detail_data.php b/web/OJ/template/hznu/study_detail_data.php
deleted file mode 100644
index 579411c1..00000000
--- a/web/OJ/template/hznu/study_detail_data.php
+++ /dev/null
@@ -1,425 +0,0 @@
-<?php
-
-$studytags = [
-  'HelloWorld!', '基础数据类型', '运算符', '控制结构', '函数', '指针', '结构体', '数组',
-
-  '基础输入输出', '转义字符', '整型', '浮点型', '字符型', '算术运算', '逻辑运算', '二进制运算',
-  '函数指针', '指针数组', '指针基础', '结构体数组', '结构体基础', '递归函数', '内置函数', '自定义函数', '函数基础',
-  '一维数组', '字符串', '二维数组', '找最值', '排序', '二分',
-  '顺序结构', '选择结构', '循环结构', '科学计算', '单分支', '多分支', '多重循环', '迭代', '枚举'
-];
-
-
-//三级tag
-$studytags1 = [
-  'HelloWorld!', '基础数据类型', '运算符', '控制结构', '函数', '指针', '结构体', '数组'
-];
-$studytags2 = [
-  '基础输入输出', '转义字符', '整型', '浮点型', '字符型', '算术运算', '逻辑运算', '二进制运算',
-  '函数指针', '指针数组', '指针基础', '结构体数组', '结构体基础', '递归函数', '内置函数', '自定义函数', '函数基础',
-  '一维数组', '字符串', '二维数组', '顺序结构', '选择结构', '循环结构',
-];
-$studytags3 = [
-  '找最值', '排序', '二分', '科学计算', '单分支', '多分支', '多重循环', '迭代', '枚举'
-];
-
-$fatarray = [
-  'HelloWorld!', '基础数据类型', '运算符', '控制结构', '函数', '指针', '结构体', '数组', '一维数组', '顺序结构', '选择结构', '循环结构',
-];
-
-$tagfa['找最值'] = '一维数组';
-$tagfa['排序'] = '一维数组';
-$tagfa['二分'] = '一维数组';
-$tagfa['科学计算'] = '顺序结构';
-$tagfa['单分支'] = '选择结构';
-$tagfa['多分支'] = '选择结构';
-$tagfa['多重循环'] = '循环结构';
-$tagfa['迭代'] = '循环结构';
-$tagfa['枚举'] = '循环结构';
-
-$tagfa['基础输入输出'] = 'HelloWorld!';
-$tagfa['转义字符'] = 'HelloWorld!';
-$tagfa['整型'] = '基础数据类型';
-$tagfa['浮点型'] = '基础数据类型';
-$tagfa['字符型'] = '基础数据类型';
-$tagfa['算术运算'] = '运算符';
-$tagfa['逻辑运算'] = '运算符';
-$tagfa['二进制运算'] = '运算符';
-$tagfa['函数基础'] = '函数';
-$tagfa['自定义函数'] = '函数';
-$tagfa['内置函数'] = '函数';
-$tagfa['递归函数'] = '函数';
-$tagfa['函数指针'] = '指针';
-$tagfa['指针数组'] = '指针';
-$tagfa['指针基础'] = '指针';
-$tagfa['顺序结构'] = '控制结构';
-$tagfa['选择结构'] = '控制结构';
-$tagfa['循环结构'] = '控制结构';
-$tagfa['结构体基础'] = '结构体';
-$tagfa['结构体数组'] = '结构体';
-$tagfa['一维数组'] = '数组';
-$tagfa['字符串'] = '数组';
-$tagfa['二维数组'] = '数组';
-
-
-$pointposition = [
-  'HelloWorld!' => ['x' => 200, 'y' => 480],
-  '基础数据类型' => ['x' => 403, 'y' => 430],
-  '运算符' => ['x' => 530, 'y' => 225],
-  '控制结构' => ['x' => 520, 'y' => 600],
-  '函数' => ['x' => 740, 'y' => 640],
-  '指针' => ['x' => 693, 'y' => 257],
-  '结构体' => ['x' => 803, 'y' => 365],
-  '数组' => ['x' => 780, 'y' => 515],
-
-  '基础输入输出' => ['x' => 343, 'y' => 590],
-  '转义字符' => ['x' => 308, 'y' => 670],
-
-  '整型' => ['x' => 285, 'y' => 270],
-  '浮点型' => ['x' => 321, 'y' => 200],
-  '字符型' => ['x' => 403, 'y' => 250],
-
-  '算术运算' => ['x' => 383, 'y' => 100],
-  '逻辑运算' => ['x' => 483, 'y' => 120],
-  '二进制运算' => ['x' => 553, 'y' => 105],
-
-  '指针基础' => ['x' => 648, 'y' => 120],
-  '指针数组' => ['x' => 753, 'y' => 60],
-  '函数指针' => ['x' => 823, 'y' => 130],
-
-  '结构体基础' => ['x' => 993, 'y' => 160],
-  '结构体数组' => ['x' => 1075, 'y' => 290],
-
-  '一维数组' => ['x' => 884, 'y' => 480],
-  '字符串' => ['x' => 957, 'y' => 670],
-  '二维数组' => ['x' => 945, 'y' => 805],
-  '找最值' => ['x' => 976, 'y' => 405],
-  '排序' => ['x' => 1058, 'y' => 505],
-  '二分' => ['x' => 1008, 'y' => 565],
-
-  '函数基础' => ['x' => 820, 'y' => 752],
-  '自定义函数' => ['x' => 760, 'y' => 756],
-  '内置函数' => ['x' => 700, 'y' => 820],
-  '递归函数' => ['x' => 650, 'y' => 720],
-
-  '顺序结构' => ['x' => 368, 'y' => 705],
-  '选择结构' => ['x' => 448, 'y' => 743],
-  '循环结构' => ['x' => 523, 'y' => 735],
-
-  '科学计算' => ['x' => 280, 'y' => 770],
-  '单分支' => ['x' => 366, 'y' => 843],
-  '多分支' => ['x' => 414, 'y' => 850],
-  '多重循环' => ['x' => 488, 'y' => 850],
-  '迭代' => ['x' => 541, 'y' => 830],
-  '枚举' => ['x' => 600, 'y' => 855],
-];
-
-?>
-
-
-<script>
-  // var buscolor = '#F59A23';
-  var fatarray = [
-    'HelloWorld!', '基础数据类型', '运算符', '控制结构', '函数', '指针', '结构体', '数组', '一维数组', '顺序结构', '选择结构', '循环结构',
-  ];
-
-  var links = [{ ///////////hello
-      source: 'HelloWorld!',
-      target: '基础输入输出',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: 'HelloWorld!',
-      target: '转义字符',
-      tooltip: {
-        show: false
-      }
-    }, ///////////基础数据类型
-    {
-      source: '基础数据类型',
-      target: '整型',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '基础数据类型',
-      target: '字符型',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '基础数据类型',
-      target: '浮点型',
-      tooltip: {
-        show: false
-      }
-    }, ///////////运算符
-    {
-      source: '运算符',
-      target: '二进制运算',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '运算符',
-      target: '算术运算',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '运算符',
-      target: '逻辑运算',
-      tooltip: {
-        show: false
-      }
-    }, ///////////指针
-    {
-      source: '指针',
-      target: '指针基础',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '指针',
-      target: '指针数组',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '指针',
-      target: '函数指针',
-      tooltip: {
-        show: false
-      }
-    }, ///////////结构体
-    {
-      source: '结构体',
-      target: '结构体基础',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '结构体',
-      target: '结构体数组',
-      tooltip: {
-        show: false
-      }
-    }, ///////////数组
-    {
-      source: '数组',
-      target: '一维数组',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '数组',
-      target: '字符串',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '数组',
-      target: '二维数组',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '一维数组',
-      target: '找最值',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '一维数组',
-      target: '排序',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '一维数组',
-      target: '二分',
-      tooltip: {
-        show: false
-      }
-    }, ///////////函数
-    {
-      source: '函数',
-      target: '函数基础',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '函数',
-      target: '自定义函数',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '函数',
-      target: '内置函数',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '函数',
-      target: '递归函数',
-      tooltip: {
-        show: false
-      }
-    }, ///////////控制结构
-    {
-      source: '控制结构',
-      target: '顺序结构',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '控制结构',
-      target: '选择结构',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '控制结构',
-      target: '循环结构',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '顺序结构',
-      target: '科学计算',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '选择结构',
-      target: '单分支',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '选择结构',
-      target: '多分支',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '循环结构',
-      target: '多重循环',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '循环结构',
-      target: '迭代',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '循环结构',
-      target: '枚举',
-      tooltip: {
-        show: false
-      }
-    },
-    ///////////////////////
-
-    {
-      source: '基础数据类型',
-      target: '运算符',
-      tooltip: {
-        show: false
-      },
-    },
-    {
-      source: '基础数据类型',
-      target: '指针',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '基础数据类型',
-      target: '结构体',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '基础数据类型',
-      target: '数组',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: 'HelloWorld!',
-      target: '控制结构',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: 'HelloWorld!',
-      target: '基础数据类型',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '控制结构',
-      target: '数组',
-      tooltip: {
-        show: false
-      }
-    },
-    {
-      source: '控制结构',
-      target: '函数',
-      tooltip: {
-        show: false
-      }
-    },
-  ];
-  var additionalProperties = {
-    lineStyle: {
-      opacity: 0.9,
-      width: 2.5,
-      curveness: 0.1,
-      color: '#31b6f9'
-    },
-    symbol: ['circle', 'arrow']
-  };
-
-  // 从后向前遍历数组，添加属性
-  for (var i = links.length - 1; i >= links.length - 8; i--) {
-    if (links[i]) {
-      Object.assign(links[i], additionalProperties);
-    }
-  }
-</script>
diff --git a/web/OJ/template/hznu/userinfo.php b/web/OJ/template/hznu/userinfo.php
index 5ab14550..9dd705f1 100644
--- a/web/OJ/template/hznu/userinfo.php
+++ b/web/OJ/template/hznu/userinfo.php
@@ -177,12 +177,12 @@
   <div class="am-g" style="margin-top: 30px;">
     <div class="am-u-sm-12 am-text-center">
       <div class="am-u-sm-6">
-        <a href="./template/hznu/daliy_detail.php?user=<?php echo $user; ?>">
+        <a href="./daliy_detail.php?user=<?php echo $user;?>">
           <button class="loading-btn">点击查看每日做题详情</button>
         </a>
       </div>
       <div class="am-u-sm-6">
-        <a href="./template/hznu/study_detail.php?user=<?php echo $user; ?>">
+        <a href="./study_detail.php?user=<?php echo $user;?>">
           <button class="loading-btn">点击查看学习里程碑</button>
         </a>
       </div>