d3.js を使用して、3 都市の 3 年間の降雨量に関するカテゴリ データの散布図を作成する必要があります。
Year1 Year2 Year3
NY CA TX NY CA TX NY CA TX
17 20 15 23 10 11 14 15 17
16 18 12 15 21 22 20 18 19
13 22 16 17 25 18 17 25 18
19 18 13 16 21 20 22 15 16
（注：データとプロットはここでは一致しません。クエリを説明するためのものです）私はd3.jsをまったく初めて使用します。単純な散布図と棒グラフのチュートリアルをいくつか試みましたが、このようなカテゴリ グラフを表示する方法がわかりません。
私を始めるための助けをいただければ幸いです。
[編集] tsv ファイルのデータを次のように並べ替えました。
year state rain
1 NY 17
1 NY 16
1 NY 13
1 CA 20
1 TX 15
2 NY 23
3 CA 10
3 TX 14
3 NY 13
何か問題があるようです。「予期しない値の NaN が cx 属性を解析しています。」というメッセージが表示されます。cyについても同じです。どうすれば修正できますか？
var newArray = new Array();
// draw the scatterplot
svg.selectAll("dot") // provides a suitable grouping for the svg elements that will be added
.data(data) // associates the range of data to the group of elements
.enter().append("circle") // adds a circle for each data point
.attr("r", 5) // with a radius of 3.5 pixels
.attr("cx", function (d) {
newArray = data.filter( function (el) {
return el.category == "NY";
});
return xScale(newArray.rain);
}) // at an appropriate x coordinate
.attr("cy", function (d) {
return yScale(newArray.year);
}) // and an appropriate y coordinate
.style("fill", color(9));