@[TOC](六、数据可视化—Echars(爬虫及数据可视化))

六、数据可视化—Echars(爬虫及数据可视化)

  • Echarts
  • 应用

Echarts

Echarts官网,很多图表等都是我们可以
https://echarts.apache.org/zh/index.html

是百度自己做的图表,后来用的人越来越多,捐给了orange组织,要想学习看官方就够了

文档有教程

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

此处已经有下载好的最小版了
在这里插入图片描述

还有另外一种方法下载,进行在线定制
在这里插入图片描述
在这里插入图片描述

选完后,上面会有绿色对勾,最下方会有直接下载即可

这个可以根据自己的业务需求进行最小化的定制
在这里插入图片描述

生活中一些科研图表等,也可能会用到此种图表,用于

在这里插入图片描述

所有的可视化最根本的是数据,而可视化效果是js的图形进行的表示

只要学会一个基本的就能会其他的了

5分钟上手echarts,官方教程

将echarts.min.js粘贴到下方

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

此处完全可以直接打开HTML观察,这个无需打开服务器,只查看测试的话

柱状图如下所示
在这里插入图片描述

此时第一个示例已经运行完成了

接下来看echarts基础概念概览

一个网页中可以有多个图表,
在这里插入图片描述

系列,在整个图中某一部分寻找对应关系

相同的数据源可以有不同的表示效果

Option选项,通过里面的参数可以使图表显示成自己想要的效果

当我们在实例中看到自己想要的图标时,可以选择将里面的代码复制出来

下面的实例中是可以进行实时修改的
在这里插入图片描述

上图左侧的代码是script中的代码
在这里插入图片描述

应用

使用豆瓣分析的网站演示

在这里插入图片描述

在这里插入图片描述

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

在这里插入图片描述

如何找到需要修改的参数
通过查看别人的实例,自己进行实时修改,将别人里面的一些东西进行复制到自己的例子中测试其功能

在这里插入图片描述

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

在这里插入图片描述

通过看别人的案例,找到自己想要某部分,然后复制更改

样子选好了,只需要更改里面的data内容就行了,即横坐标内容,纵坐标的数值

在这里插入图片描述

在这里插入图片描述

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

在展示之前,先保证SQL语句的正确

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

@app.route('/score')                             #访问根路径
def score():score_data = []         #评分的种类num_data = []           #每个评分对应的电影数量con = sqlite3.connect("movie.db")  # 连接数据库,路径当前路径cur = con.cursor()  # 游标定义#下方语句可在数据库测试sql = "select score,count(score) from movie250 group by score"  # 从从数据库表movie250中查找分数和有多少个分数,按评分进行分组data = cur.execute(sql)for item in data:score_data.append(item[0])  # 得到的数据要保存到列表中,否则后面关闭时会丢失信息num_data.append(item[1])cur.close()con.close()return render_template("score.html",score_data=score_data,num_data=num_data)    #传递变量到页面中

在这里插入图片描述

在这里插入图片描述

上面的都是数字的形式,直接传入页面渲染的
若是列表得到的是字符串形式的,需要在页面渲染时进行转换
App.py文件下的

score_data.append(str(item[0]))

html下的变量

data: {{ score_data|tojson }}

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

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

【ROS2】初级:客户端-创建自定义 msg 和 srv 文件

目标:定义自定义接口文件( .msg 和 .srv )并将它们与 Python 和 C节点一起使用。 教程级别:初学者 时间:20 分钟 目录 背景 先决条件 任务 1. 创建一个新包2. 创建自定义定义3 CMakeLists.txt4 package.xml5. 构建 tut…

Vue3中生成本地pdf并下载

1. 前言 前端中经常会遇到在系统中根据数据导出一个pdf文件出来,一般都是后端来实现的,既然后端可以实现,前端为什么就不行呢,正好有一次也写了这个需求,就写了个小demo 示例图: 2. 实现步骤 首先下载html2pdf.js这个库yarn add html2pdf.js // 或 npm i html2pdf.js在项…

下载,连接mysql数据库驱动(最详细)

前言 本篇博客,我讲讲如何连接数据库?我使用mysql数据库举例。 目录 下载对应的数据库jar 包 百度网盘 存有8.4.0版本压缩包:链接:https://pan.baidu.com/s/13uZtXRmuewHRbXaaCU0Xsw?pwduipy 提取码:uipy 复制这…

数据结构--二叉树和堆

目录 1.基本概念 2.树的遍历方法 3.满二叉树&&完全二叉树 4.逻辑结构&&物理结构 5.推理公式 6.二叉树应用--堆 7.简单实现堆 1.基本概念 (1)这个里面的概念还是比较多的,但是大部分我们只需要了解即可,因为…

论文略读:Large Language Models Relearn Removed Concepts

通过神经元修剪在模型编辑方面取得的进展为从大型语言模型中去除不良概念提供了希望。 然而,目前尚不清楚在编辑后模型是否具有重新学习修剪概念的能力——>论文通过在重新训练期间跟踪修剪神经元中的概念显著性和相似性来评估模型中的概念重新学习 研究结果表明…

