echarts更换主题

2023-05-16

前言

本篇文章基于上一篇文章:vue工程整合echarts,因此这里主要讲的是主题是如何配置的,其他代码在这里不再赘述。

官网中已经说明了echarts除了有默认的主题外,并且内置了dark主题,还可以加载其他非内置的主题。

内置主题

默认的主题

默认主题的部分代码如下:

 this.pieChart = this.$echarts.init(document.getElementById('pie'))

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

内置的dark主题

当把主题更改为dark时,代码如下:

 this.pieChart = this.$echarts.init(document.getElementById('pie'), 'dark')

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

加载其他主题

当想要加载其他的主题时,可以去到主题编辑器,选择指定的主题或者自定义颜色后进行下载使用。

下载主题

比如选中主题为macarons的配色,点击下载主题,由于这里是以js文件的方式引入主题,因此下载的是js文件主题:
在这里插入图片描述

引入主题

把下载的js文件放到工程目录下,并且在main.js文件中引入该主题
在这里插入图片描述

使用主题

在初始化echarts实例时,加上主题的字段即可

  // 基于准备好的dom,初始化echarts实例
  this.pieChart = this.$echarts.init(document.getElementById('pie'), 'macarons')

效果

加载主题后,最终效果如下:
在这里插入图片描述

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

echarts更换主题 的相关文章

随机推荐

  • 一步一步写算法(之 算法总结)

    声明 xff1a 版权所有 xff0c 欢迎转载 xff0c 请勿用于商业用途 联系信箱 xff1a feixiaoxing 64 163 com 自10月初编写算法系列的博客以来 xff0c 陆陆续续以来写了几十篇 按照计划 xff0c
  • 我人生的转折点

    来到兄弟连 差不多快两周的时间了 xff0c 在这里的每一天每天都觉得非常的充实 xff0c 来到这里才知道什么才做学习 xff0c 什么才叫只要努力了用功了 xff0c 用心了 xff0c 就会有成果 就如第一次的测验 xff0c 每天都
  • Canal AdminGuide

    背景 先前开源了一个开源项目 xff1a 阿里巴巴开源项目 基于mysql数据库binlog的增量订阅 amp 消费 本文主要是介绍一下如何部署 amp 使用 环境要求 1 操作系统 a 纯java开发 xff0c windows linu
  • 【Android病毒分析报告】 - Usbcleaver

    本文章由Jack Jia编写 xff0c 转载请注明出处 文章链接 xff1a http blog csdn net jiazhijun article details 9179749 作者 xff1a Jack Jia 邮箱 xff1a
  • 【浅墨著作】《逐梦旅程:Windows游戏编程之从零开始》勘误&配套源代码下载...

    I 39 m back 恩 xff0c 几个月不见 xff0c 大家还好吗 xff1f 这段时间真的好多童鞋在博客里留言说或者发邮件说浅墨你回来继续更新博客吧 woxiangnifrr童鞋说每天都在来浅墨的博客逛一下看有没有更新 xff0c
  • Anychart图表系列九之Dashboard

    Dashboard中文释义为仪表盘 控制台 xff0c 这个用词很生动 xff0c 它指的是多个图组合在一起的效果 xff0c 就像模具工作中的操作台一样由多种图形仪器组成 在项目中 xff0c 特别是高管平台 xff0c 领导看重的是多套
  • 若依前后端分离版本启动教程

    第一步 xff1a 搜索若依官网 第二步 xff1a 选择前后端分离版本 第三步 复制链接 第四步 随便在自己的电脑找找一个文件夹 xff0c 执行git命令 xff08 git安装使用教程这里不做说明 xff09 回车 96 96 96
  • char指针与char数组的区别(非常详细!)

    首先看指针 char p 61 helloworld 在这里p 是一个变量 其类型为指针类型 并且指向一个字符串 字符串内容为 helloworld 如果要访问p 2 的话 就需要先从p 中取出地址 该地址为 helloworld 的首地址
  • 大学六年我读过的一些书

    明天就是2014年 xff0c 今晚是13年最后一天 xff0c 我想不少人会写一下自己13年的一些心得 xff0c 在上一篇日志中 xff0c 该总结的已经总结 xff0c 想了解更多的已经加我个人微信了 我在想 xff0c 大学其实很多
  • Ubuntu硬盘分区和分区文件类型及Linux分区基础知识

    Ubuntu硬盘分区的常用系统 xff0c 于是我学习研究了Ubuntu硬盘分区 xff0c 在这里对大家详细介绍下Ubuntu硬盘分区应用 xff0c 希望对大家有用Ubuntu硬盘分区包含了非常好的翻译和容易使用的架构 如果你准备在硬盘
  • 欢迎使用CSDN-markdown编辑器

    我和谁都不争 xff0c 和谁争 xff0c 我都不屑 xff1b 我爱大自然 xff0c 其次就是艺术 xff1b 我双手烤着生命之火取暖 xff0c 火萎了 xff0c 我也准备走了 本Markdown编辑器使用StackEdit修改而
  • 从高考到程序员--------你到底在追求着什么?------串烧似的文章

    随便写写 xff0c 万事开头难 xff0c 不知道应该怎么写出来 xff0c 因为只有自己经历的才能是最美好的回忆 xff0c 不知道这个编辑器写的效果如何 xff0c 凑合着看吧 xff0c 从高考到程序员征文看了几篇 xff0c 决定
  • AI以来----已不再是未来

    在过去的2016年 xff0c 可以说AI的核心发展一直围绕着开源和生态 国际巨头纷纷涉足深度学习平台 xff0c 让原本是高高在上的人工智能 xff0c 迅速落地细化到了行业的各个领域 随着AI技术正在为全球开发者所用 xff0c 极大的
  • 即兴嘻哈

    kao ha wowo 深夜不能寐 xff0c 那个翻来覆也不能把觉睡 一首即兴style说说ni为何半夜还不睡 xff0c 一线城市压力大来人总疲惫 xff0c 为了买房买车拼命都在向前奔 年轻人出来打拼为何这么累 xff0c 多少人为了
  • 裸辞3个月扛不住后,随便接了offer更惨!

    最近发现年底找工作的人不少 xff0c 部门里就2个hc xff0c 一周能收2000 43 简历 xff0c 这比例有点 过分 了 虽说大部分是年底先看看机会试试水 xff0c 准备年后冲击的 xff0c 但看简历里也有不少中间裸辞的 x
  • Docker常用命令-自用

    Docker常用命令 自用 1 镜像仓库 1 1 登陆 登出 登陆 默认Docker Hub docker login u span class token punctuation span username span class toke
  • 程序猿的浪漫之二进制表白篇

    那天情人节 xff0c 我给她发了一串数字 xff08 01001001 00100000 01101100 01101111 01110110 01100101 00100000 01111001 01101111 01110101 xf
  • Dockerfile使用教程

    第一 创建一个spring boot项目 第二 创建 xff1a Dockerfile文件 xff08 在项目根目录下 xff09 第三 复制粘贴 FROM java 8 设置基础镜像 FROM openjdk 8 jdk alpine 指
  • C++ 用socket封装成http

    HttpSocket h interface for the CHttpSocket class if defined AFX HTTPSOCKET H F49A8F82 A933 41A8 AF47 68FBCAC4ADA6 INCLUD
  • echarts更换主题

    前言 本篇文章基于上一篇文章 xff1a vue工程整合echarts xff0c 因此这里主要讲的是主题是如何配置的 xff0c 其他代码在这里不再赘述 官网中已经说明了echarts除了有默认的主题外 xff0c 并且内置了dark主题