2017-12-13 2 views
2

더미 테이블을 만들었고 p/l 열을 'line'유형으로 플롯하려고합니다. 여기 내 코드는 지금까지의 :ChartJS에 꺾은 선형 차트를 플로팅하는 방법은 무엇입니까?

var niftyProfit = []; 
var niftyProfitChartData = []; 
var sum = 0; 
data.forEach(function(obj) { 
    niftyProfit.push(obj.profit); 
}); 
for (var i in niftyProfit) { 
    sum = sum + niftyProfit[i]; 
    niftyProfitChartData.push(sum); 
} 

obj.profit는 P/L 열 데이터이지만, 라인 차트에서. 나는 예를 들어 루프를 위해했던 값을 채우고 싶다. profit = [4,2,-3,-5]을 고려하면 차트에 채울 마지막 배열은 [4,6,3,-2]이됩니다. 나는 이것을 어떻게 얻을 수 있을까? 여기에 바이올린이 있습니다 : http://jsfiddle.net/zkrh7/141/

+0

왜 피들에 코드를 사용하지 않을 때 'angularjs'라는 태그를 붙였습니까? –

답변

2

다음 변경 사항으로 jsfiddle을 업데이트했으며 작동합니다.

스크립트

var data = [{"profit": 345}, {"profit":-4}, {"profit":58}, {"profit": -30}]; 
//or you can use 
var data = [{"profit": 4}, {"profit":2}, {"profit":-3}, {"profit": -5}]; 

populateChartData(data); 

에서 그리고 당신은뿐만 아니라 볼 수있는 외부 자원으로 차트 라이브러리를 추가했다. 그런 다음

이 또한 내가

<canvas id="niftyTrackerChart" width="800" height="400"></canvas> 

업데이트 JSFiddle 링크 http://jsfiddle.net/muasif80/zkrh7/156/

이 링크 How to uses numbers array for line chart?

에서보세요 html로에 캔버스를 추가 한 경우에만 경우이 말하는 숫자를 사용하면 x 축에 대해서도 레이블 배열을 정의해야합니다.

+0

저는 캔버스를 실제로 추가했습니다. 줄을 그릴 수는 있지만 문제는 단 하나의 줄을 표시하고 배열의 첫 번째 두 요소 만 가져 오는 것입니다. (niftyProfitChartData)에있는 실제 루프 배열은 (28) [345, 340.55, 398.85, 408.3, 317.75, 245.05, 497.8, 427.95000000000005, 337.1, 638.5, 573.65, 417.09999999999997, 626.4499999999999, 592.4, 558.5, 734.7, 718.6500000000001, 703.0000000000001, 994.7500000000001, 926.7000000000002, 1053.0000000000002, 971.6500000000002, 926.8000000000002, 1099.7500000000002, 1224.8500000000001, 1325.45, 1486.3, 1661.05] –

+0

자, 살펴 보겠습니다. – muasif80

+1

이제 답변을 업데이트했습니다. 내가 추가 한 문서 링크를 살펴보십시오. 점 (x, y) 배열 대신 숫자 배열을 사용하는 경우 레이블 배열을 정의해야합니다. 레이블 배열을 추가 한 후에 업데이트 된 JsFiddle이 실제로 모든 포인트를 그립니다. – muasif80

관련 문제