A parameter linkage medical statistics visual interactive teaching method and system

Abstract

The application discloses a kind of parameter linkage's medical statistics visual interactive teaching method and system, including the following steps: step S1, modular teaching content library facing medical statistics knowledge system is built, and medical statistics teaching content is divided into multiple first-level teaching module and secondary teaching module according to knowledge logic, and each module encapsulates independent statistical model, parameter configuration, calculation logic and visual rendering rule;Step S2, parameter change event input by user is captured through event-driven parameter monitoring, and corresponding statistical calculation engine is triggered to carry out real-time operation;Step S3, dynamic statistical visual rendering is executed;Step S4, management offline dependent adaptive loading.The application dynamically incarnates abstract concept, helps student to understand teaching content in depth, and knowledge system is complete, and it is connected with the teaching needs of domestic medical college.

Description

Technical Field

[0001] This invention relates to the field of computer-aided education technology, and in particular to a parameter linkage visualization method and system for teaching medical statistics. Background Technology

[0002] Medical statistics is one of the basic courses in medical education. The teaching content covers a number of highly abstract knowledge modules such as probability distribution, sampling distribution, hypothesis testing, regression analysis, and experimental design. However, traditional medical statistics teaching has long faced the following technical challenges: (1) Understanding barriers caused by abstract concepts: Statistical concepts such as probability distribution, hypothesis testing, and central limit theorem are highly abstract. Traditional teaching relies on static textbooks and blackboard writing, making it difficult for students to establish intuitive spatial cognition. (2) Difficulty in presenting dynamic changes in the statistical process: The textbooks and PPTs used in classroom teaching cannot dynamically show the continuous evolution of statistics with parameter changes, such as the impact of changes in the mean and standard deviation of the normal distribution on the distribution shape, and the impact of changes in sample size on sampling error and confidence interval width. (3) Lack of real-time observation of parameter effects: In the existing teaching tools, students cannot adjust parameters in real time and observe the synchronous changes in statistical distribution, test power, bias, and other analytical results, resulting in insufficient understanding of the relationship between "parameters-models-results". (4) Lack of interactive teaching resources: Existing digital teaching tools for medical statistics generally lack two-way interactive functions. Taking the mainstream international online teaching platforms Khan Academy and Coursera as examples, their medical (bio) statistics teaching content is mainly based on video explanations, and learners can only passively watch and cannot actively explore the impact of parameter changes. The "Seeing Theory" visualization teaching website (https: / / seeing-theory.brown.edu / cn.html) developed by Brown University in the United States is committed to explaining probability and statistical concepts with data visualization, but its content system is based on the logic of probability and statistics disciplines, rather than the domestic medical statistics teaching syllabus, and lacks core medical statistics content such as clinical research design, random sampling, random grouping, and sample size estimation. (5) Network dependence limits teaching scenarios: Existing Web teaching tools generally rely on online CDN (Content Delivery Network, a distributed network service used to accelerate Web resources) to load front-end libraries and font resources. They cannot be deployed and used normally in teaching scenarios such as classrooms and conference rooms without network or with weak network, which limits the universality of teaching tools. In summary, existing technologies have significant shortcomings in real-time interactive visualization, localized knowledge system coverage, and offline usability for medical statistics teaching. There is an urgent need for a teaching method and system that can deeply integrate the medical statistics knowledge system, real-time parameter response mechanism, and dynamic visualization rendering. Summary of the Invention

[0003] The purpose of this invention is to provide a parameter-linked, visual, interactive teaching method and system for medical statistics to solve the problems mentioned in the background art.

[0004] To achieve the above-mentioned objectives, one aspect of the present invention provides a parameter-linked, visually interactive teaching method for medical statistics, comprising the following steps:

[0005] Step S1: Construct a modular teaching content library for the medical statistics knowledge system. Divide the medical statistics teaching content into multiple first-level teaching modules and second-level teaching modules according to knowledge logic. Each module encapsulates independent statistical models, parameter configurations, calculation logic and visualization rendering rules.

[0006] Step S2: Capture parameter change events input by users (teachers and students) through event-driven parameter listening, and trigger the corresponding statistical calculation engine to perform real-time calculations.

[0007] Step S3: Perform dynamic statistical visualization rendering. Based on the encapsulated visualization rendering engine, generate corresponding statistical charts according to the calculation results in step S2. The statistical charts include probability density curves, dynamic evolution of sampling distribution, hypothesis testing animation sequence diagrams, and multi-dimensional sampling bias comparison diagrams.

[0008] Step S4 manages the adaptive loading of offline dependencies. During the system initialization phase, the integrity of the local offline dependency library is checked: when a local dependency is detected to be missing, it automatically falls back to loading the online third-party dependency file CDN; when a local dependency is detected to be complete, local resources are loaded first to ensure availability in a network-free environment.

[0009] Furthermore, the first-level teaching modules consist of 13 modules, including: probability distribution teaching module, sampling distribution teaching module, central limit theorem teaching module, sampling error teaching module, confidence interval teaching module, hypothesis testing teaching module, chi-square test for four-fold tables teaching module, analysis of variance teaching module, rank sum test teaching module, correlation coefficient teaching module, regression analysis teaching module, random sampling teaching module, and experimental design teaching module.

