2011-04-29 1 views
2

저는 JavaScript 및 Dojo를 처음 사용하므로 저와 함께하시기 바랍니다. 나는 다음과 같이 사용 DataSeries 객체 파이 차트를 만들려고 해요 : 그것은 잘 작동DojoToolkit : dojox.charting.DataSeries, 데이터 새로 고침 이벤트에 연결하는 방법?

var skillStore = new dojo.data.ItemFileReadStore({ 
    url: "/data/skillhead.json" 
}); 

function formatPieChartData(store, item) { 
    var tooltips = { 
    AVAILABLE: "Available agents", 
    ONACD: "Agents on ACD calls", 
    INACW: "Agents in ACW", 
    INAUX: "Agents in AUX", 
    AGINRING: "Agents with ringing phones", 
    OTHER: "Agents otherwise occupied", 
    }; 

    var ivalue = store.getValue(item, "value"); 
    var legend = store.getValue(item, "legend"); 
    var tooltip = tooltips[store.getValue(item, "field")]; 

    var o = { y: ivalue, legend: legend, tooltip: tooltip } 
    return o; 
} 

/* This is how the data looks like after massaging 
var chartData = [ 
    { y: 10, legend: "AVAIL", tooltip: "Available agents" }, 
    { y: 20, legend: "ONACD", tooltip: "Agents on ACD calls" }, 
    { y: 30, legend: "INACW", tooltip: "Agents in ACW" }, 
    { y: 40, legend: "INAUX", tooltip: "Agents in AUX" }, 
    { y: 50, legend: "INRING", tooltip: "Agents with ringing phones" }, 
    { y: 60, legend: "OTHER", tooltip: "Agents otherwise occupied" } 
]; 
*/ 

var series = new dojox.charting.DataSeries(skillStore, 
    { query: { 
     field: new RegExp("INACW|INAUX|AGINRING|OTHER|" + 
        "AVAILABLE|ONACD") 
    } }, 
    formatPieChartData); 

dojo.addOnLoad(function() { 

chart = new dojox.charting.Chart("chartNode"); 
chart.setTheme(dojox.charting.themes.PrimaryColors); 

chart.addPlot("default", { 
    type: "Pie", 
    radius: 85, 
    labels: false, 
    ticks: false, 
    markers: false 
}); 
chart.addSeries("default", series); 

var highlight = new dojox.charting.action2d.Highlight(chart, "default"); 
var tip = new dojox.charting.action2d.Tooltip(chart, "default"); 

grid.startup(); 
chart.render(); 

legend = new dojox.charting.widget.Legend({ 
     chart: chart, 
     horizontal: false, 
     style: "font-size: 11px;", 
     }, 
     "chartLegend"); 
legend.startup(); 

setTimeout(function(){ legend.refresh() }, 1000); 
}); 

, 한 가지를 제외하고 : 나는 고정 타임 아웃을 좋아하지 않는다. 데이터가로드 된 후 범례를 새로 고쳐야합니다. 그렇지 않으면 표시되지 않습니다. 그러나 데이터를 가져온 직후 범례를 새로 고치기 위해 연결할 이벤트를 알지 못합니다. DataSeries 클래스에는 onFetchError 이벤트가 있지만 onFetchSuccess 이벤트는 없습니다. 데이터가 성공적으로로드되었는지 어떻게 알 수 있습니까?

답변

1

나는 이것이 늦다는 것을 알고 있지만, 누군가에게 같은 문제가있는 경우를 대비하여 어쨌든 게시하고 있습니다. DataSeries.js를 통해 살펴 보았고 사용중인 문서화되지 않은 훅이 있습니다.

dojo.connect(dataSeries, "_onFetchComplete", myObj, "myFunction"); 

+0

http://dojotoolkit.org/reference-guide/dojo/connect.html 감사합니다 참조 : 내가 API 업데이트에 걸쳐 동일하게 유지 당신이 약속 할 수 있습니다, 그것은 같이 보입니다. 네가 옳은지, 틀린 지 나는 확인할 수 없다. 나는 프로젝트에서 Dojo를 사용하지 않기로 결정했다. –

+0

걱정할 필요가 없습니다. 대신 당신이 무엇을 사용하고 있는지 물어볼 수 있습니까? Dojo에는 큰 데이터 세트를 그래프로 작성할 때 몇 가지 제한 사항이 있습니다. – WhatAWorld

+1

대신 ExtJS를 사용했습니다. 그것에 대한 나의 인상은 지금까지 아주 좋다. 그것은 사마귀와 많은 버그를 가지고 있지만 나에게는 Dojo에 비해 3 가지 주요 이점이 있습니다. a) 문서 세트는 불완전하지만 Dojo의 거의 존재하지 않는 문서보다 뛰어납니다. b) ExtJS 개발자는 라이브러리의 * 실제 * 디버깅 버전을 제공하기 위해 노력했으며 사용할 수 있습니다. 코어가 스파게티 한 그릇 인 Dojo와는 완전히 다릅니다. 코어 라이브러리 내부를 밟아 내 자신의 코드를 디버깅하고 탐색 할 수 있습니다. c) (거의) 깨끗한 MVC 아키텍처. 그리고 그것은 정말로 효과적입니다. –