六、数据可视化—flask框架入门(爬虫及数据可视化)

六、数据可视化—flask框架入门(爬虫及数据可视化)

  • 1,数据可视化简介
  • 2,flask
    • (1)创建flask项目
    • (2)开启debug模式
    • (3)通过访问路径传递参数
    • (4)加入渲染模板,渲染HTML文件
      • (4-1)普通变量
      • (4-2)列表变量
      • (4-3)字典变量
    • (5)用户表单提交

1,数据可视化简介

  数据可视化主要旨在借助于图形化手段,清晰有效地传达与沟通信息,为了更多人都可以理解使用。
  我们希望不同平台有着不同效果的展现,如pc端能访问,安卓能访问,车载电脑能访问等;希望统一数据的不同视觉效果,看到增长-折线图,地域分布-地图,比例-饼状图。使用web框架及图表js框架等即可达到此效果。

python的web框架:
Django,最有名,大而全,但对于初学者是有一定门槛的
Flask,非常的简单,就两个功能,一个路由转发,一个模板渲染

后续可视化操作中涉及到的相关框架:
Flask是用来做网站的一个框架
Echarts各种开源图表的js框架
Wordcloud词云通过图形图像的方式显示字词的词频效果

2,flask

(1)创建flask项目

如何在pycharm快速创建一个具有flask框架的项目

点击左上角file,newproject

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

from flask import Flask         #从flask包中引入Flask模块

app = Flask(__name__)           #通过默认的名字,初始化了全局对象


#此处是flask完成定制的内容
#路由解析,通过用户访问的路径匹配相应的函数
@app.route('/')
def hello_world():
    return '你好!'           #注意默认没有开启debug模式(程序发布状态),所以此处的修改不会实时显示到服务器,可以重启服务器


if __name__ == '__main__':
    app.run()                   #调用对象,run方法就是服务器监听端口

注意默认没有开启debug模式(程序发布状态),所以此处的修改不会实时显示到服务器,可以重启服务器

(2)开启debug模式

如何在pycharm中开启debug模式

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

改为debug模式后,直接点击刷新浏览器就可以显示修改后的内容了(注意修改后要保存)

from flask import Flask         #从flask包中引入Flask模块

app = Flask(__name__)           #通过默认的名字,初始化了全局对象


#此处是flask完成定制的内容
#路由解析,通过用户访问的路径匹配相应的函数
@app.route('/')                 #此处是通过http://127.0.0.1:5000/ 路径下,下方在此路径下进行的回应,
                                # 若是改成@app.route('/test') 在/路径下就访问不到了 ,需要改成 http://127.0.0.1:5000/test可访问
def hello_world():
    return '欢迎!'           #注意默认没有开启debug模式(程序发布状态),所以此处的修改不会实时显示到服务器,可以重启服务器

#只需要两步,1定义访问的路径,2.返回的内容
@app.route('/index')
def hello():
    return '你好!'

if __name__ == '__main__':
    app.run()                   #调用对象,run方法就是服务器监听端口

初学者在进行编写时,一定要开启debug模式,帮助即时查看修改效果,还能更好的锁定错误位置
下方加入未定义的变量

def hello_world():
    return '欢迎!'+name           #注意默认没有开启debug模式(程序发布状态),所以此处的修改不会实时显示到服务器,可以重启服务器

在这里插入图片描述

(3)通过访问路径传递参数

在程序中接着添加一下内容

#当有参数传递过来时,如何进行
#通过访问路径,获取用户的字符串参数
@app.route('/user/<name>')       #用户访问时,网址后面有/<name>,拿到name变量传入函数welcom(name)
def welcom(name):
    return '你好!,%s'%name

#通过访问路径,获取用户的数字整型参数
@app.route("/user/<int:id>")       #<int:id>是固定写法,用户访问时,网址后面有
def welcom2(id):
    return '你好!,%d号的会员'%id

在这里插入图片描述

在这里插入图片描述

#路由路径不能重复,用户只能通过唯一路径访问特定的函数,若前方相同则传递的参数类型不能相同

@app.route('/index')		#前两句,Werkzeug判断那个路径执行那个函数
def hello():
    return '你好!'		#返回通过Jinja2进行HTML页面等的返回

