canvasjs차트 색상과 유동적인 데이터 표현방법

canvasjs차트 색상과 유동적인 데이터 표현방법 채택완료

1. 색상이 너무 칙칙한데 항목별 색상을 주는방법이 있나요?

- color rgb(숫자~숫자~) 이런형태로 제공되는부분을 본거같은데

표현방법( 색상표없이 어떻게 ) 하는지요.

$dataPoints = array(
array("y" => 40, "label" => '월' ),
array("y" => 12, "label" => '화' ),
array("y" => 11, "label" => '수' ),
array("y" => 4, "label" => '목'),
array("y" => 120, "label" => '금' ),
array("y" => 76, "label" => '토' ),
array("y" => 61, "label" => '일' )

);

위 형태로 샘플이 되있는데, 데이터가 갯수가 정해져있는게 아니고

유동적으로 표현해야합니다.

예를들자면 게시물의 갯수라든지.. 위 형태를 loop 로 돌려야하는건지요?

3. 상용으로 사용해도 무방한지요?

Copy

<?

$dataPoints = array(
array("y" => 40, "label" => '월' ),
 array("y" => 12, "label" => '화' ),
 array("y" => 11, "label" => '수' ),
 array("y" => 4, "label" => '목'),
 array("y" => 120, "label" => '금' ),
 array("y" => 76, "label" => '토' ),
 array("y" => 61, "label" => '일' )

);
?>

<script>
window.onload = function() {
 
var chart = new CanvasJS.Chart("chartContainer", {
 animationEnabled: true,
 theme: "light2",
 title:{
  text: "제목"
 },
 axisY: {
  title: ""
 },
 data: [{
  type: "column",
  yValueFormatString: "#,##0.## 건",
  dataPoints: <?php echo json_encode($dataPoints, JSON_NUMERIC_CHECK); ?>
 }]
});
chart.render();
 


 
var chart2 = new CanvasJS.Chart("chartContainer2", {
 animationEnabled: true,
 theme: "light2",
 title:{
  text: "제목"
 },
 axisY: {
  title: ""
 },
 data: [{
  type: "pie", //pie
  yValueFormatString: "#,##0.## 건",
  dataPoints: <?php echo json_encode($dataPoints, JSON_NUMERIC_CHECK); ?>
 }]
});
chart2.render();
 
}
</script>

<div id="chartContainer" style="height: 370px; width: 600px;"></div>
<div id="chartContainer2" style="height: 370px; width: 600px;"></div>

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>

3717287807_1614331949.0321.png

canvasjs차트 색상과 유동적인 데이터 표현방법 채택완료

공유하기