vue echarts k线图 标记点根据条件设置颜色

news2024/10/4 12:36:27

 

 1. 数据格式{属性1, 属性2, 属性3, 属性4{属性4.1, 属性4.2, 属性4.3}}


{symbol: 'circle', 
    symbolSize: 0,
    xAxis: '2023-01-01 08:36:00', 
    yAxis: '0.06968924', 
    label: {
        fontStyle: 'normal', 
        fontSize: 13, 
        color: 'blue'
            }
}

2. 自定义局部function 拼装数据

// data 是 自定义标记点数据, 也可以是后端请求来的数据
// 这里data={'xAxis': "2023-01-01 06:50:00", 'yAxis': "0.06989846" , 'value':'B'}

        if (!data) return []
          const newDataArray = []
          for (let unit of data) {
            let obj = {}
            if (unit['value'] === 'B') {
              obj.symbol = 'circle'

            } else {
              obj.symbol = 'circle'
            }
            obj.symbolSize = 0
            obj.xAxis = unit['xAxis']
            obj.yAxis = unit['yAxis']
            obj.value = unit['value']
            if (unit['value'] === 'B') {
              obj.label = { fontStyle: 'normal', fontSize: 13, color: 'blue' }

            } else {
              obj.label = { fontStyle: 'normal', fontSize: 13, color: 'black' }
            }
            newDataArray.push(obj)
          }

3. markPoint 使用 拼装后的数据

 series: [
          {
             markPoint: {
             data: newDataArray,
                },
  }
]

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

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

相关文章

element-ui el-tree功能应用

1.目录节点搜索功能&#xff1a; <el-tree>:filter-node-method"filterNode"</el-tree>//添加监听watch: {search(val) {this.$refs.tree.filter(val)}},// 树搜索filterNode(value, data) {if (!value) return truereturn data.name.indexOf(value) ! -…

安装MySQL实现远程访问链接---无需本地访问

文章目录 1. 安装Mysql2. 安装phpMyAdmin3. 修改User 表4. 本地测试连接5. 安装cpolar6. 配置公网访问地址7. 固定连接公网地址 转载自cpolar极点云文章&#xff1a;群晖NAS 安装 MySQL远程访问连接 群晖安装MySQL具有高效、安全、可靠、灵活等优势&#xff0c;可以为用户提供一…

mysql索引之B+树

1.概述 提到B树就不得不提及二叉树&#xff0c;平衡二叉树和B树这三种数据结构了。B树就是从他们三个演化来的。众所周知B树是一种常见的数据结构&#xff0c;被广泛应用于数据库和文件系统等领域&#xff0c;B树的设计目标是保持树的平衡性&#xff0c;以提供稳定的性能&…

磐石呼叫中心系统经常被UDP攻击的解方法

语音系统经常被UDP攻击&#xff0c;UDP攻击是一种常见的网络攻击形式&#xff0c;经常针对语音、视频和在线游戏等实时传输数据的应用程序。攻击者使用大量的UDP数据包向目标服务器发送请求&#xff0c;导致服务器过载&#xff0c;使其无法处理有效的请求&#xff0c;从而导致服…

01-基本数据类型和注释

基本数据类型 使用编程语言进行编程时&#xff0c;需要用到各种变量来存储各种信息。变量保留的是它所存储的值的内存位置。这意味着&#xff0c;当您创建一个变量时&#xff0c;就会在内存中保留使用一些空间。 您可能需要存储各种数据类型&#xff08;比如字符型、整型、浮…

C++数据结构笔记(3)线性表的链式存储底层实现

本系列的帖子并不包含全部的基础知识&#xff0c;只挑一部分最核心的知识点总结&#xff0c;着重于具体的实现细节而并非理论的知识点总结&#xff0c;大家按需阅读学习。 链表的核心概念总结如下&#xff1a; 1.链式存储不需要连续的内存空间 2.链表由一系列的结点组成&…

阿里云ECS U实例评测

参与ECSU实例评测&#xff0c;申请免费体验机会&#xff1a;https://developer.aliyun.com/mission/review/ecsu What u1实例是什么&#xff1f; u1实例本质上还是ecs服务器&#xff0c;但是是阿里云推出的一种新型实例规格族 阿里云根据使用场景和业务场景将ecs划分为不同的…

如何使用低代码推动企业数字转型