在这里插入图片描述

(4)加入渲染模板,渲染HTML文件

from flask import Flask,render_template         #从flask包中引入Flask模块,render_template渲染模板可以将HTML文件渲染出来

#用来返回HTML网页
@app.route('/index2')
def index2():
    return render_template("index.html")    #返回渲染模板的html(html是已经在templates文件中存在的)

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

渲染成功后的结果如下所示
在这里插入图片描述

要在使用时,网页不仅仅是显示已经准备好的东西

有的时候还要显示一些从数据库中查询的东西

此时需要向页面传递一些变量

(4-1)普通变量

from flask import Flask,render_template         #从flask包中引入Flask模块,render_template渲染模板可以将HTML文件渲染出来

app = Flask(__name__)           #通过默认的名字,初始化了全局对象

#向页面传递一个变量
import datetime          #引入时间的包,显示时间
@app.route('/index3')
def index3():
    time = datetime.date.today()            #只显示今天的日期,普通变量
    return render_template("index.html",var = time)    #向HTML页面传递参数,会将HTML中的双大括号里的变量进行替换渲染

if __name__ == '__main__':
    app.run()                   #调用对象,run方法就是服务器监听端口

在这里插入图片描述

在这里插入图片描述

(4-2)列表变量

#向页面传递一个变量
import datetime          #引入时间的包,显示时间
@app.route('/index3')
def index3():
    time = datetime.date.today()            #只显示今天的日期,普通变量
    name = ["小张","小王","小赵"]                    #列表类型
    return render_template("index.html",var = time,list=name)    #向HTML页面传递参数

在这里插入图片描述
在这里插入图片描述

(4-3)字典变量

#向页面传递一个变量
import datetime          #引入时间的包,显示时间
@app.route('/index3')
def index3():
    time = datetime.date.today()            #只显示今天的日期,普通变量
    name = ["小张","小王","小赵"]                    #列表类型
    task = {"任务":"打扫卫生","时间":"3小时"}         #字典类型
    return render_template("index.html",var = time,list=name,task = task)    #向HTML页面传递参数

表格的显示,一下为HTML语句
任务:

<br/>            <!-- 了解一下,如何在页面打印表格-->
    <table border="1">
        <tr>
            <td>测试1</td>
            <td>测试2</td>
        </tr>
        <tr>
            <td>测试1</td>
            <td>测试2</td>
        </tr>
        <tr>
            <td>测试1</td>
            <td>测试2</td>
        </tr>
    </table>

下面是谷歌浏览器的显示

在这里插入图片描述

Html接收字典变量
任务:

<br/>            <!-- 了解一下,如何在页面打印表格-->
    <table border="1">
        {% for key,value in task.items() %}       <!-- 当使用task.items()时,字典变量task就变成列表类型的了[(key,value),(key,value)]-->
        <tr>
            <td>{{ key }}</td>
            <td>{{ value }}</td>
        </tr>
        {% endfor %}
    </table>

在这里插入图片描述

普通变量和列表变量,字典变量传递是一样的,不同的地方在于HTML中,var直接打印,进行for循环可对列表使用,而对字典需要先将其使用task.items()的方法进行转换拿到key和value

在这里插入图片描述

在这里插入图片描述

(5)用户表单提交

在这里插入图片描述
在这里插入图片描述

默认的表单提交方法是get的,没有说明接收的是post请求会出现下方错误
在这里插入图片描述

解决上述错误的方法如下
在这里插入图片描述

光显示不行,如何拿到用户表单提交的内容,使用request对象,在flask包中已经封装好了

from flask import Flask,render_template,request  

在这里插入图片描述

#表单提交(至少涉及两个页面加程序)
#接收表单提交的路由需要指定methods为post
@app.route('/result',methods=['POST','GET'])                 #此处意思是既可以接收POST又可以接收GET,不写默认get,也可以写单个
def result():
    if request.method == 'POST':                    #如果是使用post方法进来的,获取表单所有内容
        result = request.form                       #是将表单的name作为key,内容作为value形成字典
        return render_template("test/result.html",result=result)      #此处传进去的变量result=result,等号两边是可以相等的

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

注意:
在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/788082.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

