html浅色背景,深色背景和浅色标签

深色背景和浅色标签

.bt{

width: 990px;

height: 600px;

}

var myChart=echarts.init(document.getElementById("main"));

//指定图表的配置和数据

var option={

backgroundColor: '#2c343c',

textStyle: {

color: 'rgba(255, 255, 255, 0.3)'

title:{

text:'某站点用户访问来源',

subtext:"阿里波特的魔法",

color: '#fff',

x:'center'

tooltip:{

trigger:"item",

formatter:"{a}

{b}:{c}({d}%)"

legend:{

orient:'vertical',

left:"left",

// color:"white",

// color: 'rgba(255, 255, 255, 0.3)',

data:["直接访问","邮件营销","联盟广告","视频广告","搜索引擎"]

series:[

{

name:"访问来源",

// roseType: 'angle',

type:"pie",

radius:"55%",

center:["50%","60%"],

//更改阴影，透明度，颜色，边框颜色，边框宽度

itemStyle: {

//normal选项是正常展示下的样式

// normal: {

// // 阴影的大小

// shadowBlur: 200,

// // 阴影水平方向上的偏移

// shadowOffsetX: 0,

// // 阴影垂直方向上的偏移

// shadowOffsetY: 0,

// // 阴影颜色

// shadowColor: 'rgba(0, 0, 0, 0.5)'

// }

//鼠标hover的时候的高亮样式

emphasis:{

shadowBlur:200,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

label: {

normal: {

textStyle: {

color: 'rgba(255, 255, 255, 0.3)'

}

labelLine: {

normal: {

lineStyle: {

color: 'rgba(255, 255, 255, 0.3)'

}

itemStyle: {

normal: {

shadowBlur: 200,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

data:[

{value:"335",name:"直接访问"},

{value:310, name:'邮件营销'},

{value:234, name:'联盟广告'},

{value:135, name:'视频广告'},

{value:1548, name:'搜索引擎'}

]

}

]

//绑定图表

}

myChart.setOption(option);

效果图

image.png

html浅色背景,深色背景和浅色标签相关推荐

ECharts官方教程(四)【个性化图表的样式】
ECharts 提供了丰富的自定义配置选项,并且能够从全局.系列.数据三个层级去设置数据图形的样式.下面我们来看如何使用 ECharts 实现下面这个南丁格尔图: <iframe src=&qu ...
编程基础---echarts学习
官网 1.5 分钟上手 ECharts 获取 ECharts 你可以通过以下几种方式获取 ECharts. 从官网下载界面选择你需要的版本下载,根据开发者功能和体积上的需求,我们提供了不同打包的下载, ...
ECharts教程（未完）
ECharts 特性兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等) 底层依赖轻量级的矢量图形库 ZRender 丰富的可视化类型常规的折线图.柱状图 ...
最好用的图表工具 -- ECharts
首先比较下目前比较流行的几款图表库: highcharts文档详细易懂,上手快捷,但highcharts依赖于jQuery库,而且Highcharts对个人免费但对企业收费 d3.js更自由些,更容易 ...
如何将Windows图片查看器的背景颜色改成浅色？
现在大家基本都在使用Win10系统,我们在双击查看图片时,系统默认使用系统自带的图片(照片)查看器去打开图片.图片查看器的背景色默认是黑色的,如下所示:(因为大家可能会遇到同样的问题,所以在此记录并分 ...
Material Design Lite，简洁惊艳的前端工具箱。
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonnode/ .网站上有对应每一 ...
条形码的正确使用方法和技巧
扫码枪的条形码软件在识别条形码并快速准确地捕获其数据方面做得非常出色,但该过程并非完全不受错误的影响.但是,通过对基本最佳实践的一些了解,您可以避免会减慢流程速度(并降低生产率)的常见错误. 有几个因 ...
透明色的rgb值是多少_一文掌握PPT主题色原理及使用技巧
做PPT颜色该如何搭配?毋庸置疑,这是PPT设计中的难点问题!对色彩的使用的确让很多人头疼和纠结,但难的事情找到了规律也就不怕了. 5 如何设置元素的色彩? 我们如何在PPT中设置元素的色彩呢?概况起 ...
bootstrap4笔记
布局 Container 容器 Container容器是窗口布局的最基本元素,推荐所有样式都定义在.container或.container-fluid容器中.这是启动整个栅格系统必不可少的前置条件. ...

html浅色背景,深色背景和浅色标签

html浅色背景,深色背景和浅色标签相关推荐

最新文章

热门文章