2016-10-05 2 views
1

jqplot을 사용하여 막대 차트 용 코드를 작성했습니다. 내가 아래의 함수를 실행할 때 :막 대형 차트 기둥에 다른 색을 표시하지 않습니다.

문제 : 세 가지 데이터 (첫 번째 색) 모두에 하나의 색만 표시됩니다. 틱에 대해 다른 색을 어떻게 표시합니까?

$(document).ready(function(){ 
$.jqplot.config.enablePlugins = true; 


var d1=${likes[0]}; 
var d2=${comonelikes[0]}; 
var d3=${comtwolikes[0]}; 

var a=[d1,d2,d3]; 

var ticks = [${myorg},${compOne},${compTwo}]; 

plot1 = $.jqplot('chart1',[a], { 
    // Only animate if we're not using excanvas (not in IE 7 or IE 8).. 

    animate: !$.jqplot.use_excanvas, 

    seriesDefaults:{ 
     renderer:$.jqplot.BarRenderer, 
     pointLabels: { show: true }, 

    }, 
    seriesColors :[ 
        '#57c1b4','#bd66a9', 
        '#abb3b6' 
        ], 
    axes: { 
     xaxis: { 
      renderer: $.jqplot.CategoryAxisRenderer, 
      ticks:ticks, 

       tickOptions: { mark: null, 
           fontSize: 0 
          } 
     }, 
      yaxis: { 
                          min:0, 
                          max:3000000, 
      tickOptions: {formatString: '%d'}, 
      numberticks:6 
                      } 
    }, 

    highlighter: { show: true } 
}); 

$('#chart1').bind('jqplotDataClick', 
    function (ev, seriesIndex, pointIndex, data) { 
     $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data); 
    } 
); 
}); 

어떤 해결책이 있습니까?

답변

1

varyBarColor 렌더러 옵션을 사용하여 색상으로 막대를 그리도록 지시해야합니다.

seriesDefaults에 추가

여기
seriesDefaults:{ 
    renderer:$.jqplot.BarRenderer, 
    pointLabels: { show: true }, 
    rendererOptions: { 
     // Set varyBarColor to true to use the custom colors on the bars. 
     varyBarColor: true 
    } 
}, 

이 당신의 코드와 추가 바 색상으로 working jsfiddle example입니다.

+0

감사합니다. –