实时温湿度监测系统:Micropython编码ESP32与DHT22模块的无线数据传输与PC端接收项目

实时温湿度监测系统 前言项目目的项目材料项目步骤模拟ESP32接线连接测试搭建PC端ESP32拷录环境对ESP32进行拷录PC端搭建桌面组件本地数据接收桌面小组件部分 实验总结 前言 人生苦短&#xff0c;我用Python。 由于我在日常工作中经常使用Python&#xff0c;因此在进行该项目…

核密度估计KDE和概率密度函数PDF(深入浅出)

目录 1. 和密度估计&#xff08;KDE&#xff09;核密度估计的基本原理核密度估计的公式核密度估计的应用Python中的KDE实现示例代码 结果解释解释结果 总结 2. 概率密度函数&#xff08;PDF&#xff09;概率密度函数&#xff08;PDF&#xff09;是怎么工作的&#xff1a;用图画…

澳大利亚TikTok直播为什么需要海外直播专线?

近年来&#xff0c;许多卖家为了解决澳大利亚TikTok直播中的卡顿和高延迟问题&#xff0c;纷纷选择使用海外直播专线。这种专线服务是一种高效、低延迟的数据传输解决方案&#xff0c;专为需要高质量网络连接的场合设计。 与公共互联网相比&#xff0c;海外直播专线提供更稳定、…

在Linux下直接修改磁盘镜像文件的内容

背景 嵌入式Linux系统通常在调试稳定后&#xff0c;会对磁盘&#xff08;SSD、NVME、SD卡、TF卡&#xff09;做个镜像&#xff0c;通常是.img后缀的文件&#xff0c;以后组装新设备时&#xff0c;就将镜像文件烧录到新磁盘即可&#xff0c;非常简单。 这种方法有个不便之处&a…

99%的人忽视了这一点:活着本身就是人生的意义,别让抑郁和内耗成为你的枷锁!

人没必要抑郁和精神内耗&#xff0c;不结婚&#xff0c;不生子&#xff0c;赚不到钱&#xff0c;没考上名牌大学&#xff0c;没有好工作等等&#xff0c;其实都没什么关系。 因为大多数人生是没有什么意义&#xff0c;或者说&#xff0c;活着就是最大的意义。 抑郁和精神内耗…

接口测试(2)

单接口测试 CtrlD 复制 因为单接口的时候主要改变测试用例数据 自动判定响应结果 postman断言 //断言响应状态码为200 pm.test("Status code is 200", function () {pm.response.to.have.status(200); }); //断言返回数据中包括&#xff08;成功&#xff09; //预期结…

14.x86游戏实战-汇编指令cmp test

免责声明&#xff1a;内容仅供学习参考&#xff0c;请合法利用知识&#xff0c;禁止进行违法犯罪活动&#xff01; 本次游戏没法给 内容参考于&#xff1a;微尘网络安全 工具下载&#xff1a; 链接&#xff1a;https://pan.baidu.com/s/1rEEJnt85npn7N38Ai0_F2Q?pwd6tw3 提…

移除元素的讲解,看这篇就够了!

一&#xff1a;题目 博主本文将用指向来形象的表示下标位的移动。 二&#xff1a;思路 1&#xff1a;两个整形&#xff0c;一个start&#xff0c;一个end&#xff0c;在一开始都 0&#xff0c;即这里都指向第一个元素。 2&#xff1a;在查到val之前&#xff0c;查一个&…

策略路由和路由策略的区别详解

先说策略路由也就是 PBR&#xff1a; 它不会影响路由表的生成&#xff0c;设备的路由表是已经存在而且稳定的。 举个例子&#xff1a; 用 TCP/IP 路由技术一书的表述就是&#xff1a;策略路由就是一个复杂的静态路由。 总结&#xff1a;策略路由是一个基于路由表的影响特定数…

Linux | 安装lb-toolkits 1.2.4库

Linux | 安装 lb-toolkits 最近又需要下载葵花的数据&#xff0c;之前分享过一次代码。今天发现之前的环境不小心被我删了&#xff0c;而运行相关的代码需要安装lb-toolkits这个库&#xff0c;今天正好记录了一下安装lb-toolkits的过程。 这里安装的版本是1.2.4&#xff0c;别…

