javascript - 更改绘图背景颜色
问题描述
寻找有关如何将情节图的背景颜色更改为透明的建议?
我查看了文档,但找不到任何参考。
pie_chart = {
'data': [{
'labels': ['V0', 'V1', 'V2', 'V3', 'V4', 'V5', 'V6', 'V7', 'V8', 'V9'],
'values': [55, 22, 31, 32, 33, 45, 44, 42, 12, 67],
'type': 'pie',
'sort': false,
}],
'layout': {
backgroundColor: "rgba(255,255,255,0.5)",
width: 320,
}
}
Plotly.newPlot('plot', pie_chart.data, pie_chart.layout);
#plot {
background-color: lightblue;
}
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id="plot"> </div>
解决方案
请使用paper_bgcolor
的属性layout
来制作它transparent
。
paper_bgcolor (color):
default: "#fff"
设置绘制图形的纸张颜色。
来自官方文档,可在此处获得
pie_chart = {
'data': [{
'labels': ['V0', 'V1', 'V2', 'V3', 'V4', 'V5', 'V6', 'V7', 'V8', 'V9'],
'values': [55, 22, 31, 32, 33, 45, 44, 42, 12, 67],
'type': 'pie',
'sort': false,
}],
'layout': {
paper_bgcolor: "rgba(0,0,0,0)",
width: 320,
}
}
Plotly.newPlot('plot', pie_chart.data, pie_chart.layout);
#plot {
background-color: lightblue;
}
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id="plot"> </div>
推荐阅读
- node.js - MongoDB $pull 查询无法正常工作
- c# - 如何在不从外部更改实体的情况下对实体执行数学运算?
- sql-server - 为什么在引发除以零异常后执行插入语句
- ruby-on-rails - 使用 rails 6 active storage 不显示 PDF
- apollo-server - 是否可以为 Apollo Server 附带的 GraphQL Playground 定义 HTTP 标头?
- angular - 在编辑模式下打开表单时,Angular Reactive Form 发生变化
- python - 我需要使用 python 有效地分批将数据从 csv 文件导入到 postgresql 表中
- ksqldb - Windows下如何安装mongoDb连接器?
- python - 如何 conda 打包基础环境
- c++11 - 我有一组用户定义的数据类型,并在结构中使用该组变量。我想比较 set 的值。我将如何做到这一点