问题
When I am using sub chart, one problem I am facing with user experience is both Main chart and Sub chart are of same importance, I mean same color, etc Instead what I expect is the sub chart should be less transparent or should be provided an option to set back ground color for sub chart. Is it possible? I don't see any option to set back ground color for the sub chart on documentation page. Any guidance please ...
回答1:
You'd need to style it manually. I don't see that C3 uses any particular selector to distinguish the subchart from the main chart, so you might have to use n-th child to do it. Something like in the example code below.
var chart = c3.generate({
data: {
columns: [
['sample', 30, 200, 100, 400, 150, 250]
]
},
subchart: {
show: true
}
});
d3.selectAll("svg > g:nth-child(3)").insert("rect", ":first-child").attr("width", "100%").attr("height", "100%").attr("fill", "yellow");
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<div id='chart' />
来源:https://stackoverflow.com/questions/30500272/need-to-set-back-ground-color-for-c3-sub-chart-or-make-it-less-transparent-than