この質問の件名は、本当のシナリオを示していない可能性があります。以下をすべてお読みください。
次のデータに基づいて散布図を作成しています (JSON - ファイル simple.json 内):
{
"docs":
[
{"timestamp":"01","id":"100","quantity":"5","pay":"50","bp":"25","city":"Multan"},
{"timestamp":"02","id":"200","quantity":"10","pay":"100","bp":"50","city":"Lahore"},
{"timestamp":"03","id":"300","quantity":"3","pay":"30","bp":"15","city":"Multan"},
{"timestamp":"04","id":"400","quantity":"5","pay":"50","bp":"25","city":"Multan"},
{"timestamp":"05","id":"500","quantity":"6","pay":"60","bp":"30","city":"Lahore"},
{"timestamp":"06","id":"600","quantity":"15","pay":"150","bp":"75","city":"Islamabad"},
{"timestamp":"07","id":"700","quantity":"14","pay":"140","bp":"70","city":"Islamabad"},
{"timestamp":"08","id":"800","quantity":"18","pay":"180","bp":"90","city":"Islamabad"},
{"timestamp":"09","id":"900","quantity":"7","pay":"70","bp":"35","city":"Lahore"},
{"timestamp":"10","id":"1000","quantity":"20","pay":"200","bp":"100","city":"Islamabad"}
]
}
私は再利用可能なグラフを開発しようとしています。そこでは、利用可能なデータ列を (上記のデータから) ユーザーに提示できます。そのため、ユーザーは X 軸に特定の列 (「id」など) を選択し、Y 軸に別の列 (「数量」など) を選択できます (ここまではすべてが完璧で、期待どおりです)。その後、ユーザーは別の列を選択し、ボタンをクリックしてその列をグラフにプロットできます (以前に追加された列と共に)。
問題は次のとおりです。
Y軸の別の列（「支払い」など）に進むと、以前はグラフに表示されたままですが、新しいデータが正しくプロットされます（新しいデータに基づいて軸も再スケーリングしています）。しかし、古いものは再配置されません。これが実際の問題です。追加された各列を (列参照を別の配列に格納することによって) 追跡することを考えているので、新しい列があるたびに、古い列を再描画する必要があります (すべきでしょうか?)。しかし、これは D3 のパワーまたはパフォーマンスの観点からは実行可能ではないようです。
このために、描画されたすべての円に匿名クラスの「更新」を適用して、すべての「更新」円を選択できるようにしましたが、これらの円の新しい場所をどのように知ることができるかという別の問題が発生します。その特定のシリーズのデータを再度トラバースする必要がありますか? もう一度その絵を描く必要がありますか？新しいシリーズごとに、古いものを追跡して再描画すると、処理のオーバーヘッドが順番に増加します。新しい縮尺に従って以前の図面を再調整するための便利なソリューションまたは組み込み (d3 の) メカニズムはありますか?
何か提案してください。私はいくつかの重要なポイントが欠けていると確信しています。