echarts双折线图

引用

//反应时长 durationCharts
categoryCommonChart(studyBehavior.durationCharts, 'durationCharts') 
function categoryCommonChart(odata, dom){var myChart = echarts.init(document.getElementById(dom));let oarr = []oarr = odata.series.map(function(item){let color = item.name == '个人平均' ? '#00bdff' : '#4cf100'return {name: item.name,type: 'line',data: item.data,	lineStyle: {color: color //折线颜色},itemStyle: {color: color //节点颜色}}})option = {tooltip: {trigger: 'axis'},grid: {top: '30',left: '15',right: '20',bottom: '30',containLabel: true},legend: {itemWidth:15,  itemHeight:15,  data: odata.legendData,icon: 'roundRect',itemHeight: 8,textStyle: { //图例文字的样式color: '#999',fontSize: 12},left: 'center',bottom: 'bottom',},title: {text: '均次时长',left: '20',textStyle:{color: '#999',fontSize: 12,fontWeight: 400},			   	},grid: {top: '30',left: '15',right: '20',bottom: '30',containLabel: true},xAxis: {type: 'category',data: odata.xData,nameTextStyle: {color: '#666', //y轴名称颜色fontSize: 10 //y轴名称字体大小},axisLabel: {color: '#666', //x轴刻度标签颜色},axisTick: {show: false //不显示刻度线},axisLine: {lineStyle: {color: '#999',width: 1, //这里是为了突出显示加上的  },symbol: ['none', 'arrow'],    //只在末端显示箭头symbolSize: [6, 10],//原来是[8, 16]symbolOffset:[0, 8],//箭头段移动8个像素},},yAxis: {type: 'value',		    	nameTextStyle: {color: '#666', //y轴名称颜色fontSize: 10 //y轴名称字体大小},axisLabel: {color: '#666', //x轴刻度标签颜色formatter: '{value}s' //加上单位's'},axisTick: {show: false //不显示刻度线},splitLine: {//网格线lineStyle: {type: "dotted", //设置网格线类型 dotted:虚线   solid:实线},show: true, //隐藏或显示},axisLine: {lineStyle: {color: '#999',width: 1},                    symbol: ['none', 'arrow'],symbolOffset: 10,symbolSize: [6, 10]//原来是[8, 16]},                },series: oarr};myChart.setOption(option, true);
}

data

         "durationCharts":{"legendData":["个人平均","班级平均"],"type":"line","xData":["第1题","第2题","第3题"],"series":[{"name":"个人平均","type":"line","data":[23,4,7]},{"name":"班级平均","type":"line","data":[31,10,11]}]},"participationRate":66.7},

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

随笔-这都是命吗

我与鹏哥、小付有个小群,前几天,鹏哥在群里发了一个图,是他那个城市准备扶持的高新产业,有元宇宙、量子信息、生物制药、人工智能什么的。 先前的时候鹏哥给我说过,当地准备了六百多亩地,准备发展高新产业…

Linux-进程之间的通信

目录 ​编辑 一.什么是进程之间的通信 二.进程之间的通信所访问的数据 三.进程之间的通信是如何做到的 四.基于内存文件级别的通信方式——管道 1.什么是管道 2.管道的建立过程——匿名管道 a.什么是匿名管道 b.匿名管道特点: c.使用匿名管道的…

风格迁移网络修改流程(自用版)

一. AdaAttN-Revisit Attention Mechanism in Arbitrary Neural Style Transfer(ICCV2021) 下载vgg_normalised.pth打开visdom python -m visdom.server在 train_adaattn.sh 中配置 content_path、style_path 和 image_encoder_path,分别表…

固态硬盘速度测试:硬盘实际性能是否符合标准?

在进行固态硬盘速度测试之前我们先来了解一下固态硬盘的读写速度是什么。固态硬盘的读写速度主要分为顺序读写和随机读写(4K)。 ​顺序读写:指的是硬盘在读写连贯、集中大文件时候的速度。比如在读取、拷贝单个视频文件时,就是硬盘…

【项目问题解决】IDEA2020.3 使用 lombok 插件 java: 找不到符号 符号: 方法 builder()

目录 lombok找不到符号问题修改 1.问题描述2.问题原因3.解决思路4.解决方案5.总结6.参考 文章所属专区 项目问题解决 1.问题描述 IDEA2020.3 使用 lombok 插件 java: 找不到符号 符号: 方法 builder(),无法使用lombok下应有的注解,一度怀疑是版本问题 …

使用Inno Setup 打包程序文件 怎么把其中一个文件安装时复制到指定系统文件夹

环境: Inno Setup 6.6 Win10 专业版 问题描述: 使用Inno Setup 打包程序文件 怎么把其中一个文件安装时复制到指定系统文件夹 将文件api-ms-win-shcore-scaling-l1-1-1.dll复制到system32里面 解决方案: 1.由于安全和权限的限制,直接在Inno Setup脚本中复制文件到C:\…

C++新经典模板与泛型编程:用成员函数重载实现std::is_class

用成员函数重载实现is_class std::is_class功能,是一个C11标准中用于判断某个类型是否为一个类类型(但不是联合类型)的类模板。当时在讲解的时候并没有涉及std::is_class的实现代码,在这里实现一下。简单地书写一个IsClass类模板…

python pydoc生成API文档

pydoc是python内置的一个文档生成模块。 pydoc 模块会根据 Python 模块来自动生成文档。 生成的文档可在控制台中显示为文本页面,提供给 Web 浏览器访问或者保存为 HTML 文件。 对于模块、类、函数和方法,显示的文档内容取自文档字符串(即 _…

泰凌微(Telink)8258配置串口收发自定义数据

在官网下载SDK后(以Mesh SDK为例)使用Eclipse打开,对应MCU的配置文件在app_config_8258.h,默认的HCI接口是HCI_USE_NONE,如果改成HCI_USE_UART后可以通过串口收发数据,此时默认接收函数处理的是以Telink的协…

音视频学习(二十)——rtsp收流(udp方式)

前言 本文主要介绍通过udp方式实现rtsp拉流。 流程图 流程说明: 相较于tcp方式“信令数据”复用同一连接拉流,udp方式拉流“信令数据”采用不同的连接,信令传输采用tcp,流数据传输采用udp;客户端向服务端&#xff0…

数据库增删改查(CRUD)进阶版

目录 数据库约束 约束类型 表的设计 1.一对一 2.一对多 3.多对多 增删查改进阶操作 1. 插入查询结果 2.查询 聚合查询 聚合函数 group by having 联合查询 内连接 外连接 自连接 子查询 合并查询 数据库约束 创建表的时候制定的一些规则,在后续…

智能优化算法应用:基于北方苍鹰算法无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用:基于北方苍鹰算法无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用:基于北方苍鹰算法无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.北方苍鹰算法4.实验参数设定5.算法结果6.参考…

生成式人工智能笔记-AIGC笔记

生成式人工智能笔记-AIGC笔记 十多年前,人工智能还只是一个不被人看好的小众领域,但是现在,它却已经成了街头巷尾的热点谈资,几乎任何事情都可以和人工智能联系在一起。 人工智能包括基础层、技术层和应用层。 基础层是人工智能…

收藏!当今最流行的10 种人工智能算法

人工智能的概念始于1956年的达特茅斯会议,由于受到数据、计算力、智能算法等多方面因素的影响,人工智能技术和应用发展经历了多次高潮和低谷。 2022年以来,以ChatGPT为代表的大模型一夜爆火,它能够基于在预训练阶段所见的模式和统…

Python中如何判断List中是否包含某个元素

更多资料获取 📚 个人网站:ipengtao.com 在Python中,判断一个列表(List)是否包含某个特定元素是常见的任务之一。在本文中,将深入探讨多种判断List成员包含性的方法,并提供丰富的示例代码&…

每日一题:LeetCode-11.盛水最多的容器

每日一题系列(day 13) 前言: 🌈 🌈 🌈 🌈 🌈 🌈 🌈 🌈 🌈 🌈 🌈 🌈 🌈 &#x1f50e…

solidity案例详解(六)服务评价合约

有服务提供商和用户两类实体,其中服务提供商部署合约,默认诚信为true,用户负责使用智能合约接受服务及评价,服务提供商的评价信息存储在一个映射中,可以根据服务提 供商的地址来查找评价信息。用户评价信息&#xff0c…

添加新公司代码的配置步骤-Part1

原文地址:配置公司代码 概述 我们生活在一个充满活力的时代,公司经常买卖子公司。对于已经使用 SAP 的公司来说,增加收购就成为一个项目。我开发了一个电子表格,其中包含向您的结构添加新公司代码所需的所有配置更改。当然&…

虚拟数据优化器VDO

本章主要介绍虚拟化数据优化器。 什么是虚拟数据优化器VDO创建VDO设备以节约硬盘空间 了解什么是VDO VDO全称是Virtual Data Optimize(虚拟数据优化),主要是为了节省硬盘空间。 现在假设有两个文件file1和 file2,大小都是10G。file1和 f…

java学习part40collections工具类

162-集合框架-Collections工具类的使用_哔哩哔哩_bilibili 1.collections工具类 感觉类似c的algorithm包,提供了很多集合的操作方法 2.排序 3.查找 4.复制替换 5.添加,同步