基金实时估值系统


由于目前各大基金网站下架了 ' 重仓涨幅 ' ' 实时估值 ' 功能,那可以自己使用公开的免费数据接口做一个放自己电脑上,有服务器的可以部署到服务器上。


1. 项目简介

本项目是一个轻量级的 Web 端基金追踪工具。旨在解决下架了'重仓涨幅'和'实时估值'功能,通过后端实时抓取基金重仓股数据,计算盘中实时估值,并提供基础的自选基金管理功能。

项目页面显示:

2. 技术栈

  • 前端:原生 HTML5 / CSS3 / JavaScript (ES6+)。无第三方框架依赖。
  • 后端:PHP (负责数据转发、跨域处理、逻辑计算)。
  • 数据库:SQLite (单文件数据库,存储用户自选列表)。
  • 数据源:通过 PHP cURL 代理转发公开的接口数据。

3. 功能模块

3.1 市场风向监控

  • 功能:首页顶部展示"中证500"和"沪深300"两大核心指数的实时涨跌幅。
  • 实现:前端每 30 秒轮询后端接口,后端抓取指数接口,解析后返回涨跌百分比。

3.2 基金搜索与详情

  • 功能 :通过基金代码搜索基金。展示基金名称、昨日涨跌、今日实时估值、持仓数据更新日期。
  • 实现:前端发送搜索请求 -> 后端调用公开接口获取基金基础信息及持仓股票信息 -> 后端计算后返回统一 JSON 结构。

3.3 实时估值 ( 简单估值 )

  • 功能:在交易盘中实时计算基金的预估涨跌幅,并统计重仓股的上涨/下跌/平盘家数(如 7↑ | 3↓)。
  • 实现:详见下方"5. 估值计算逻辑"。

3.4 自选管理

  • 功能
    • 添加自选:将搜索到的基金加入关注列表。
    • 删除自选:从列表中移除基金,删除时弹出二次确认框。
    • 列表展示:加载页面时自动获取所有自选基金的最新实时数据。
  • 实现:利用 SQLite 数据库的 favorites 表存储基金代码。操作通过 PHP 的 PDO 扩展执行 SQL 语句(INSERT / DELETE / SELECT)。

3.5 交互与适配

  • 功能:界面自动适配 PC 端(表格视图)和 移动端(卡片视图)。
  • 实现
    • UI 组件:自定义封装的 Modal 模态框(替代原生 alert/confirm),支持 Promise 调用链。
    • 响应式布局:CSS Media Queries (@media (max-width: 768px)) 控制不同设备下的 DOM 排列。

4. 系统架构与 API 设计

系统采用前后端分离模式,所有数据交互通过 api.php 完成。

API 接口定义

入口文件:api.php,参数通过 GET 请求的 action 字段区分。

Action 参数 描述
get_indices 获取大盘指数数据 (JSON)
search code 搜索单只基金详情及实时估值
list_favorites 获取所有自选基金的实时列表
add code 添加基金到数据库
delete code 从数据库移除基金

5. 估值计算逻辑

本项目通过加权平均法计算盘中实时估值。

5.1 计算原理

基金的涨跌幅主要由其持仓股票的涨跌决定。系统获取该基金前十大重仓股的实时涨跌幅持仓占比,进行加权求和。

5.2 计算公式

5.3 代码实现步骤 (PHP)

  1. 获取持仓数据:请求接口获得数据。
  2. 遍历重仓股
    • 读取单只股票的持仓比例。
    • 读取单只股票的今日涨跌幅。
    • 累加估值。
  3. 涨跌家数统计
    • 在遍历过程中,同时判断涨跌,分别累加 upCount (上涨家数)、downCount (下跌家数) 和 flatCount (平盘家数)。
  4. 格式化输出:最终结果除以 100(百分比换算),保留两位小数返回前端。

5.4 误差说明

  • 此算法基于前十大重仓股计算,未包含全部持仓(通常前十大占比在 30%-80% 不等)。
  • 数据源依赖持仓披露日期的实效性,若处于调仓期,估值可能存在偏差。

6. 部署说明

以本地电脑和安装 phpstudy 为例:

  1. 环境要求

    • 安装phpstudy
    • Phpstudy 中选择安装PHP 7.4 或更高版本。
    • PHP 扩展:pdo_sqlite, curl。
  2. 安装步骤

    • 将 index.html, index.css, index.js, api.php 放入www目录。
  3. 运行

项目完整代码:下载地址

优惠下载(一折) :关注+回复关键字:基金估值

相关推荐
我命由我1234513 分钟前
Vue3 开发中,字符串中的 <br\> 标签被直接当作文本显示出来了,而不是被解析为 HTML 换行标签
开发语言·前端·javascript·vue.js·html·ecmascript·html5
天下无贼!20 小时前
【功能实现】基于Vue3+TS实现大文件分片上传
开发语言·javascript·node.js·vue·html5
kyriewen112 天前
你点的“刷新”是假刷新?前端路由的瞒天过海术
开发语言·前端·javascript·ecmascript·html5
我命由我123454 天前
浏览器的 JS 模块化支持观察记录
开发语言·前端·javascript·css·html·ecmascript·html5
酉鬼女又兒4 天前
零基础快速入门前端ES6 核心特性详解与蓝桥杯 Web 考点实践(可用于备赛蓝桥杯Web应用开发)
开发语言·前端·职场和发展·蓝桥杯·es6·css3·html5
kyriewen114 天前
本地存储全家桶:从localStorage到IndexedDB,把数据塞进用户浏览器
开发语言·前端·javascript·ecmascript·html5
橘子编程4 天前
Django全栈开发终极指南
后端·python·django·npm·html·pandas·html5
Amumu121385 天前
HTML5的新特性
前端·html·html5
橘子编程5 天前
OpenClaw(小龙虾)完整知识汇总
java·前端·spring boot·spring·spring cloud·html5
酉鬼女又兒5 天前
零基础快速入门前端蓝桥杯Web考点深度解析:var、let、const与事件绑定实战(可用于备赛蓝桥杯Web应用开发)
开发语言·前端·javascript·职场和发展·蓝桥杯·es6·html5