[0010] The second-level teaching modules consist of 27 items, including:

[0011] There are four probability distributions: normal distribution, binomial distribution, Poisson distribution, and hypergeometric distribution.

[0012] There are three sampling distributions: t-distribution, F-distribution, and chi-square distribution.

[0013] The central baseline theorem simulates four distributions: uniform distribution, exponential distribution, Poisson distribution, and binomial distribution.

[0014] Sampling error (1); Confidence interval (1); Hypothesis testing (2): Basic principle animation, Type I / II error; Chi-square test principle visualization (1); Analysis of variance principle visualization (1); Rank sum test principle visualization (2): Rank transformation, Wilcoxon test; Correlation coefficient visualization (1); Regression analysis visualization (1); Random sampling visualization (4): Simple random sampling, Systematic sampling, Stratified sampling, Cluster sampling; Experimental design (2): Randomization process, Sample size calculation.

[0015] Furthermore, the first-level teaching modules are organized according to the following knowledge sequence: probability distribution → sampling distribution → central limit theorem → sampling error → confidence interval → hypothesis testing → chi-square test for four-fold tables → analysis of variance → rank-sum test → correlation analysis → regression analysis → random sampling → experimental design.

[0016] Furthermore, a three-tiered, responsive architecture was built on the browser client, including:

[0017] (1) Register input event listeners on DOM (Document Object Model, which is the programming interface for representing HTML documents in the browser) elements through the event manager. When the user adjusts the slider or enters a value, the parameter change value is captured with a delay of less than 10 milliseconds. The event manager uses a key-value pair structure to store listener references. Duplicate registration of the same element-event type will automatically remove the old listener to prevent memory leaks.

[0018] (2) Based on the captured parameter values, call the statistical computing library or local mathematical computing library to perform probability density calculation, distribution function calculation, inverse distribution function calculation, and random sampling simulation operation to generate a new statistical data sequence;

[0019] (3) Encapsulate the calculated statistical data sequence into a trace object of Plotly.js and perform chart updates or animation transition rendering.

[0020] Furthermore, in step S3, the implementation process and bias characteristics of four sampling methods are displayed in parallel on the same visualization interface. The four sampling methods include: simple random sampling, systematic sampling, stratified sampling, and cluster sampling.

[0021] Furthermore, the visualization process for modeling and sampling includes the following steps:

[0022] Step S301: Construct a virtual population with periodic color distribution characteristics. The individuals in the population are arranged in a five-color cycle of yellow-orange-blue-indigo-violet, forming a clear periodic structure.

[0023] Step S302: Visualize the systematic sampling bias by performing systematic sampling at fixed intervals, calculating the deviation between the actual frequency and the theoretical expected frequency of each color individual in the sample, generating a bias score, and highlighting the location and color distribution of the sampled individuals in the chart.

[0024] Step S303: Perform stratified sampling optimization visualization, construct a virtual population with inter-stratum heterogeneity and intra-stratum homogeneity, allocate the sample size according to the proportion of each stratum in the population, and demonstrate how stratified sampling reduces sampling error;

[0025] Step S304: Visualize the efficiency of cluster sampling to intuitively demonstrate the process of cluster sampling compared to simple random sampling.

[0026] Furthermore, in step S4, the following dependency loading process is executed during the system startup phase, including the following steps:

[0027] Step S401: Define a dependency detection list, which contains external libraries required for system operation and their global variable identifiers;

[0028] Step S402: Check the existence of global variables for each dependency library in turn; if they exist, it is determined that the dependency has been successfully loaded from the local file; if they do not exist, dynamically create script tags or link tags and load the dependency asynchronously from the configured online CDN address.

[0029] Step S403: After all dependencies are loaded, the application controller initialization process is triggered; if there are dependencies that fail to load, an error log is output to the console and an attempt is made to run in degraded mode.

[0030] Another aspect of the present invention provides a parameter-linked medical statistics visualization interactive teaching system. The system adopts a layered architecture design, including: a user interaction layer, a business logic layer, a technical support layer, and an infrastructure layer. Data is transferred between the four layers via a top-down call chain and a bottom-up callback chain. The user interaction layer captures parameter change events and passes them to the business logic layer through an event manager. The business logic layer calls a mathematical calculation library to perform statistical calculations and generate chart data. The chart data is rendered by a chart tool library and displayed in the user interaction layer. Wherein:

[0031] The user interaction layer is located at the top of the system and is directly aimed at teachers and students. It includes a visual chart display component, a parameter adjustment control panel, an animation playback controller, and a navigation and label management component. The parameter adjustment control panel receives parameter change commands from the user through interactive elements such as sliders and numerical input boxes.

[0032] The business logic layer is located below the user interaction layer and includes multiple teaching modules organized according to the knowledge system of medical statistics. Specifically, these include: probability distribution module, sampling distribution module, central limit theorem module, sampling error module, confidence interval module, hypothesis testing module, chi-square test for four-fold tables module, analysis of variance module, rank-sum test module, correlation analysis module, regression analysis module, random sampling module, and experimental design module. Each module independently encapsulates statistical calculation logic and visualization configuration rules.

