Echart-折线图根据区间设置折线的样式

news2025/1/22 23:47:57

根据X轴区间设置折线样式

完整配置如下:

option = {
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [150, 230, 224, 218, 135, 147, 260],
      type: 'line'
    }
  ],
  //【注】:如果一个图中有多个折线,则visualMap是一个数组
  visualMap:{
	show: false,
	type:'piecewise',
	dimension: 0,
	seriesIndex: 0, 
    pieces:[
      {
      	/*	这里的-1,3表示X轴的第几个区间,而非具体数值
      		0为区间下标,0是第1个区间,1是第二个区间...
      		gt:-1
      		lt:3 
      		上述配置的含义是,X轴区间[-1+1,3]的折线样式
      	*/
        gt:-1, 
        lt:3,
        color:"blue"
      },
      {
        gt:3,
        lt:7,
        color:"red"
      }
    ]
  }
};

效果图:
在这里插入图片描述

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

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

相关文章

ROS从入门到精通4-3:制作Docker镜像文件Dockerfile

目录 0 专栏介绍1 为什么需要Dockerfile?2 Dockerfile书写原则3 Dockerfile常用指令3.1 FROM3.2 MAINTAINER3.3 RUN3.4 ADD3.5 COPY3.6 CMD3.7 ENV3.8 EXPOSE3.9 WORKDIR3.10 ARG 4 Dockerfile构建ROS工程实例 0 专栏介绍 本专栏旨在通过对ROS的系统学习&#xff0…

springboot3.2.5+mybatis-plus导致启动报错

公司新的项目升级到了springboot3.x后,步步是坑,坑坑不同,各种疑难杂症层出不穷,让老中医也也苦不堪言,java的生态圈真让人无语,你们升级能不能认真些互相兼顾一下? 这次的项目用了springboot3…

Python自学之路--004:Python使用注意点(原始字符串‘r’\字符转换\‘wb’与‘w区别’\‘\‘与‘\\’区别)

目录 1、原始字符串‘r’ 2、字符转换问题 3、open与write函数’wb’与’w’区分 4、Python里面\与\\的区别 1、原始字符串‘r’ 以前的脚本通过Python2.7写的,通过Python3.12去编译发现不通用了,其实也是从一个初学者的角度去看待这些问题。 其中的\…

春风拂面,深入浅出:Bean 处理器揭秘 Spring Boot 启动之谜

春风拂面,深入浅出:Bean 处理器揭秘 Spring Boot 启动之谜 在 Spring Boot 开发中,Bean 处理器扮演着至关重要的角色,犹如幕后英雄般默默地为应用启动过程添砖加瓦。然而,对于许多开发者来说,Bean 处理器依…

文档分类FastText模型 (pytorch实现)

文档分类FastText FastText简介层次softmaxN-gram特征FastText代码(文档分类) FastText简介 FastText与之前介绍过的CBOW架构相似,我们先来会议一下CBOW架构,如下图: CBOW的任务是通过上下文去预测中间的词&#xff0…

项目管理重点及笔记【太原理工大学24年】

为了自己复习写的,可能会有不清楚,可以选择性看可以讨论,但别骂我写的什么烂东西,,,(电脑看排版更好看些) 目录 一、IT项目管理概述 二、IT项目组织环境与管理过程 三、整体管理 四、…

使用httpx异步获取高校招生信息:一步到位的代理配置教程

概述 随着2024年中国高考的临近,考生和家长对高校招生信息的需求日益增加。了解各高校的专业、课程设置和录取标准对于高考志愿填报至关重要。通过爬虫技术,可以高效地从各高校官网获取这些关键信息。然而,面对大量的请求和反爬机制的挑战&a…

【汇编】算术指令

一、加法指令 (一)各加法指令的格式及操作 加法指令可做字或字节运算 (1)加法指令 ADD 格式:ADD DST,SRC执行的操作:(DST) ← (SRC)(DST) (2)带进位加法指令 ADC 格式&#xf…

【C语言】自定义类型之---结构体超详解(结构体的定义使用、指针结构体,内存对齐,......代码详解)

