2016-05-18 34 views
16

Tôi đang sử dụng biểu đồ.js để tạo biểu đồ thanh và dường như không thể thay đổi màu nhãn hoặc màu huyền thoại. Tôi đã tìm ra cách thay đổi màu sắc đánh dấu, nhưng tôi không chắc chắn nơi đặt 'scaleFontColor', nếu đó thực sự là những gì tôi cần phải sử dụng.Màu nhãn Chart.js

Đây là liên kết đến nội dung hiện tại. http://imgur.com/nxaH1mk

Và đây là mã của tôi:

var ctx = document.getElementById("myChart"); 
var myChart = new Chart(ctx, { 
    scaleFontColor: "white", 
    type: "bar", 
    data: { 
     labels: <?php echo json_encode($timeSlice); ?>, 
     datasets: [{ 
      label: "A Label", 
      backgroundColor: "rgba(159,170,174,0.8)", 
      borderWidth: 1, 
      hoverBackgroundColor: "rgba(232,105,90,0.8)", 
      hoverBorderColor: "orange", 
      scaleStepWidth: 1, 
      data: <?php echo json_encode($myCount); ?> 
     }] 
    }, 
    options: { 
     legend: { 
      fontColor: "white" 
     }, 
     scales: { 
      yAxes: [{ 
       ticks: { 
        fontColor: "white", 
        stepSize: 1, 
        beginAtZero: true 
       } 
      }] 
     } 
    } 
}); 

Bất kỳ trợ giúp sẽ được đánh giá rất nhiều.

+0

https://stackoverflow.com/a/48580585/7186739 – Super

Trả lời

38

Guh tôi đã giải quyết nó, xin lỗi về câu hỏi. Nhưng tôi đoán tôi sẽ để lại một câu trả lời trong trường hợp bất cứ ai khác chạy vào vấn đề của tôi.

var ctx = document.getElementById("myChart"); 
var myChart = new Chart(ctx, { 
    type: "bar", 
    data: { 
     labels: <?php echo json_encode($timeSlice); ?>, 
     datasets: [{ 
      label: "My Label", 
      backgroundColor: "rgba(159,170,174,0.8)", 
      borderWidth: 1, 
      hoverBackgroundColor: "rgba(232,105,90,0.8)", 
      hoverBorderColor: "orange", 
      scaleStepWidth: 1, 
      data: <?php echo json_encode($myCount); ?> 
     }] 
    }, 
    options: { 
     legend: { 
      labels: { 
       fontColor: "white", 
       fontSize: 18 
      } 
     }, 
     scales: { 
      yAxes: [{ 
       ticks: { 
        fontColor: "white", 
        fontSize: 18, 
        stepSize: 1, 
        beginAtZero: true 
       } 
      }], 
      xAxes: [{ 
       ticks: { 
        fontColor: "white", 
        fontSize: 14, 
        stepSize: 1, 
        beginAtZero: true 
       } 
      }] 
     } 
    } 
}); 
+0

Cảm ơn! Giúp tôi rất nhiều – molbal

+0

Đã giúp tôi. Cảm ơn! –

+0

Cảm ơn bạn, họ thực sự cần cải thiện tài liệu của họ .. – phil

Các vấn đề liên quan