[0033] The technical support layer is located below the business logic layer and provides general technical capabilities support for the upper-layer modules. It includes the following modules:

[0034] The application controller is responsible for module registration, initialization scheduling, lifecycle management, and inter-module communication;

[0035] The event manager is responsible for the unified registration, listening, and distribution of user interaction events, and for capturing and triggering callbacks for parameter change events.

[0036] The charting toolkit is based on Plotly.js and provides standardized interfaces for creating statistical charts, generating layouts, optimizing performance, and rendering securely.

[0037] The mathematical computation library encapsulates basic algorithms for probability density function calculation, random number generation, sample statistic calculation, and correlation coefficient calculation;

[0038] The module loader is responsible for asynchronous loading of module scripts, dependency graph resolution, and circular dependency detection;

[0039] The infrastructure layer is located at the bottom of the system and includes a visualization engine, a statistical computing library, a UI (User Interface) framework, and a mathematical formula rendering engine.

[0040] Furthermore, the secure rendering interface performs the following operations in sequence before rendering: detects whether the target DOM element exists, verifies the validity of the trace data, and performs intelligent downsampling on the data sequence with more than 1,000 data points; during the rendering process, exceptions are captured through a try-catch structure, and false is returned and an error log is output when rendering fails, so as to avoid the entire system from crashing due to a single chart rendering error.

[0041] Compared with existing technologies, this system and method have the following advantages:

[0042] (1) Teaching and cognitive effects

[0043] ① Dynamic visualization of abstract concepts: Through real-time linkage of parameters, calculation and visualization, abstract concepts such as changes in probability distribution shape, confidence interval coverage probability, two types of errors in hypothesis testing, statistical inference principles and processes, probability sampling and random grouping are transformed into observable and operable visual dynamics, reducing students' cognitive load.

[0044] ② Exploratory learning experience: Students can actively adjust parameters (such as sample size n, population mean μ, significance level α, etc.) and observe the changing trends of statistical results in real time, transforming from passively receiving knowledge to actively discovering patterns, which is in line with constructivist learning theory.

[0045] ③ Multi-method comparison and understanding: Through multi-dimensional sampling bias visualization methods, students can intuitively compare the implementation process and bias differences of four sampling methods on the same interface, forming a deep understanding of the selection conditions for sampling methods, making up for the shortcomings of traditional teaching that "only talks about formulas and does not show the process".

[0046] (2) Technical performance effect

[0047] ① Real-time response: The end-to-end latency from parameter adjustment to chart update is controlled within the browser rendering frame rate range (usually less than 60FPS), which is perceived by the human eye as an instant response without any lag.

[0048] ② Offline availability: The system can run directly through a local HTTP server or browser in a completely offline environment, without the need for server support, thus breaking the dependence of traditional web teaching tools on the network environment.

[0049] ③ Cross-platform compatibility: Developed based on standard HTML5, CSS3 and ECMAScript 6+ technology stack, compatible with mainstream browsers such as Chrome 60+, Firefox 55+, Safari 12+, Edge 79+, and supports Windows, macOS and Linux operating systems.

[0050] ④ Ease of deployment: The system has no build tools, no packaging process, and no npm dependency management. It can be used simply by copying the project directory to the target computer, which lowers the deployment threshold for non-computer science teachers.

[0051] ⑤ Operational stability: Through secure rendering mechanisms, error capture mechanisms, memory leak protection mechanisms, and modular design mechanisms, anomalies in a single module or a single chart will not cause the entire system to crash, ensuring the continuity of the teaching process.

[0052] (3) Knowledge system coverage effect

[0053] ① Completeness: The system covers the entire medical statistics teaching chain, from the basics of probability theory and statistical inference to clinical research design. Compared with similar foreign products like Seeing Theory, it adds medical statistics-specific content such as random sampling, experimental design, and chi-square tests for four-fold tables. ② Localization: The module organization and content settings conform to the domestic medical statistics teaching syllabus and knowledge system, making it more suitable for the teaching needs of domestic medical colleges and universities. Attached Figure Description

[0054] Figure 1 This is a flowchart of a parameter-linked, visual, and interactive teaching method for medical statistics.

[0055] Figure 2 This is a modular organizational structure diagram of the medical statistics knowledge system.

[0056] Figure 3 Example diagram for probability distribution visualization module.

[0057] Figure 4 This is an example of a statistical chart for the sampling distribution visualization module.

[0058] Figure 5 Example diagram of the visualization module for the central limit theorem.

[0059] Figure 6 Example diagram for the sampling error visualization module.

[0060] Figure 7 shows an example of the confidence interval visualization module.

[0061] Figure 8 shows an example of the hypothesis testing visualization module.

[0062] Figure 9 is an example of a visualization module for the chi-square test principle in a four-cell table.

[0063] Figure 10 This is an example diagram of a visualization module for the principle of analysis of variance.

[0064] Figure 11 Example diagram of the visualization module for the rank-sum test principle.

[0065] Figure 12 Example diagram for the correlation analysis visualization module.

[0066] Figure 13 This is a visualization example of the principle of least squares method in simple linear regression analysis.

