Add stock dividend trend analysis page with chart rendering and data fetching

2025-09-02 12:41:09 +08:00
parent 4b3a51083b
commit 521e0687a4
10 changed files with 1563 additions and 20 deletions
@@ -0,0 +1,123 @@
+<?php
+include_once "inc/getBasic.inc.php";
+$_REQUEST['ts_code']=$_REQUEST['ts_code']?$_REQUEST['ts_code']:'000001';
+$_REQUEST['t_start']=$_REQUEST['t_start']?$_REQUEST['t_start']:'2020-01-01';
+$_REQUEST['t_end']=$_REQUEST['t_end']?$_REQUEST['t_end']:date('Y-m-d');
+$ts_name = tscodeToName(ts_code_conv($_REQUEST['ts_code']));
+$title="股息率趋势:".$ts_name.'('.$_REQUEST['ts_code'].')';
+include_once "html/head.php";
+?>
+<script src="js/renderCharts.js?version=1.0"></script>
+<form name="main" id="main" method="get"> <div style="width:100%;text-align:center">
+股票代码: <input type='text' name='ts_code' id='ts_code' width="30px" value='<?=$_REQUEST['ts_code']?>' >
+开始时间: <input type='date' name='t_start' id='t_start' width='30px' value='<?=$_REQUEST['t_start']?>' >
+结束时间: <input type='date' name='t_end' id='t_end' width='30px' value='<?=$_REQUEST['t_end']?>' >
+ <button id="submitBtn" class="btn-submit"><span>查询数据</span></button>
+<div >&nbsp;</div>
+
+</div> </form>
+<div style="margin:0 auto;clear:both;left:100px;width:1000px;height:30px;text-align:left"><span style="color:grey">股息率=100*TTM每股派息/股价。如：股息率=3表示每股派息3%</span></div>
+ <!-- 图表容器 -->
+  <div id="container" style="width: 1000px;height:400px; margin: 0 auto 20px;">
+        <div class="loading-overlay" id="loadingOverlay">
+            <div class="spinner"></div>
+            <p style="font-size:18px; color:#2c3e50;">正在加载数据，请稍候...</p>
+        </div>
+
+    </div>
+</div>
+
+<script>
+    // 页面加载时初始化图表
+    $(document).ready(function() {
+  
+        // 加载初始数据
+        loadChartData();
+        
+        // 绑定按钮点击事件
+        $('#submitBtn').click(function(e) {
+            //e.preventDefault(); // 阻止表单提交刷新页面
+            $('#loadingOverlay').addClass('active');
+            loadChartData();
+            $('#loadingOverlay').removeClass('active');
+        });
+    });
+
+    // 加载图表数据的函数
+    function loadChartData() {
+        // 显示加载动画
+        $('#loadingOverlay').addClass('active');
+
+        let t_start = $('#t_start').val();
+        let t_end = $('#t_end').val();
+        let ts_code = $("#ts_code").val();
+
+        url =   "https://api.doorcome.cn/api/getdiv/?tscode="+ts_code;
+        url +=  "&start_date="+t_start+"&end_date="+t_end;
+        Promise.all([
+            fetch(url)
+            ])
+            .then(responses => Promise.all(responses.map(r => r.json())))
+            .then(([parsedData]) => {
+                var params = {};
+                params.chartid='container';
+                params.legend = [ts_code,'股息率','每股股息'];
+                params.text = params.legend[0]+' V.S '+params.legend[1];
+                params.data1 = pickData(parsedData, 'trade_date', 'close');
+                params.data2 = pickData(parsedData, 'trade_date', 'div_yield');
+                params.data3 = pickData(parsedData, 'trade_date', 'cash_div_tax',fixed=3);
+                params.data3 = params.data3.map(item => {
+                    let value = item.value[1];
+                    // 将字符串转为数字，并判断是否等于 0
+                    if (parseFloat(value) === 0) {
+                        return [item[0], null]; 
+                    } else {
+                        return item; // 非零值保持不变
+                    }
+                });
+                console.log(params.data3);
+                dataCal = calculateStats(params.data2);
+                params.sub_text = "TTM 股息 Max:"+dataCal['max'];
+                params.sub_text += ",  Min:"+dataCal['min'];
+                params.sub_text += ",  Average:"+dataCal['avg'];
+                params.sub_text += ",  Recent:"+dataCal['last'];
+                var myChart = doubleLineChart(params);
+                // 👇 动态添加第三条线，使用副Y轴（yAxisIndex: 1）
+                myChart.setOption({
+                     yAxis: [
+                            { // 主Y轴配置
+                                type: 'value'
+                            },
+                            { // 副Y轴配置
+                                type: 'value',
+                                name: '股息率/股息',
+                                position: 'right'
+                            }
+                        ],
+                    series: [
+                        // 前两个 series 保持不变（ECharts 会合并）
+                        {}, // 占位：对应第一个 series
+                        {}, // 占位：对应第二个 series
+                        {
+                            name: '每股股息',
+                            type: 'scatter',
+                            yAxisIndex:1,
+                            symbolSize: 10,
+                            smooth:false,
+                            data:params.data3
+                        }
+                    ]
+                });
+
+            })
+            .catch(error => console.error('数据加载失败:', error))
+            .finally(() => {
+                // 隐藏加载动画
+                $('#loadingOverlay').removeClass('active');
+            });
+    }
+</script>
+
+</div>
+<?php include_once "html/footer.php"; ?>
+