html-echarts的图例的图形的颜色怎么改变
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html-echarts的图例的图形的颜色怎么改变相关的知识，希望对你有一定的参考价值。
参考技术A <!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="echarts-all.js"></script>
<style>
.aaa
width: 500px;
height: 500px;
</style>
</head>
<body>
<div class="aaa" id="annular"></div>
<script>
var aaa = echarts.init(document.getElementById('annular'));
option =
title:
x: 'center',
text: 'ECharts例子个数统计'
,
tooltip:
trigger: 'item'
,
legend:
//selectedMode: false,
x:'right',
y:70,
align:'right',
itemWidth:16,
itemGap:20,
orient:'vertical',
data:[name:'消',textStyle:color:'#C1232B',
name:'现',textStyle:color:'#B5C334',
name:'教',textStyle:color:'#FCCE10'
],
selected:
'消':true,
'现':true,
'教':true
,
color:['#C1232B','#B5C334','#FCCE10'],
toolbox:
show: true,
feature:
dataView: show: true, readOnly: false,
restore: show: true,
saveAsImage: show: true
,
calculable: true,
grid:
borderWidth: 0,
y: 80,
y2: 60
,
xAxis: [
type: 'category',
show: false,
data: ['消', '现', '教']
],
yAxis: [
type: 'value',
show: false
],
series: [
name: 'ECharts例子个数统计',
type: 'bar',
itemStyle:
normal:
color: function(params)
// build a color map as your need.
var colorList = [
'#C1232B','#B5C334','#FCCE10','#E87C25','#27727B',
'#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD',
'#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'
];
return colorList[params.dataIndex]
,
label:
show: true,
position: 'top',
formatter: 'b\nc'
,
data: [12,21,10],
markPoint:
tooltip:
trigger: 'item',
backgroundColor: 'rgba(0,0,0,0)'
,
data: [
xAxis:0, y: 350, name:'Line', symbolSize:20, symbol:'none',
xAxis:1, y: 350, name:'Bar', symbolSize:20,symbol:'none',
xAxis:2, y: 350, name:'Scatter', symbolSize:20,symbol:'none'
]
]
;
aaa.setOption(option);
</script>
</body>
</html>本回答被提问者采纳
使用相同的标签和颜色为不同的图形手动斜体和着色图例
【中文标题】使用相同的标签和颜色为不同的图形手动斜体和着色图例【英文标题】：Italicize and color legend manually for different graphs using same labels and colors 【发布时间】：2019-08-10 15:24:49 【问题描述】：我正在尝试创建多个共享相同图例的图表。
我找到了许多组合多个图表的方法，似乎ggarrange 能够为所有应该是唯一的东西创建一个共享图例。
但是我在绘图时遇到了一些问题，因为一些图表没有相同的门（定义图例颜色）存在，但我希望它们在所有图表中都是相同的颜色，所以组合图例将有正确的颜色。
对于一个图表，我会手动为标签分配颜色，如下所示
labs<-c("Arthropoda"="#FF66CC"
,"Cercozoa"="#FF6000")
并添加scale_fill_manual(values=labs) 进行绘图，这似乎有效
然后我对其进行了修改，因此我可以将其中的一部分用斜体显示。
labsPhylum <-c('expression(paste(italic("Arthropoda")))'="#CC0000"
,'expression(paste(italic("Cercozoa")))'= "#FF6000"
,'expression (paste("unknown", ~italic("Eukaryota")))'= "#990000")`
但是，当我使用 ggplot 和 scale_color_manual() 使用我认为应该斜体和彩色的 labsPhylum 创建一个绘图时，我绘制了一个带有此警告的空图，所以这里有一些我不理解的重要内容。
ggplot(data=sigtab_dil, aes(x=Species, y=log2FoldChange, color=Phylum))+
geom_point(size=2) +
scale_color_manual(values=labsPhylum)
Warning message:
Removed 9 rows containing missing values (geom_point).
有人可以帮我弄清楚我哪里出错了吗？ 谢谢
【问题讨论】：
【参考方案1】：回答了我自己的问题
我意识到我必须为中断、标签和值创建单独的向量，而不是组合它们。
总之
colsPhylum <-c("Arthropoda"="#CC0000"
,"Cercozoa"= "#FF6000"
,"Chlorophyta"= "#CC9900"
labsPhylum <-c(expression(paste(italic("Arthropoda")))
,expression(paste(italic("Cercozoa")))
,expression(paste(italic("Chlorophyta ")))
breaksPhylum <-c("Arthropoda", "Cercozoa","Chlorophyta", "Choanozoa"
,"Ciliophora"
,"Cryptista"
【讨论】：
以上是关于html-echarts的图例的图形的颜色怎么改变的主要内容，如果未能解决你的问题，请参考以下文章