BS1071-基于javaweb+springboot实现医疗健康档案大数据采集清洗数据分析可视化系统

2023-09-18 10:27:40 浏览数 (3)

本医疗健康档案大数据采集清洗数据分析可视化的设计与实现,系统主要采用java,springboot,动态图表echarts,vue,mysql,mybatisplus,医疗健康档案数据分析,html,css,javascript等技术实现,主要通过互联网采集爬虫获取互联网医疗健康档案,对健康档案数据进行数据分析整合,数据处理成JSON格式,通过前端javascript解析JSON完成数据可视化的动态展示。

系统采集模块主要包含:数据采集解析,数据过滤,数据清洗,数据入库等操作

系统可视化分析模块主要包含:数据维度及指标的建立,动态图表的构建等等

原文地址

一、程序设计

本基于java Springboot的医疗健康档案大数据采集清洗数据分析可视化系统,主要内容涉及:

主要功能模块:数据采集解析,数据过滤,数据清洗,数据入库,系统可视化分析模块主要包含:数据维度及指标的建立,动态图表的构建等等

二、效果实现

演示视频

<iframe style="width:100%;height:500px;" src="//player.bilibili.com/player.html?aid=828200473&bvid=BV1ug4y1w71d&cid=1191393288&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

三、代码实现

基于java Springboot的医疗健康档案大数据采集清洗数据分析可视化系统主要采用前后端模式,针对医疗健康档案数据查询封装成JSON格式,完成数据下发至系统界面端渲染,系统界面端针对JSON解析后采用javascript完成页面展示。其中系统首页医疗健康档案采集模块采用java javascript开发实现,数据分析代码逻辑如下:

代码语言:java复制
publicNumFn: function () {
                var publicNumChart = echarts.init(document.getElementById('publicNumId'));
                var urlList = baseURL   "counts/cxtj/task/1/DS_INDEX_GDYYFB_COUNTS_TASK/datas";
                var option;
                $.get(urlList, function (r) {
                    let datares = r.result.value;
                    var resArr = datares
                    var xunArr = []
                    var jingArr = []
                    var dateArr = []
                    for (var i = 0; i < resArr.length; i  ) {
                        xunArr.push(resArr[i].value)
                        jingArr.push(resArr[i].value)
                        dateArr.push(resArr[i].name)
                    }
                    option = {
                        tooltip: {
                            trigger: 'axis'
                        },
                        legend: {
                            x: '35%',
                            y: '0%',
                            data: ['疾病', '数量'],
                            textStyle: {
                                color: "#fff",
                                fontSize: 8
                            },
                            itemWidth: 10,
                            itemHeight: 10,
                        },
                        calculable: true,
                        xAxis: [
                            {
                                type: 'category',
                                data: dateArr,
                                axisLabel: {
                                    interval: 0,
                                    textStyle: {
                                        fontSize: 8,
                                        color: 'rgba(255,255,255,.7)',
                                    }
                                },
                                "axisTick": {       //y轴刻度线
                                    "show": false
                                },
                                "axisLine": {       //y轴
                                    "show": false,
                                },
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                scale: true,
                                name: '单位:%',
                                nameTextStyle: {
                                    color: 'rgba(255,255,255,.7)',
                                    fontSize: 8
                                },
                                max: 30,
                                min: 0,
                                boundaryGap: [0.2, 0.2],
                                "axisTick": {       //y轴刻度线
                                    "show": false
                                },
                                "axisLine": {       //y轴
                                    "show": false,
                                },
                                axisLabel: {
                                    textStyle: {
                                        color: 'rgba(255,255,255,.8)',
                                        fontSize: 8
                                        // opacity: 0.1,
                                    }
                                },
                                splitLine: {  //决定是否显示坐标中网格
                                    show: true,
                                    lineStyle: {
                                        color: ['#fff'],
                                        opacity: 0.2
                                    }
                                },
                            },
                            {
                                type: 'value',
                                scale: true,
                                show: false,
                                // name: "销量额(万元)",
                                nameTextStyle: {
                                    color: 'rgba(255,255,255,.2)',
                                },
                                max: 1,
                                min: 0,
                                boundaryGap: [0.2, 0.2],
                                "axisTick": {       //y轴刻度线
                                    "show": false
                                },
                                "axisLine": {       //y轴
                                    "show": false,
                                },
                                axisLabel: {
                                    textStyle: {
                                        color: 'rgba(255,255,255,.2)',
                                        // opacity: 0.1,
                                    }
                                },
                                splitLine: {  //决定是否显示坐标中网格
                                    show: true,
                                    lineStyle: {
                                        color: ['#fff'],
                                        opacity: 0.2
                                    }
                                },

                            }
                        ],
                        color: ['#2E8CFF', '#38EB70'],
                        grid: {
                            left: '5%',
                            right: '1%',
                            top: '25%',
                            bottom: '15%'
                            // containLabel: true
                        },
                        series: [
                            {
                                animationDuration: 2500,
                                barWidth: '20%',
                                name: '疾病',
                                type: 'bar',
                                data: xunArr,
                            },
                            {
                                barWidth: '20%',
                                name: '数量',
                                type: 'bar',
                                data: jingArr,
                            }
                        ],
                        animationEasing: 'cubicOut'
                    };

0 人点赞