2013-05-02 2 views
0

4 개의 시리즈로 구성된 차트가 있습니다. 4 개 중 3 개는 누적 막 대형 차트이고 4 개는 선입니다. 왜 그래프는 이런 식으로 행동합니까? 나는 그 시리즈에서 어떤 순서로 $.jqPlot 함수로 전달되었는지는 중요하지 않다고 생각했다. series 속성을 사용하고 조정하지 않으려는 항목에 빈 개체를 사용하여 시리즈를 조정할 수 있다고 생각했습니다.jqplot이 이런 식으로 작동하는 이유는 무엇입니까?

scoreArray는 내가 선 위에 겹치기를 원하는 선 차트가되고 싶습니다. 내 첫 번째 시도는이 코드를했다 :

$.jqplot("HistoryChart", 
    [scoreArray, AvailableArray, UnavailableArray, UnknownArray], { 
     stackSeries: true, 
     seriesDefaults : { 
      renderer: $.jqplot.BarRenderer, 
      rendererOptions : { 
       barWidth: 40 
      } 
     }, 
     series : [{ 
      disableStack : true, 
      renderer: $.jqplot.LineRenderer 
     }, {}, {}, {}], 
     axesDefaults : { 
      tickRenderer: $.jqplot.CanvasAxisTickRenderer, 
      tickOptions: { 
       angle: -45 
      } 
     }, 
     axes: { 
      xaxis : { 
       renderer: $.jqplot.CategoryAxisRenderer, 
       ticks: dateArray 
      } 
     } 
    } 
); 

이 생성 된 그래프 : 내가 마지막 시리즈 scoreArray을 만들어 그에 따라 일련의 속성을 조정하면 이제

enter image description here

, 그것은 올바른 보인다.

$.jqplot("HistoryChart", 
    [AvailableArray, UnavailableArray, UnknownArray, scoreArray], { 
     stackSeries: true, 
     seriesDefaults : { 
      renderer: $.jqplot.BarRenderer, 
      rendererOptions : { 
       barWidth: 40 
      } 
     }, 
     series : [{}, {}, {}, { 
      disableStack : true, 
      renderer: $.jqplot.LineRenderer 
     }], 
     axesDefaults : { 
      tickRenderer: $.jqplot.CanvasAxisTickRenderer, 
      tickOptions: { 
       angle: -45 
      } 
     }, 
     axes: { 
      xaxis : { 
       renderer: $.jqplot.CategoryAxisRenderer, 
       ticks: dateArray 
      } 
     } 
    } 
); 

enter image description here

답변

0

더 나에게 버그 것 같다 다음은 코드와 그래프이다. Y 축 최소 - 최대 값을 설정하지 않았습니다.이 값은 축의 초기 설정을 비뚤어지게합니다. 분을 설정해보십시오. 작동 할 수 있습니다.

0

옵션 disableStack: true은 해당 시리즈에서 새 스택 그림을 시작해야합니다. 첫 번째 예제의 첫 번째 막대 그림에 배치하면 동일한 그래프가 나타납니다. 수정 된 코드를 참조하십시오 :

.jqplot("HistoryChart", 
[scoreArray, AvailableArray, UnavailableArray, UnknownArray], { 
    stackSeries: true, 
    seriesDefaults : { 
     renderer: $.jqplot.BarRenderer, 
     rendererOptions : { 
      barWidth: 40 
     } 
    }, 
    series : [{ 
     renderer: $.jqplot.LineRenderer 
    }, 
    { 
     disableStack : true 
    }, {}, {}], 
    axesDefaults : { 
     tickRenderer: $.jqplot.CanvasAxisTickRenderer, 
     tickOptions: { 
      angle: -45 
     } 
    }, 
    axes: { 
     xaxis : { 
      renderer: $.jqplot.CategoryAxisRenderer, 
      ticks: dateArray 
     } 
    } 
} 
); 

을하지만 그것은 작동하지 않습니다 : 막대 차트에 전화를 지원되지 않는 것으로 보인다 Messed up graph

. =

마지막으로 시리즈를 추가하고이 시리즈에 disableStack : true을 추가하는 것이 유일한 방법입니다.

+0

배열 배열은 disableArray를 AvailableArray 배열로 설정 한 것처럼 보입니다. 그게 니가 원하는거야? 첫 번째 배열 인덱스에 있다고 생각했습니다. – Justin

+0

내가 본 예제에 따르면 첫 번째 막대 그림에서이 방법으로 작동 할 것이라고 생각했지만,이 코드를 사용하여 흥미로운 결과를 얻을 수 있습니다. http://i.imgur.com/dV3IrtH.png – Pesikar

관련 문제