Morris.js 선 그래프의 도트 점 색상 및 스타일을 변경하는 방법은 무엇입니까?

Question

나는 morris.js을 사용하여 선형 차트 그래프를 그리지 만 선 차트에서 점 색상 및 스타일 만 변경하는 방법을 알 수 없습니다. 점 스타일을 변경하는 방법을 아는 사람이 있습니까?

감사합니다.

Answer 1

pointFillColors 속성을 사용하십시오. 문서에서 :

pointFillColors 시리즈 포인트의 색상입니다. 기본값은 lineColors와 같은 값을 사용하여 다음

파란색 라인과 녹색 점으로 차트의 예는 다음과 같습니다

대신 "lineColors"시도 "색상"이 같은 의

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript" src="raphael-min.js"></script> 
<script type="text/javascript" src="morris.min.js"></script> 
<script type="text/javascript"> 
function drawChart() { 
    Morris.Line({ 
     element: 'chart', 
     data: [ 
      {y: '2012', a: 100}, 
      {y: '2011', a: 75}, 
      {y: '2010', a: 50}, 
      {y: '2009', a: 75}, 
      {y: '2008', a: 50}, 
      {y: '2007', a: 75}, 
      {y: '2006', a: 100} 
     ], 
     xkey: 'y', 
     ykeys: ['a'], 
     labels: ['Test series'], 
     lineColors: ['#0b62a4'], 
     pointFillColors: ['#00ff00'] 
    }); 
} 

window.onload = drawChart; 
</script> 
<div id="chart" style="width: 400px; height: 250px;"></div> 

Answer 2

:

function drawChart() { 
Morris.Line({ 
    element: 'chart', 
    data: [ 
     {y: '2012', a: 100}, 
     {y: '2011', a: 75}, 
     {y: '2010', a: 50}, 
     {y: '2009', a: 75}, 
     {y: '2008', a: 50}, 
     {y: '2007', a: 75}, 
     {y: '2006', a: 100} 
    ], 
    colors: ['#0b62a4','#D58665','#37619d','#fefefe','#A87D8E','#2D619C','#2D9C2F'] 
}); 

}

모든 행에 대해 하나 개의 색상이 있어야합니다.