企业创建其所需数字解决方案的方式和速度正在发生历史性变化。企业可以通过各种方式来实现这一转型&#xff0c;低代码作为其中一种转型方式&#xff0c;也越来越受到企业的喜欢&#xff0c;帮助企业适应不断变化的条件。下面我们用天翎低代码平台为例&#xff0c;浅谈一下&…

人脸考勤签到升级篇

目录 编写签到成功页面&#xff08;移动端&#xff09; 实现考勤成功页面&#xff08;持久层&#xff09; 实现考勤成功页面&#xff08;业务层&#xff09; 实现考勤成功页面&#xff08;Web层&#xff09; 一、查询用户的入职日期 二、实现查询考勤结果的Web方法 实现…

8年资深测试总结,性能测试-性能内存详解,揭秘你的疑惑...

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 缓存 从 free 命令…

python实现基于SVD矩阵分解的电影推荐系统设计

大家好&#xff0c;我是带我去滑雪&#xff01; SVD 是一种矩阵分解技术&#xff0c;通过将空间维数从 N 维降到 K 维&#xff08;其中K<N&#xff09;来减少数据集的特征数。在推荐系统中&#xff0c;SVD 被用作一种协同过滤技术。使用矩阵结构&#xff0c;其中行表示用户&…

CC2530 外部中断配置步骤

第一章 硬件原理图分析 第二章 配置按键中断步骤

Python:通过飞书API接口发送通知消息

通过飞书发送应用消息&#xff0c;及时收到线上异常消息 总的来说&#xff0c;飞书消息发送的前戏&#xff0c;要比企业微信和钉钉稍复杂 相关连接 官网 https://www.feishu.cn/管理后台 https://www.feishu.cn/admin开放平台 https://open.feishu.cn/ 参数准备 首先&…

JS中的函数与数组

文章目录 函数的定义与调用①、函数定义②、函数调用 函数的参数与返回值let与var关键字区别创建数组并使用数组遍历 函数的定义与调用 ①、函数定义 函数定义有三种方式&#xff1a; 第一种&#xff1a;function 函数名(){ 函数体 } 第二种&#xff1a;定义变量的语法&…

LITE TRANSFORMER WITH LONG-SHORT RANGE ATTENTION

1.摘要 在这篇论文中&#xff0c;我们提出了一种高效的移动NLP架构——Lite Transformer&#xff0c;以在边缘设备上部署移动NLP应用。Transformer已经成为自然语言处理&#xff08;例如机器翻译、问答系统&#xff09;中无处不在的技术&#xff0c;但要实现高性能需要大量计算…

Elasticsearch 初步使用

本文是 Elasticsearch官方博客文档 阅读笔记记录&#xff0c;详细内容请访问官方链接&#xff0c;本文只做重点记录 index索引 对于经常看 Elastic 英文官方文档的开发者来说&#xff0c;我们经常会看到 index 这个词。在英文中&#xff0c;它即可以做动词&#xff0c;表示建…

ASP.Net Core Web API快速搭建后台服务搭载SQLServer+FreeSQL(一)

目录 一.建立WebAPI所需要的环境 1. IDE编辑器&#xff1a;VisualStudio2019 2.数据库安装&#xff1a;SqlServer 3.下载SQL Server Management Studio (SSMS) 二.创建ASP.Net Core Web API工程 1.创建模板工程 2. 试运行案例接口 3.安装FreeSQL工具包 三.设计数据库 启…

《养生大世界》简介及投稿要求

《养生大世界》简介及投稿要求 《养生大世界》是由国家新闻总署备案&#xff0c;中国老年保健协会主管的国家级学术期刊&#xff0c;全国公开发行正规刊物。 《养生大世界》传播健康中国文化理念&#xff0c;推动健康养生科技创新发展&#xff0c;助力健康产业惠及人民。 主…

蓝桥杯单片机竞赛主观题总结(全)(2.5W字)

前言 对于蓝桥杯的单片机竞赛&#xff0c;主观题很重要&#xff0c;占了百分之70-80的大头&#xff0c;因此主观题做得怎么样决定了比赛是否能拿奖&#xff0c;而客观题的正确率很大程度上决定了你能否获得省一&#xff0c;从而进入决赛。因此我在这里分享一期关于主观题中各个…

95道MongoDB面试题

1、mongodb是什么&#xff1f; MongoDB 是由 C语言编写的&#xff0c;是一个基于分布式文件存储的开源数据库系统。 再高负载的情况下&#xff0c;添加更多的节点&#xff0c;可以保证服务器性能。 MongoDB 旨在给 WEB 应用提供可扩展的高性能数据存储解决方案。 MongoDB 将数…