[0067] Figure 14 This is an example diagram of a simple random sampling visualization module.

[0068] Figure 15 Example diagram of the visualization module for the experiment design.

[0069] Figure 16 This is a schematic diagram of the overall architecture of a parameter-linked medical statistics visualization and interactive teaching system. Detailed Implementation

[0070] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.

[0071] Figure 1 shows a flowchart of the method of the present invention. The present invention provides a parameter linkage visualization method for medical statistics teaching, which runs in a browser-based client environment. The method includes the following steps:

[0072] Step S1: Construct a modular teaching content library oriented towards the medical statistics knowledge system. The medical statistics teaching content is divided into multiple primary and secondary teaching modules according to knowledge logic. Each module encapsulates independent statistical models, parameter configurations, calculation logic, and visualization rendering rules; a total of 13 independent primary statistics teaching modules (including: probability distribution, sampling distribution, central limit theorem, sampling error, confidence interval, hypothesis testing, chi-square test, analysis of variance, rank-sum test, correlation coefficient, regression analysis, random sampling, and experimental design) and 27 secondary teaching modules (4 probability distribution modules: normal distribution, binomial distribution, Poisson distribution). The curriculum includes: distributions including: t-distribution, hypergeometric distribution; 3 sampling distributions: t-distribution, F-distribution, chi-square distribution; 4 distributions simulated using the central baseline theorem: uniform distribution, exponential distribution, Poisson distribution, binomial distribution; 1 topic on sampling error; 1 topic on confidence intervals; 2 topics on hypothesis testing: animation of basic principles, Type I / II error; 1 visualization of the chi-square test principle for four-fold tables; 1 visualization of the principle of analysis of variance; 2 visualizations of the principle of rank sum tests: rank transformation, Wilcoxon test; 1 visualization of correlation coefficients; 1 visualization of regression analysis; 4 visualizations of random sampling: simple random sampling, systematic sampling, stratified sampling, cluster sampling; and 2 topics on experimental design: randomization process, sample size calculation. The specific first- and second-level teaching modules are shown in Figure 2.

[0073] This invention divides the teaching content of medical statistics into 13 primary teaching modules and 27 secondary teaching modules according to the knowledge logic from basic to applied and from theory to design. The primary teaching modules are organized according to the following knowledge sequence: probability distribution → sampling distribution → central limit theorem → sampling error → confidence interval → hypothesis testing → chi-square test for four-fold tables → analysis of variance → rank-sum test → correlation analysis → regression analysis → random sampling → experimental design. Each primary module is further divided into several secondary modules according to the teaching granularity. For example, the primary module of "random sampling" is divided into four secondary modules: simple random sampling, systematic sampling, stratified sampling, and cluster sampling.

[0074] Each module is registered and managed uniformly through the application controller. There are no strong data dependencies between modules; they communicate loosely only through an event bus. Each module independently implements the init() initialization interface and the optional onEvent(event, data) event response interface.

[0075] This modular organization method enables the system to fully cover the knowledge system of the medical statistics teaching syllabus, while supporting on-demand loading and dynamic expansion; teachers can selectively display corresponding modules according to the teaching progress to avoid information overload; new teaching modules can be quickly integrated into the system through standard interfaces without modifying existing code.

[0076] Step S2: Establish a real-time linkage response mechanism for parameters, calculation, and visualization: Capture user-input parameter change events through an event-driven parameter listening layer, trigger the corresponding statistical calculation engine to perform real-time calculations, and synchronously push the calculation results to the visualization rendering layer for dynamic updates.

[0077] This invention constructs a responsive architecture on the browser client that links three modules, including:

[0078] (1) Parameter listening module: Register input event listeners on DOM elements through the event manager. When the user adjusts the slider or enters a value, the parameter change value is captured with a delay of less than 10 milliseconds. The event manager uses a key-value pair Map structure to store listener references. Duplicate registration of the same element-event type will automatically remove the old listener to prevent memory leaks.

[0079] (2) Statistical calculation module: Based on the captured parameter values, the jStat statistical calculation library or local mathematical calculation library is called to perform probability density calculation, distribution function calculation, inverse distribution function calculation, and random sampling simulation operation to generate a new statistical data sequence;

[0080] (3) Visualization rendering module: The calculated statistical data sequence is encapsulated into a trace object of Plotly.js, and Plotly.newPlot() or Plotly.animate() is called to update the chart or render the animation transition.

[0081] The parameter monitoring module is connected to the statistical calculation module through a JavaScript callback function chain. The statistical calculation module is connected to the visualization rendering module through data object passing. The several modules are executed synchronously in the browser's main thread, forming a closed-loop linkage of "parameter change → real-time calculation → instant rendering".

[0082] This linkage mechanism achieves a true "what you see is what you get" interactive experience. After adjusting the parameters, teachers and students can instantly observe the continuous changes in statistical distribution patterns, test statistics, confidence interval widths, and other results, significantly reducing the threshold for understanding abstract concepts. Compared to traditional teaching software that requires manual refreshing or recalculation, the response latency of this invention is lower than the visual perception threshold, providing a smooth exploratory learning and visual teaching experience.