兼容性报错--调整字符集解决

文章目录 错误解决办法Unicode 字符集(两个字节来表示一个字符)多字节字符集(一个字节来表示一个字符)如何选择字符集char与wchar_t的区别LPCSTR与LPCWSTR的区别 错误 解决办法 切换字符集类型 Unicode 字符集(两个字节来表示一个字符) 优点&#xff1a; 支持更多的字符集…

高效前端开发:解密pnpm的存储与链接

什么是pnpm PNPM&#xff08;Performant NPM&#xff09;是一种快速且节省磁盘空间的包管理工具。相较于其他包管理器如NPM和Yarn&#xff0c;PNPM通过独特的存储机制和链接技术解决了许多常见的问题。以下是PNPM如何避免这些问题以及其关键技术的详细介绍。 特性 PNPM Store…

6.Python学习:异常和日志

1.异常的抓取 1.1异常的概念 使用异常前&#xff1a; print(1/0)使用异常后&#xff1a;错误提示更加友好&#xff0c;不影响程序继续往下运行 try:print(10/0) except ZeroDivisionError:print("0不能作为分母")1.2异常的抓取 第一种&#xff1a;如果提前知道可…

[C++] 由C语言过渡到C++的敲门砖

命名空间 在C/C中&#xff0c;变量、函数和后⾯要学到的类都是⼤量存在的&#xff0c;这些变量、函数和类的名称将都存在于全局作⽤域中&#xff0c;可能会导致很多冲突。使⽤命名空间的⽬的是对标识符的名称进⾏本地化&#xff0c;以避免命名冲突或名字污染 。 在同一个工程中…

可视采耳仪器什么牌子好?年度必备五大可视耳勺品牌分享

无线可视挖耳勺作为近年来新兴的个护健康产品&#xff0c;受到了越来越多消费者的关注和喜爱。这种挖耳勺采用了先进的无线技术和高清摄像头&#xff0c;能够让人们更加清晰地观察自己耳内的状况&#xff0c;从而更加安全、有效地清洁耳朵。 但随着可视挖耳勺市场扩大&#xff…

老师怎样提高学生的听课效率?

在课堂上&#xff0c;我们常常面临一个问题&#xff1a;如何提高学生的听课效率&#xff1f;这是一个让无数教师头疼的问题。学生是否全神贯注&#xff0c;是否能够吸收和理解课堂上的知识&#xff0c;这直接关系到教学的成败。那么&#xff0c;作为教师&#xff0c;我们能做些…

可以添加todo清单桌面小组件的便签哪个好?

在我们快节奏的生活中&#xff0c;有效的时间管理和任务追踪是必不可少的。为了实现这一目标&#xff0c;许多人选择使用桌面便签&#xff0c;尤其是那些具有Todo清单桌面小组件的便签。但是&#xff0c;面对市场上众多选择&#xff0c;可以添加todo清单桌面小组件的便签哪个好…

STM32的SPI接口详解

目录 1.SPI简介 2.SPI工作原理 3.SPI时序 3.1 CPOL&#xff08;Clock Polarity&#xff0c;时钟极性&#xff09;&#xff1a; 3.2 CPHA&#xff08;Clock Phase&#xff0c;时钟相位&#xff09;&#xff1a; 3.3 四种工作模式 4.相关代码 4.1使能片选信号 4.2使能通…

vue学习day01-vue的概念、创建Vue实例、插值表达式、响应式、安装Vue开发者工具

1、vue的概念 Vue是一个用于构建用户界面的渐进式 框架 &#xff08;1&#xff09;构建用户界面&#xff1a;基于数据动态渲染页面 &#xff08;2&#xff09;渐进式&#xff1a;循序渐进的学习 &#xff08;3&#xff09;框架&#xff1a;一条完整的项目解决方案&#xff…

回溯算法-以医院信息管理系统为例

1.回溯算法介绍 1.来源 回溯算法也叫试探法&#xff0c;它是一种系统地搜索问题的解的方法。 用回溯算法解决问题的一般步骤&#xff1a; 1、 针对所给问题&#xff0c;定义问题的解空间&#xff0c;它至少包含问题的一个&#xff08;最优&#xff09;解。 2 、确定易于搜…