嵌入式C语言面试相关知识——内存管理(不定期更新)

嵌入式C语言面试相关知识——内存管理(不定期更新) 一、博客声明二、自问题目1、嵌入式系统的内存布局是怎么样的?2、动态内存分配在嵌入式系统中的使用有什么注意事项?3、什么是内存碎片,如何减少内存碎片&#xff1f…

论文复现-基于决策树算法构建银行贷款审批预测模型(金融风控场景)

作者Toby,来源公众号:Python风控模型,基于决策树算法构建银行贷款审批预测模型 目录 1.金融风控论文复现 2.项目背景介绍 3.决策树介绍 4.数据集介绍 5.合规风险提醒 6.技术工具 7.实验过程 7.1导入数据 7.2数据预处理 7.3数据可…

Linux muduo 网络库

主要记录示意图和知识点框架: 1、阻塞、非阻塞、同步、异步 在处理IO的时候,阻塞和非阻塞都是同步IO,只有使用了特殊的API才是异步IO。 2、五种IO模型: 阻塞、非阻塞、IO复用、信号驱动、异步IO 3、muduo网络库 muduo网络库给用…

搭建基础库~

前言 项目中会用到工具库、函数库以及一些跟框架绑定的组件,如果这些基础模块每个项目都实现一套,维护起来那真的头大,你说呢😉 搭建流程 准备工作 创建文件夹myLib、安装Git以及pnpm 目录大概就系这样子: myLib ├…

哈希表——C语言

哈希表(Hash Table)是一种高效的数据结构,能够在平均情况下实现常数时间的查找、插入和删除操作。 哈希表的核心是哈希函数,哈希函数是一个将输入数据(通常称为“键”或“key”)转换为固定长度的整数的函数…

python操作SQLite3数据库进行增删改查

python操作SQLite3数据库进行增删改查 1、创建SQLite3数据库 可以通过Navicat图形化软件来创建: 2、创建表 利用Navicat图形化软件来创建: 存储在 SQLite 数据库中的每个值(或是由数据库引擎所操作的值)都有一个以下的存储类型: NULL. 值是空值。 INTEGER. 值是有符…

刷爆leetcode第十期

题目一 相同的树 给你两棵二叉树的根节点 p 和 q ,编写一个函数来检验这两棵树是否相同。 如果两个树在结构上相同,并且节点具有相同的值,则认为它们是相同的。 首先我们要来判断下它们的根是否相等 根相等的话是否它们的左子树相等 是否…

06.C2W1.Auto-correct

往期文章请点这里 目录 OverviewAutocorrectWhat is autocorrect?How it works Building the modelMinimum edit distanceMinimum edit distance algorithmMinimum edit distance Part 2Minimum edit distance Part 3 往期文章请点 这里 Overview 本周学习目标:…

Spring源码十七:Bean实例化入口探索

上一篇Spring源码十六:Bean名称转化我们讨论doGetBean的第一个方法transformedBeanName方法,了解Spring是如何处理特殊的beanName(带&符号前缀)与Spring的别名机制。今天我们继续往方法下面看: doGetBean 这个方法…

CDNOW_master.txt数据分析实战

一、数据详情 该数据集是常见的销售数据集,数据展示的是美国1997后的商品销售数据。包含四个字段,分别是用户id,购买时间,销售量,与销售金额。 二、数据读取与数据清洗 导入必要的包 \s代表的许多空格作为分割,names重…

实现antd designable平台的组件拖拽功能

平台:designable设计器 github:designable 目录 1 背景2 技术栈3 组件拖拽和放置3.1 类型定义3.2 拖拽3.3 放置 1 背景 由于业务需求,我们需要实现designable平台的一个简易版的组件拖拽功能。 #mermaid-svg-QrxSDGe9YyGG3LbQ {font-family:…

CSS学习(三大特性 盒子模型)

目录 Emmet语法 1.快速生成HTML结构语法 2.快速生成CSS样式语法 CSS的复合选择器 后代选择器 子选择器 并集选择器 伪类选择器 链接伪类选择器 focus伪类选择器 CSS的三大特性 层叠性 继承性 优先级 CSS盒子模型 组成 边框 边框 内边距 外边距 块级盒子水…

GESP C++一级真题

PDF图片1-7 点赞❤️关注😍收藏⭐️ 互粉必回🙏🙏🙏

用ThreadLocal解决线程隔离问题

存在的以下代码所示的线程隔离问题: package study.用ThreadLocal解决线程隔离问题;/*线程隔离 - 在多线程并发场景下,每个线程的变量都应该是相互独立的线程A:设置(变量1) 获取(变量1)线程B&a…

Agilent 安捷伦 DSO91304A 高性能示波器

Agilent 安捷伦 DSO91304A 高性能示波器 DSO91304A Infiniium 高性能示波器:13 GHz 13 GHz4个模拟通道高达 1 Gpts 存储器和 40 GSa/s 采样率可以提供更完整的信号迹线捕获更低的本底噪声(50 mV/格时为 1.73 mVrms)和深入的抖动分析功能能够…