[0083] Step S3, execute dynamic statistical visualization rendering: Based on the encapsulated visualization rendering engine, generate corresponding statistical charts according to the calculation results. The statistical charts include, but are not limited to, probability density curves, dynamic evolution charts of sampling distributions, hypothesis testing animation sequences, and multi-dimensional sampling bias comparison charts. Figures 3-15 show the statistical charts for the 13 teaching modules.

[0084] To address the teaching difficulties in understanding random sampling methods in medical research, this invention presents the implementation process and bias characteristics of four sampling methods (simple random sampling, systematic sampling, stratified sampling, and cluster sampling) in parallel on the same visual interface, innovating the visualization process of modeling and sampling. Specifically, it includes the following steps:

[0085] Step S301, Overall modeling: Construct a virtual population with periodic color distribution characteristics. The individuals in the population are arranged in a five-color cycle of yellow-orange-blue-indigo-violet, forming a clear periodic structure.

[0086] Step S302, Visualization of systematic sampling bias: Perform systematic sampling at fixed intervals, calculate the deviation between the actual frequency and the theoretical expected frequency of each color individual in the sample, generate a bias score, and highlight the location and color distribution of the sampled individuals in the chart;

[0087] Step S303, Stratified Sampling Optimization Visualization: Construct a virtual population with inter-stratum heterogeneity (different strata have different means and variances) and intra-stratum homogeneity, allocate the sample size according to the proportion of each stratum in the population, and demonstrate how stratified sampling reduces sampling error;

[0088] Step S304, Visualization of Cluster Sampling Efficiency: Visually demonstrates the process of cluster sampling compared to simple random sampling.

[0089] The four sampling methods share the same overall data generation engine and chart rendering engine. The tab switching control allows users to switch between views of different sampling methods. The parameter adjustment controls in each view are bound to the corresponding sampling algorithm logic through the event manager.

[0090] This method fills the gap in the teaching of sampling surveys by providing a tool for simultaneous comparison of multiple methods. It enables students to intuitively compare the applicable conditions and bias characteristics of different sampling methods in a unified interactive environment, and to deeply understand the relationship between "sampling method selection - population structure characteristics - estimation bias".

[0091] Step S4, manage the adaptive loading of offline dependencies: during the system initialization phase, check the integrity of the local offline dependency library. When a local dependency is detected to be missing, automatically fall back to loading the online third-party dependency file CDN. When a local dependency is detected to be complete, prioritize loading local resources to ensure availability in a network-free environment.

[0092] To address the potential lack of an environment network during teaching, this invention executes the following dependency loading process during system startup:

[0093] Step S401: Define a dependency detection list, which includes external libraries required for system operation and their global variable identifiers, including Plotly (corresponding to window.Plotly), jStat (corresponding to window.jStat), Bootstrap (corresponding to window.bootstrap), and MathJax (corresponding to window.MathJax).

[0094] Step S402: Check the existence of global variables for each dependency library in turn; if they exist, it is determined that the dependency has been successfully loaded from the local file; if they do not exist, dynamically create script tags or link tags and load the dependency asynchronously from the configured online CDN address.

[0095] Step S403: After all dependencies are loaded, the application controller initialization process is triggered; if there are dependencies that fail to load, an error log is output to the console and an attempt is made to run in degraded mode.

[0096] The offline dependency manager resides in the infrastructure layer and executes before the application initialization process in main.js. Its loading results directly determine whether upper-layer modules can correctly call the functions of the corresponding libraries. This method enables the system to run stably in classrooms and conference rooms with no network connection, requiring only the dependency library files to be downloaded to the local libs directory before the initial deployment. Furthermore, if local files are unexpectedly missing, the system can automatically fall back to online loading, balancing offline availability and deployment fault tolerance.

[0097] like Figure 16 The diagram shown illustrates the overall system architecture of this invention. This invention also provides a parameter-linked visualization system for medical statistics teaching, the system employing a layered architecture design, including:

[0098] User Interaction Layer (UI Layer): Located at the top of the system, it directly faces teachers and students. It includes a visual chart display component, a parameter adjustment control panel, an animation playback controller, and a navigation and label management component. The parameter adjustment control panel receives parameter change commands from the user through interactive elements such as sliders and numerical input boxes.

[0099] Business Logic Layer: Located below the user interaction layer, it includes multiple teaching modules organized according to the medical statistics knowledge system, specifically including: probability distribution module, sampling distribution module, central limit theorem module, sampling error module, confidence interval module, hypothesis testing module, chi-square test for four-fold tables module, analysis of variance module, rank-sum test module, correlation analysis module, regression analysis module, random sampling module, and experimental design module; each module independently encapsulates statistical calculation logic and visualization configuration rules.

[0100] Technical Support Layer: Located below the business logic layer, this layer provides general technical support for upper-layer modules, including the following components: Application Controller (AppController): Responsible for module registration, initialization scheduling, lifecycle management, and inter-module communication; Event Manager (EventManager): Responsible for unified registration, listening, and distribution of user interaction events, enabling the capture and callback triggering of parameter change events; ChartUtils: Based on Plotly.js, providing standardized interfaces for creating statistical charts, generating layouts, optimizing performance, and secure rendering; MathUtils: Encapsulates basic algorithms for probability density function calculation, random number generation, sample statistics calculation, and correlation coefficient calculation; ModuleLoader: Responsible for asynchronous loading of module scripts, dependency graph parsing, and circular dependency detection.