目录 前言: 一:结构体 1.1:什么是结构体? 1.2:结构体类型的声明 1.3:结构体变量的定义 1.4:结构体的内存对齐 1.5:结构体传参 二:位段 2.1:位段是什…

反爬-简单滑块思路,秒了~

文章目录 找图片的返回包curl 大法获取图片链接ddddocr分析距离看结果秒了~ 本文仅供参考学习,如有侵权,请联系作者删。 目标地址:aHR0cHM6Ly9pZHMuZ2RpdC5lZHUuY24vYXV0aHNlcnZlci9sb2dpbj9zZXJ2aWNlPWh0dHBzOi8vd2JkdC5nZGl0LmVkdS5jbi9zaG…

2024 Google I/O Android 相关内容汇总

2024 Google I/O Android 相关内容汇总 本次 Google I/O 的核心虽然是 AI ,但是 Android 也是作为主要议题出现, Android 部分可以简单分为产品和开发相关内容,接下来主要介绍这两部分的相关更新。 重点开始开发相关,内容不少 产…

2010-2024年各地级市社会信用体系建设匹配DID数据

2010-2024年各地级市社会信用体系建设匹配DID数据 1、时间:2010-2024年 2、指标:行政区划代码、年份、所属省份、地区、社会信用体系建设示范区 3、范围:310个地级市 4、来源:国家发改委 5、指标解释: 社会信用体…

webpack优化构建速度示例-babel-loader开启缓存cacheDirectory:

babel-loader 默认并没有开启缓存。尽管babel-loader有自己的缓存机制,但它并不与webpack的缓存机制相冲突。相反,它们可以协同工作,以提供最佳的构建性能。 src/index.js import {otherSomeFuction} from ./module; console.log(otherSomeF…

LeetCode322:零钱兑换

题目描述 给你一个整数数组 coins ,表示不同面额的硬币;以及一个整数 amount ,表示总金额。 计算并返回可以凑成总金额所需的 最少的硬币个数 。如果没有任何一种硬币组合能组成总金额,返回 -1 。 你可以认为每种硬币的数量是无…

Kotlin核心编程知识点-02-面向对象

文章目录 1.类和构造方法1.1.Kotlin 中的类及接口1.1.1.Kotlin 中的类1.1.2.可带有属性和默认方法的接口 1.2.更简洁地构造类的对象1.2.1.构造方法默认参数1.2.2.init 语句块1.2.3.延迟初始化:by lazy 和 lateinit 1.3.主从构造方法 2.不同的访问控制原则2.1.限制修…

24长三角A题思路+分析选题

需要资料的宝子们可以进企鹅获取 A题 问题1:西湖游船上掉落华为 mate 60 pro 手机 1. 手机掉落范围分析 物品特征:华为 mate 60 pro 手机的尺寸、重量、形状等特性。静水假设:西湖水面平静,不考虑水流影响。掉落位置&#xff…

多态:解锁面向对象编程的无限可能

1. 概述 多态(Polymorphism)是面向对象编程的三大核心特性之一(另两个是封装和继承)。多态意味着不同的对象对同一消息做出不同的响应。简单来说,多态允许你使用父类引用指向子类对象,并且当调用方法时&am…

Jmeter使用While控制器

1.前言 对于性能测试场景中,需要用”执行某个事物,直到一个条件停止“的概念时,While控制器控制器无疑是首选,但是在编写脚本时,经常会出现推出循环异常,获取参数异常等问题,下面总结两种常用的…

如何看待Agent的爆火

在2023年3月,一个名为AutoGPT的框架项目引发了一场AI Agent热潮。这个项目利用大型语言模型,将大任务拆分成小任务,并使用工具完成它们。这种技术将大语言模型处理语言、创造内容和逻辑推理的能力扩展到了应用场景中,还加入了感知…

代码随想录——填充每个节点的下一个右侧节点指针 II(Leetcode117)

题目链接 层序遍历 /* // Definition for a Node. class Node {public int val;public Node left;public Node right;public Node next;public Node() {}public Node(int _val) {val _val;}public Node(int _val, Node _left, Node _right, Node _next) {val _val;left _l…