《数据可视化》-项目六

序言02延时符项目描述

利用前面部分所了解到的知识,从主流招聘网站上采集公开的招聘信息数据,经过技术处理后,由前端可视化系统对分析结果进行展示。通过项目化学习,进一步了解和掌握可视化技术的运用。项目分析目前可视化处理技术也非常多,本项目通过一个实例项目进行引导,完成对可视化技术的运用。下面跟随我们一起完成招聘分析监控系统的开发。学习的过程中,积极搜集和翻阅更多资料进行知识点的强化。03OPTION数据可视化0301OPTION02OPTION系统需求项目实施目录页延时符系统需求1.功能需求2.系统模块划分04任务12.数据库表结构05功能需求

从主流招聘网站采集公开的招聘信息数据完成招聘分析监控系统,通过对"脏"数据清洗后,利用分布式存储对其进行保存,采用离线数据分析的方法对存储的数据进行分析后,再利用可视化技术将分析结果进行图形图像的展示。数据可视化子系统主要包含如下功能。①支持数据可视化图表,提供各图表信息的动态加载及局部刷新功能。②支持基于B/s结构的可视化界面,提供基于特定信息的数据查询。③提供高可扩展web端界面框架,可实现快速开发及扩展。数据可视化子系统由web前端、数据处理层构成,数据库采用Mys0L存储可视化数据。webUI用来完成前端界面数据的获取,并使用获取到的数据对展示页面进行渲染,最终以B/s架构用户交互页面进行信息展示。06系统模块划分全局信息数据可视化模块指定标签数据可视化模块全局信息数据可视化模块通常为前端开发的首页,以展示总体数据为主,方便用户在最短的时间内能看到最有用的职位招聘信息数据,并能够对内容信息产生兴趣。招聘市场分析平台主要显示招聘需求地域分布、各标签职位数量分布、职位数量Top20、职位数量变化趋势等图表。按照专业网页设计流程,指定标签数据可视化模块为次级页层级。次级页与首页属于从属关系,也就是对首页Tag部分的详细展示页面。主要显示各岗位职位数量、各岗位职位数量分布、职位数量月度变化趋势等。07数据库表结构数据库服务器使用MySQL,运行项目之前,要准备好项目所需的数据库。随后找到项目根目录下的db_visualization_system.sql文件，在db_visualization_system数据库中运行该SQL文件，将测试数据导人数据库中。项目实施1.环境配置14任务22.页面布局3.模板组件引用4.API接口5.API功能实现08配置环境在./webapp/config.py项目配置文件下有连接数据库地址与用户密码,根据需要修改数据库连接信息。初次运行项目时,要先进行数据库迁移。数据库迁移操作如下:删除migrations目录,下面三步完成model定义的表结构向数据库的迁移,并且会在项目下生成migrations/目录,保存数据库每次变更的内容。09页面和布局(1)首页主要布局格式首页主要布局包含五部分:标题在顶部,左上角为区域分布,中间为职位分布饼状图,右边是职位排行表格,最下边是职位数量变化折线图。折线图展示的是一个很长时间内一个职位数量的变化趋势,所以采用的是一个宽矮的格局。至于重量级别,都处在一个相等的水平等级,因此布局大小只是根据图表适合的宽、高来排列。次级页面展示的信息相对详细,除了包含针对当前职位的整体的分析数据外,还包含该职位下各个岗位的详细信息。其中,整体信息主要通过柱状图、饼状图、折线图等进行展示,而各个岗位信息主要通过折线图、词云、地图等进行展示。(2)次级页面布局格式模板组件引用首页模板文件位于项目的webapp/templates/index.html中:次级模板文件位于项目的webapp/templates/tagdata.html中:可以根据项目需求进行修改09API接口项目使用统一的API与数据库进行交互,所有的API定义在dataserivce/data.py文件中09API功能实现需要实现接口：全部标签列表接口首页根据标签的职位数量统计柱状图接口首页根据标签的职位数量实现饼状图接口首页根据岗位的职位数量实现饼状图接口具体标签统计页根据岗位的月度职位数量统计接口职位数量地区分布统计接口具体标签统计页根据岗位的技能词数量统计接口数据可视化1.全局信息数据可视化14任务32.指定标签数据可视化09全局信息数据可视化全局信息数据可视化的逻辑处理主要在./webserivice/index.py文件的getindex()方法中。获取职位排行表格中的数据在模板文件index.html中实现数据可视化(2)职位分布(1)职位排行获取职位分布数据在模板文件index.html中画饼状图(3)职位数量变化获取月度职位数量数据在模板文件index.html中画折线图10指定标签数据可视化指定标签数据可视化的逻辑处理主要在./webserivice/index.py文件中的getdata（)方法中。(1)职位数量获取职位数量数据在模板文件tagdata.html中画柱状图(2)岗位分布获取岗位分布数据在模板文件tagdata.html中画饼状图