我需要更改 Y 轴标签在 Y 轴上的位置,当前的六个位置选项无法满足我的场景,我也尝试使用 d3 进行自定义,但仍然没有成功。
我创建了一个plnkr http://plnkr.co/edit/WzXVForyGJP01WJlAXj5?p=preview演示,并在中提交问题github https://github.com/c3js/c3/issues/2104.
var chart = c3.generate({
data: {
columns: [
['data', 30, 200, 100, 400, 150, 250]
]
},
axis: {
y: {
label: {
text: 'Y Axis Label',
position: 'outer-top'
}
}
}
});
有人知道该怎么做吗?
首先十分感谢。
与你所说的不同,你可以用D3定制它。只需选择标签(按类别)并设置transform
:
d3.select(".c3-axis-y-label").attr("transform", "translate(25,30)")
这是演示:
// Code goes here
(function() {
var chart = c3.generate({
padding: {
top: 10
},
data: {
columns: [
['data', 30, 200, 100, 400, 150, 250]
]
},
axis: {
y: {
label: {
text: 'Y Axis Label',
position: 'outer-top'
}
}
}
});
d3.select(".c3-axis-y-label").attr("transform", "translate(25,30)")
})();
<head>
<link rel="stylesheet" href="https://unpkg.com/[email protected] /cdn-cgi/l/email-protection/c3.css">
<link rel="stylesheet" href="style.css">
<script src="https://unpkg.com/[email protected] /cdn-cgi/l/email-protection/d3.js"></script>
<script src="https://unpkg.com/[email protected] /cdn-cgi/l/email-protection/c3.js"></script>
</head>
<body>
<div id="chart"></div>
<script src="script.js"></script>
</body>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)