既存のD3.jsのコードをアロー関数で置き換える際に変な動作を起こしてしまったのでメモしておきます。 追記 (2020/08/29) 2020年8月にリリースされた D3 v6 ではイベントリスナの書き方が変わりました。 詳しくは D3 v6 アロー関数使用時の移行ガイドへ。以下は v5 以前のコードとなります。 D3.jsでは、DOMにイベントを与えるselection.on(typenames, listener)で、イベントリスナ内でそのDOMを選択したいときにthisを使うことが多いです。 例えば、以下のようなコードがよく使われます。 d3.selectAll("rect") .data(data) .enter() .append("rect") .attr("x", function(d) {return xScale(0);}) .attr("y", function(d)
![D3.jsでアロー関数を使う時の注意点 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/fe982670313871559ad5bfe2b9d0aa309b526e76/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9RDMuanMlRTMlODElQTclRTMlODIlQTIlRTMlODMlQUQlRTMlODMlQkMlRTklOTYlQTIlRTYlOTUlQjAlRTMlODIlOTIlRTQlQkQlQkYlRTMlODElODYlRTYlOTklODIlRTMlODElQUUlRTYlQjMlQTglRTYlODQlOEYlRTclODIlQjkmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZzPWY5ODU2MmI1Y2VlZGRhMjk1ZTA4ZmYwNDUzMWYwMDFm%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBjaWVsb2F6dWwzMTAmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWQ4ZjlmOTZiODE4ODhhOWVlZDUyOGQyNDY2Y2U0Yzdl%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Db679c9d69f42ed7e5fb888b9443daaee)