[0101] This invention encapsulates a safe rendering interface, `safePlot()`, within the chart tool library. Before rendering, this interface performs the following operations sequentially: checks the existence of the target DOM element, verifies the validity of the trace data, and performs intelligent downsampling on data sequences exceeding 1000 data points. During rendering, exceptions are caught using a try-catch structure; if rendering fails, it returns `false` and outputs an error log, preventing a single chart rendering error from causing the entire system to crash. The `safePlot()` interface, as a public method of the chart tool library, is called by all teaching modules in the business logic layer, serving as the unified entry point for statistical visualization rendering.

[0102] This method ensures the stability and reliability of the system in complex teaching scenarios; the intelligent downsampling algorithm reduces the rendering memory usage of the dataset to a controllable range while ensuring visual effects, enabling the system to run smoothly and without lag on ordinary teaching computers.

[0103] Infrastructure Layer: Located at the bottom layer of the system, it includes the visualization engine Plotly.js, the statistical computing library jStat, the UI framework Bootstrap, and the mathematical formula rendering engine MathJax.

[0104] The above four layers exchange data through a top-down call chain and a bottom-up callback chain: the user interaction layer captures parameter change events and passes them to the business logic layer through the event manager; the business logic layer calls the mathematical calculation library to complete statistical calculations and generate chart data; the chart data is rendered by the chart tool library and displayed in the user interaction layer.

[0105] The present invention will be further described in detail below with reference to the accompanying drawings. Embodiment 1: System Deployment and Initialization

[0106] Step 1: Run the download-deps.bat batch script on a networked computer to automatically download dependency libraries such as Plotly.js, jStat, Bootstrap, and MathJax to the libs folder under the project root directory.

[0107] Step 2: Copy the complete project directory, including index.html, main.js, config / , core / , modules / , styles / , and libs / , to any local path on the target teaching computer.

[0108] Step 3: Double-click to open the index.html file (some browsers may restrict some functions due to security restrictions on the file: / / protocol);

[0109] Step 4: After the browser loads index.html, it will automatically execute the scripts in the following order (without manual intervention): First, it loads check-modules.js to check the completeness of dependencies. If local dependencies are missing, it will fall back to CDN loading. Then, it loads config / app-config.js and the core modules in the core / directory. Next, it loads the 14 teaching module scripts in the modules / directory. Finally, it loads main.js to trigger the initializeApp() initialization process.

[0110] Step 5: AppController.init() executes module registration and initialization, EventManager binds navigation tab switching events, and the system displays the "Probability Distribution" teaching module by default.

[0111] Example 2: Interactive teaching process of the probability distribution module

[0112] Taking the teaching of normal distribution as an example, this section explains the specific implementation process of the parameter-calculation-visualization linkage mechanism:

[0113] Step 1: When the user clicks the "Probability Distribution" tab in the navigation bar, AppController switches the current activity module to the probability distribution module and displays the corresponding parameter control panel and chart container.

[0114] Step 2: The user adjusts the "Mean (μ)" slider in the parameter control panel. The EventManager captures the input event and reads the current value of the slider (e.g., from 0 to 2).

[0115] Step 3: EventManager calls the preset callback function, which calls the normal distribution probability density function calculation algorithm in MathUtils to calculate a new probability density value sequence y=pdf(x, μ=2, σ=1) in the interval x∈[-6, 6] with a step size of 0.01.

[0116] Step 4: The probability distribution module encapsulates the new x and y sequences into scatter type trace objects in Plotly.js, and sets the curve color, fill area, and legend label attributes.

[0117] Step 5: The module calls the ChartUtils.safePlot() method, passing in the chart container ID, trace object, and layout object; after the safePlot() method checks the existence of the container and the validity of the data, it calls Plotly.newPlot() to perform rendering. The normal distribution curve is updated in real time in the chart container, and the peak position shifts from x=0 to x=2.

[0118] Step 6: The user continues to adjust the "Standard Deviation (σ)" slider, repeats Steps 2 to 5, and observes the linkage effect between the change in the peak height of the curve and the change in the broadening degree. Throughout the whole process, the delay between parameter adjustment and chart update is less than the human eye perception threshold. See Figure 3.

[0119] Embodiment 3: Multi-method comparative teaching of the random sampling module

[0120] Taking the teaching of systematic sampling bias as an example, the specific implementation of the multi-dimensional sampling bias visualization method is described as follows:

[0121] Step 1: The user switches to the "Random Sampling" module and selects the "Systematic Sampling" tab.

[0122] Step 2: The system displays a user-defined population above the chart area, for example, a population visualization diagram composed of 100 colored circles, wherein the circles are arranged in a periodic cycle of five colors: yellow, orange, blue, indigo and violet, and different colors represent the characteristic stratification of the population.

