Vue.jsのフレームワークの中でd3.jsを使う場合どうすればいいのか困ったので、メモとして投稿します。 Vue.jsを触ったことのある人、かつd3.jsを触ったことある人を対象にしています。 ※ Vue.js v2.5.2 / d3.js Version 4.11.0にて確認 コード全文 <head> <script src="https://unpkg.com/vue"></script> <script src="https://d3js.org/d3.v4.min.js"></script> </head> <body> <div id="vue"> <svg id="circle-001" :width="width" :height="height"></svg> <div>r: {{ r }}</div> </div> <script> new Vue({ el: '#vu
![Vue.js で d3.jsを使う その1(svgのcircleを表示) - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/05134bc369ab91e7dcb3d80229e57ba7e39098a1/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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9VnVlLmpzJTIwJUUzJTgxJUE3JTIwZDMuanMlRTMlODIlOTIlRTQlQkQlQkYlRTMlODElODYlMjAlRTMlODElOUQlRTMlODElQUUxJUVGJUJDJTg4c3ZnJUUzJTgxJUFFY2lyY2xlJUUzJTgyJTkyJUU4JUExJUE4JUU3JUE0JUJBJUVGJUJDJTg5JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz00ZGVhYTEwNzc4MGY3MDNkYWQ4YTE2OTdlZmQ0NDEzNA%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB0b2NoaWppJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1mNTA0MjNjZmZmODI4MmIzOGY3YTczOTYzNGVkOWM2Ng%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Dc507721b6a09c6c7c305083b47e6bc10)