#javascript #events #dojo #dojox.charting
#javascript #Мероприятия #dojo #dojox.charting
Вопрос:
Я новичок в JavaScript и Dojo, поэтому, пожалуйста, потерпите меня. Я пытаюсь создать круговую диаграмму, используя объект 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 и у них есть недокументированный хук, который они используют. Я не могу обещать вам, что это останется неизменным во всех обновлениях api, это выглядит примерно так:
dojo.connect(dataSeries, "_onFetchComplete", myObj, "myFunction");
Смотрите http://dojotoolkit.org/reference-guide/dojo/connect.html
Комментарии:
1. Спасибо. Я не могу проверить, правы вы или нет; Я решил не использовать Dojo в моем проекте.
2. Не беспокойтесь. Могу я спросить, что вы используете вместо этого? Dojo имеет некоторые ограничения при построении графиков больших наборов данных.
3. Вместо этого я выбрал ExtJS. Мое впечатление от него пока очень хорошее; в нем тоже есть свои недостатки и множество ошибок, но для меня у него есть три основных преимущества перед Dojo: a) Набор документации, каким бы неполным он ни был, намного лучше, чем почти несуществующий Dojo doc. б) в ExtJS разработчикам потребовались усилия, чтобы обеспечить реальную отладочную версию библиотеки, и его можно использовать полностью в отличии от Додзе основой которой является тарелку спагетти. Я могу отлаживать свой собственный код, заходя в основную библиотеку и перемещаясь по ней. c) (Почти) чистая архитектура MVC. И это действительно работает.