[0123] Step 3: The user sets the sample size in the parameter panel, for example, n=10, the system automatically completes the calculation of the sampling interval, for example, the sampling interval k = N / n = 100 / 10 = 10, the starting point r is calculated and randomly determined by the system according to the sampling interval and the sample size, and the system draws individuals numbered r, r+k, r+2k, ... according to the systematic sampling rule, and marks the sampled individuals with a highlighted border in the population visualization diagram.

[0124] Step 4: The system counts the frequency of each color in the sampled individuals, and displays the comparison between the actual frequency and the theoretical expected frequency (expected frequency = sample size / number of color types) in the bar chart below; when the sampling interval k is an integer multiple of the color cycle length (5), the actual frequency of a certain color in the bar chart deviates significantly from the expected frequency, which intuitively demonstrates the periodic bias of systematic sampling.

[0125] Step 5: The user switches to the "Stratified Sampling" tab, where the user can customize the number of strata (strata represent important characteristics of the population). The system uses different rows or different regions in the population visualization diagram to represent different strata, wherein the colors of individuals within each stratum are similar, and the colors of individuals between different strata are significantly different; after the user sets the sample allocation ratio of each stratum, the system displays the stratified sampling process allocated according to the ratio.

[0126] Embodiment 4: Teaching implementation in an offline environment

[0127] Step 1: On a classroom computer with no network connection at all, copy the project directory with pre-installed dependency libraries via a USB flash drive or local area network sharing.

[0128] Step 2: Open index.html in your browser and check-modules.js to check global variables such as window.Plotly and window.jStat to confirm that the dependency files in the local libs / directory have been successfully loaded.

[0129] Step 3: The console outputs the message "All dependent libraries have been loaded" and the system enters the normal initialization process.

[0130] Step 4: Teachers adjust parameters and display charts in each teaching module. All statistical calculations and rendering are completed locally in the browser without any network requests.

[0131] Although embodiments of the invention have been shown and described, it will be understood by those skilled in the art that various changes, modifications, substitutions and alterations can be made to these embodiments without departing from the principles and spirit of the invention, the scope of which is defined by the appended claims and their equivalents.

Claims

1. A parameter-linked, visual, interactive teaching method for medical statistics, characterized in that, Includes the following steps: Step S1: Construct a modular teaching content library for the medical statistics knowledge system. Divide the medical statistics teaching content into multiple first-level teaching modules and second-level teaching modules according to the knowledge point logic. Each module encapsulates independent statistical models, parameter configurations, calculation logic and visualization rendering rules. Step S2: Capture the parameter change event of user input through event-driven parameter listening, and trigger the corresponding statistical calculation engine to perform real-time calculation; Step S3: Perform dynamic statistical visualization rendering. Based on the encapsulated visualization rendering engine, generate corresponding statistical charts according to the calculation results in step S2. The statistical charts include probability density curves, dynamic evolution diagrams of sampling distributions, confidence interval principle diagrams, hypothesis testing animation sequence diagrams, diagrams of the main statistical inference principle processes, comparison diagrams of multi-dimensional sampling bias in surveys and research, and diagrams of randomized processes in actual experiments. Step S4 manages the adaptive loading of offline dependencies. During the system initialization phase, the integrity of the local offline dependency library is checked: when a local dependency is detected to be missing, it automatically falls back to loading the online third-party dependency file CDN; when a local dependency is detected to be complete, local resources are loaded first to ensure availability in a network-free environment.

2. The parameter-linked medical statistics visualization and interactive teaching method according to claim 1, characterized in that, The first-level teaching modules consist of 13 modules, including: probability distribution teaching module, sampling distribution teaching module, central limit theorem teaching module, sampling error teaching module, confidence interval teaching module, hypothesis testing teaching module, chi-square test for four-fold tables teaching module, analysis of variance teaching module, rank sum test teaching module, correlation coefficient teaching module, regression analysis teaching module, random sampling teaching module, and experimental design teaching module. The second-level teaching modules consist of 27 items, including: There are four probability distributions: normal distribution, binomial distribution, Poisson distribution, and hypergeometric distribution. There are three sampling distributions: t-distribution, F-distribution, and chi-square distribution. The central baseline theorem simulates four distributions: uniform distribution, exponential distribution, Poisson distribution, and binomial distribution. Sampling error (1); Confidence interval (1); Hypothesis testing (2): Basic principle animation, Type I / II error; Chi-square test principle visualization (1); Analysis of variance principle visualization (1); Rank sum test principle visualization (2): Rank transformation, Wilcoxon test; Correlation coefficient visualization (1); Regression analysis visualization (1); Random sampling visualization (4): Simple random sampling, Systematic sampling, Stratified sampling, Cluster sampling; Experimental design (2): Randomization process, Sample size calculation.

3. The parameter-linked medical statistics visualization and interactive teaching method according to claim 1, characterized in that, The first-level teaching modules are organized according to the following knowledge sequence: probability distribution → sampling distribution → central limit theorem → sampling error → confidence interval → hypothesis testing → chi-square test for four-fold tables → analysis of variance → rank-sum test → correlation analysis → regression analysis → random sampling → experimental design.

