Tôi đang sử dụng thư viện c3js mới. Có cách nào để thay đổi nhãn cho một phần dữ liệu trong biểu đồ không? Tôi có một biểu đồ thanh nơi mỗi thanh là một giá trị đồng đô la. Tôi muốn các nhãn cho mỗi thanh là 100 đô la thay vì 100. Nếu tôi đặt giá trị thành 100 đô la thì thư viện không thể tạo biểu đồ. Có cách nào để thay đổi nhãn - nếu không phải là giá trị cơ bản?Có cách nào để thay đổi nhãn bằng c3j không?
Bạn có thể chỉ định định dạng cho cả Nhãn dữ liệu và Thủ thuật trục. Hãy xem ví dụ dưới đây.
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="./css/c3.css">
<script src="./js/d3.min.js"></script>
<script src="./js/c3.min.js"></script>
</head>
<body>
<div class='chart'>
<div id='chart'></div>
</div>
<script>
var chart = c3.generate({
data: {
columns: [
['data1', 30, 200, 100, 400, 150, 250],
['data2', 130, 100, 140, 200, 150, 50]
],
type: 'bar',
labels: {
format: {
y: d3.format("$,")
//y: function (v, id) { return "Custom Format: " + id; }
}
}
},
axis : {
y : {
tick: {
format: d3.format("$,")
//format: function (d) { return "Custom Format: " + d; }
}
}
}
});
</script>
</body>
</html>
The resulting graph looks like this.
Check-out hoặc bạn có thể viết hàm formatting options in d3.js của riêng bạn (xem chú thích mã trên).
Bạn cũng có thể hiển thị giá trị như chuỗi: http://c3js.org/samples/data_stringx.html
var chart = c3.generate({
data: {
x : 'x',
columns: [
['x', '$100', '$200', '$300', '$400'],
['download', 30, 200, 100, 400],
['loading', 90, 100, 140, 200],
],
groups: [
['download', 'loading']
],
type: 'bar'
},
axis: {
x: {
type: 'categorized' // this is needed to load string x value
}
}
});
nếu tôi bao gồm 'x:' x'' bên trong dữ liệu, tôi sẽ nhận được lỗi d3.v3.min.js: 1 Lỗi: giá trị không hợp lệ cho thuộc tính x = "NaN" a @ d3.v3.min.js: 1 (chức năng ẩn danh) @ d3.v3.min.js: 3Y @ d3.v3.min.js: 1Aa.each @ d3.v3.min .js: 3Aa.attr @ d3.v3.min.js: 3redraw @ c3.js: 1417init @ c3.js: 1289c3.generate @ c3.js: 1972 (chức năng ẩn danh) @ c3-chart.init.js: 135c @ jquery.js: 4p.fireWith @ jquery.js: 4x.extend.ready @ jquery.js: 4q @ jquery.js: 4 14d3.v3.min.js: 1 Lỗi: Giá trị không hợp lệ cho thuộc tính width = " NaN "u @ d3.v3.min.js: 1 (chức năng ẩn danh). bạn có thể cho tôi biết lý do tại sao –
codelearner
@codelearner, một điều có thể là lý do là phần '' trục'' nằm bên trong '' dữ liệu'', nhưng không nên ở đó. Kiểm tra cẩn thận để lồng đúng cách. Ví dụ này hoạt động. –