次のように定義されたDojoのグラフライブラリを使用したスパイダープロットがあります。
require([
"dojox/charting/Chart",
"dojox/charting/themes/Claro",
"dojox/charting/plot2d/Spider",
"dojox/charting/action2d/Tooltip",
"dojox/charting/widget/SelectableLegend",
"dojox/charting/axis2d/Default"
], function (Chart, theme, Spider, Tooltip, Legend, Default) {
var chart = new Chart(element).setTheme(theme).addPlot("default", {
type: Spider,
radius: 200,
fontColor: "black",
labelOffset: "-20"
});
var colors = ["blue", "red", "green", "yellow", "purple", "orange", "teal",
"maroon", "olive", "lime", "aqua", "fuchsia"];
$.each(factors, function (index, factor) {
chart.addAxis(factor.name, {
type: Default,
min: factor.min,
max: factor.max
});
});
$.each(presets, function (pIndex, preset) {
var data = [];
$.each(factors, function (fIndex, factor) {
data[factor.name] = preset.values[fIndex];
});
chart.addSeries(preset.short, data, {
fill: colors[pIndex % colors.length]
});
});
new Tooltip(chart, "default");
chart.render();
new Legend({
chart: chart,
horizontal: false
}, $(element).next(".legend")[0]);
});
と呼ばれる配列のすべてのメンバーにシリーズを追加しpresets
、ユーザーが必要に応じてそれらをオンまたはオフにできる選択可能な凡例を使用します。しかし、私がドキュメントで見つけられないように見えるのは、選択されていない、表示されていない状態でシリーズを開始する方法ですか?私が理想的にやりたいのは、ページが読み込まれたときに表示されるシリーズの数を制限することです。これは、場合によっては最大14のプリセットがあり、ユーザーが束の選択を解除するまで混乱しているように見えるためです。したがって、たとえば、最初の5より上のすべてのプリセットを最初に非表示にします。
これが私がデモンストレーションするためにノックした粗雑なフィドルです。私が欲しいのは、プロットが最初に表示されるときにシリーズのいくつかを選択解除することです。
更新:シリーズを追加した後、これを追加してみました:
var checkboxes = $(".dijitCheckBoxInput").each((index, elem) => {
if (index > 4) {
elem.click();
}
});
これは機能しますが、非常に壊れやすいようです。チェックボックスに割り当てられたクラスを変更すると、壊れます。また、違いを区別する良い方法がないため、複数の道場チェックボックスを使用することを禁止しています。(に追加されたチェックボックスのIDは、、SelectableLegend
などdijit_form_CheckBox_0
でdijit_form_CheckBox_1
あり、それらが何に関連しているかについての有用な情報も提供しないことに注意してください)。子孫のチェックボックスを選択する方法として凡例のプレースホルダーdivを使用できるかもしれないと思いましたが、Dojoはプレースホルダーを完全にテーブルに置き換えているようです。