文章目录

0 前言

Hi，大家好，今天给大家介绍一个大数据可视化项目，大家可以用于自己的课设或毕设，可以灵活耦合任意数据，为自己的项目添加灵活的可视化动态效果！

今天要分享的是：基于大数据的医疗与疾病监控大数据可视化设计与实现

1 介绍

大数据大屏可视化系列：基于大数据的医疗与疾病监控大数据可视化设计与实现

可搭载任意自己想用的数据，动态效果不错

项目源码：/download/Seniors_DC/85662427

2 实现效果

整体实现效果如下，可以看到CSS优化相对漂亮的，而且动态效果也很好，适合搭载各种数据。

3 部分关键代码

function echarts_1() {// 基于准备好的dom，初始化echarts实例var myChart = echarts.init(document.getElementById('echart1'));option = {title: {text: '14%',x: 'center',y: 'center',textStyle: {fontWeight: 'normal',color: '#0580f2',fontSize: '24'}},color: ['rgba(176, 212, 251, .1)'], series: [{name: 'Line 1',type: 'pie',clockWise: true,radius: ['75%', '85%'],itemStyle: {normal: {label: {show: false},labelLine: {show: false},}},hoverAnimation: false, data: [{value: 14,name: '01',itemStyle: {normal: {color: {// 完成的圆环的颜色colorStops: [{offset: 0,color: '#00cefc' // 0% 处的颜色}, {offset: 1,color: '#367bec' // 100% 处的颜色}]},label: {show: false},labelLine: {show: false}} }}, {name: '86',value: 20}]}]}// 使用刚指定的配置项和数据显示图表。myChart.setOption(option);window.addEventListener("resize",function(){myChart.resize();});}function echarts_2() {// 基于准备好的dom，初始化echarts实例var myChart = echarts.init(document.getElementById('echart2'));option = {title: {text: '22%',x: 'center',y: 'center',textStyle: {fontWeight: 'normal',color: '#0580f2',fontSize: '24'}},color: ['rgba(176, 212, 251, .1)'], series: [{name: 'Line 1',type: 'pie',clockWise: true,radius: ['75%', '85%'],itemStyle: {normal: {label: {show: false},labelLine: {show: false},}},hoverAnimation: false, data: [{value: 22,name: '01',itemStyle: {normal: {color: {// 完成的圆环的颜色colorStops: [{offset: 0,color: '#00cefc' // 0% 处的颜色}, {offset: 1,color: '#367bec' // 100% 处的颜色}]},label: {show: false},labelLine: {show: false}} }}, {name: '78',value: 20}]}]}// 使用刚指定的配置项和数据显示图表。myChart.setOption(option);window.addEventListener("resize",function(){myChart.resize();});}function echarts_3() {// 基于准备好的dom，初始化echarts实例var myChart = echarts.init(document.getElementById('echart3'));option = {title: {text: '10%',x: 'center',y: 'center',textStyle: {fontWeight: 'normal',color: '#0580f2',fontSize: '24'}},color: ['rgba(176, 212, 251, .1)'], series: [{name: 'Line 1',type: 'pie',clockWise: true,radius: ['75%', '85%'],itemStyle: {normal: {label: {show: false},labelLine: {show: false},}},hoverAnimation: false, data: [{value: 10,name: '01',itemStyle: {normal: {color: {// 完成的圆环的颜色colorStops: [{offset: 0,color: '#00cefc' // 0% 处的颜色}, {offset: 1,color: '#367bec' // 100% 处的颜色}]},label: {show: false},labelLine: {show: false}} }}, {name: '02',value: 90}]}]}

篇幅有限仅展示关键代码

4 项目源码获取方式

项目源码下载：/download/Seniors_DC/85662427

如果觉得《大数据毕设/课设 - 基于大数据的医疗与疾病监控大数据可视化设计与实现》对你有帮助，请点赞、收藏，并留下你的观点哦！