4. The parameter-linked medical statistics visualization and interactive teaching method according to claim 1, characterized in that, A three-tiered, interactive responsive architecture was built on the browser client, including: (1) Register input event listeners on DOM elements through the event manager. When the user adjusts the slider or enters a value, the parameter change value is captured with a delay of less than 10 milliseconds. The event manager uses a key-value pair structure to store listener references. Duplicate registration of the same element-event type will automatically remove the old listener to prevent memory leaks. (2) Based on the captured parameter values, call the statistical computing library or local mathematical computing library to perform probability density calculation, distribution function calculation, inverse distribution function calculation, and random sampling simulation operation to generate a new statistical data sequence; (3) Encapsulate the calculated statistical data sequence into a trace object of Plotly.js and perform chart updates or animation transition rendering.

5. The parameter-linked, interactive visual teaching method for medical statistics according to claim 1, characterized in that, In step S3, the implementation process and bias characteristics of four sampling methods are displayed in parallel on the same visualization interface. The four sampling methods include: simple random sampling, systematic sampling, stratified sampling, and cluster sampling.

6. The parameter-linked medical statistics visualization and interactive teaching method according to claim 1, characterized in that, The visualization process for modeling and sampling includes the following steps: Step S301: Construct a virtual population with periodic color distribution characteristics. The individuals in the population are arranged in a five-color cycle of yellow-orange-blue-indigo-violet, forming a clear periodic structure. Step S302: Visualize the systematic sampling bias by performing systematic sampling at fixed intervals, calculating the deviation between the actual frequency and the theoretical expected frequency of each color individual in the sample, generating a bias score, and highlighting the location and color distribution of the sampled individuals in the chart. Step S303: Perform stratified sampling optimization visualization, construct a virtual population with inter-stratum heterogeneity and intra-stratum homogeneity, allocate the sample size according to the proportion of each stratum in the population, and demonstrate how stratified sampling reduces sampling error; Step S304: Visualize the efficiency of cluster sampling to intuitively demonstrate the process of cluster sampling compared to simple random sampling.

7. The parameter-linked medical statistics visualization and interactive teaching method according to claim 1, characterized in that, In step S4, the following dependency loading process is executed during the system startup phase. Includes the following steps Step S401: Define a dependency detection list, which contains external libraries required for system operation and their global variable identifiers; Step S402: Check the existence of global variables for each dependent library in turn; if they exist, it is determined that the dependency has been successfully loaded from the local file. If it does not exist, a script tag or link tag will be dynamically created and the dependency will be loaded asynchronously from the configured online CDN address; Step S403: After all dependencies are loaded, the application controller initialization process is triggered; If any dependencies fail to load, output error logs to the console and try running in degraded mode.

8. A parameter-linked, visual, interactive teaching system for medical statistics, characterized in that, The system adopts a layered architecture, including: a user interaction layer, a business logic layer, a technical support layer, and an infrastructure layer. Data is transferred between these four layers via a top-down call chain and a bottom-up callback chain. The user interaction layer captures parameter change events and passes them to the business logic layer through an event manager. The business logic layer calls a mathematical calculation library to perform statistical calculations and generate chart data. The chart data is rendered by a chart tool library and displayed in the user interaction layer. The user interaction layer is located at the top of the system and is directly aimed at teachers and students. It includes a visual chart display component, a parameter adjustment control panel, an animation playback controller, and a navigation and label management component. The parameter adjustment control panel receives parameter change commands from the user through interactive elements such as sliders and numerical input boxes. The business logic layer is located below the user interaction layer and includes multiple teaching modules organized according to the knowledge system of medical statistics. Specifically, these include: probability distribution module, sampling distribution module, central limit theorem module, sampling error module, confidence interval module, hypothesis testing module, chi-square test for four-fold tables module, analysis of variance module, rank-sum test module, correlation analysis module, regression analysis module, random sampling module, and experimental design module. Each module independently encapsulates statistical calculation logic and visualization configuration rules. The technical support layer is located below the business logic layer and provides general technical capabilities support for the upper-layer modules. It includes the following modules: The application controller is responsible for module registration, initialization scheduling, lifecycle management, and inter-module communication; The event manager is responsible for the unified registration, listening, and distribution of user interaction events, and for capturing and triggering callbacks for parameter change events. The charting toolkit is based on Plotly.js and provides standardized interfaces for creating statistical charts, generating layouts, optimizing performance, and rendering securely. The mathematical computation library encapsulates basic algorithms for probability density function calculation, random number generation, sample statistic calculation, and correlation coefficient calculation; The module loader is responsible for asynchronous loading of module scripts, dependency graph resolution, and circular dependency detection; The infrastructure layer is located at the bottom of the system and includes a visualization engine, a statistical computing library, a UI framework, and a mathematical formula rendering engine.

9. The parameter-linked medical statistics visualization and interactive teaching system according to claim 8, characterized in that, The secure rendering interface performs the following operations in sequence before rendering: detects whether the target DOM element exists, verifies the legality of the trace data, and performs intelligent downsampling on data sequences with more than 1,000 data points; during the rendering process, exceptions are caught through a try-catch structure, and false is returned and an error log is output when rendering fails, so as to avoid the entire system from crashing due to a single chart rendering error.

Images