Movatterモバイル変換

はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数！

アプリで開く

はてなブックマーク

閉じる

テクノロジー
グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing

気に入った記事をブックマーク

気に入った記事を保存できます
保存した記事の一覧は、はてなブックマークで確認・編集ができます
記事を読んだ感想やメモを書き残せます
非公開でブックマークすることもできます

グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing

テクノロジーカテゴリーの変更を依頼記事元:

hashrock.hatenablog.com

適切な情報に変更

エントリーの編集

エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。

このページのオーナーなので以下のアクションを実行できます

タイトル、本文などの情報を
再取得することができます

コメントを非表示にできますコメント表示の設定

ブックマークしました

ここにツイート内容が記載されますhttps://b.hatena.ne.jp/URLはspanで囲んでください

Twitterで共有

次回からTwitterへ自動リダイレクト

ONにすると、次回以降このダイアログを飛ばしてTwitterに遷移します

813usersがブックマークコメント

コメント

57

ゲスト

コメントするにはログインが必要ですブックマークを追加

ブックマークを追加

おすすめタグタグについて

よく使うタグ

グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing

813 users

hashrock.hatenablog.com

おすすめタグタグについて

よく使うタグ

はてなブックマークで
関心をシェアしよう

みんなの興味と感想が集まることで
新しい発見や、深堀りがもっと楽しく

ユーザー登録

アカウントをお持ちの方はログインページへ

記事へのコメント57件

注目コメント
新着コメント

KoshianXなるほど SVG なら DOM 要素として扱えるから JS からいろいろとできるわけねえ。ますますデザインの知識が必要になるなあ、フロントエンド界隈……。

2017/12/05リンク

その他

hirose504面白そう

2017/12/05リンク

その他

h5y1m141お仕事で、ちょうどカレンダーっぽいやつをVueベースで作りたいと思っていたけどなるほどおSVGと組み合わせることでこんなことが出来るのか。明日もくもく会の勉強会やるからそのネタにしよ

2017/12/05リンク

その他

tech-kazuhisaDOM要素で線が描けるってことは夢が広がるな

2017/12/05リンク

その他

morita_non前はd3.jsだったもんだが。svgはいいね。

2017/12/05リンク

その他

pongeponge同じくSVGは重いってイメージ持ってるけど、案外速かったのか

2017/12/05リンク

その他

gt-r-blazeリサイズUIなど

Vue.js

2019/02/13リンク

その他

tarchan＞VueでなくてもReactでもRiotでもElmでもいいのですが、とにかくSVGはバインディングとの相性が良いです。

svg
ui

2019/02/04リンク

その他

MasaoBlue最高

2018/07/22リンク

その他

soramugi<http://hashrock.hatenablog.com/entry/2017/12/04/215559>

2018/07/20リンク

その他

idr_zzVueでSVG！オラワク！グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing

2018/02/16リンク

その他

damdomたのしい

2018/01/05リンク

その他

Nyohoおもしろ

2017/12/16リンク

その他

kenichi_odoSVGはミライヒロガル

2017/12/11リンク

その他

NetPenguinちゃんとDOMとして、当たり前にバインドできるの、すばらしいな。

2017/12/06リンク

その他

kathewcanvasの代替になりうる。普通のUIに組み込む場合は車輪の再開発をしないように心がけよう…

2017/12/06リンク

その他

kyotawebsvgをこうやって使うと面白いな

2017/12/06リンク

その他

UDONCHANしゅっとしてる

2017/12/06リンク

その他

otchy210SVG は css でスタイル当てて色変えたりも出来るので便利。

2017/12/06リンク

その他

securecatSVGは良いものだ

2017/12/05リンク

その他

yoavltおもしろい。

2017/12/05リンク

その他

ysk_lucky-starSVGはSVGでハマりどころがあるからつらい

2017/12/05リンク

その他

griefworkerSVGにデータバインディングが効くとは。

2017/12/05リンク

その他

bnmountainおおっ

2017/12/05リンク

その他

wdr_sこれ、めちゃくちゃ楽しそう。やってみたい。

2017/12/05リンク

その他

likr速いのは数千要素までってのはすごくよくわかる。それ以降はcanvas、WebGLの世界。

2017/12/05リンク

その他

ledsunいまやSVGは速いよね。「1000ノードを毎requestAnimationFrameで動かす」とかでなければ、十分早く動く。

2017/12/05リンク

その他

raimon49DOMバインディングできるのはCanvasに無い強みだよなぁ。

2017/12/05リンク

その他

moondoldoSVG Web

*プログラミング

2017/12/05リンク

その他

rti7743SVGはクソみたいに遅いイメージがあったけど、今は違うのか

2017/12/05リンク

その他

igrepelm-svgでラブリーコミューンを作ったのを思い出す（現在表示崩れが起きてしまっているので共有はしません！）

vue.js

2017/12/05リンク

その他

bokuweb楽しそう

2017/12/05リンク

その他

yamadarこれは、興味湧く良い記事

2017/12/05リンク

その他

toenobucacooの実装も気になる。

2017/12/05リンク

その他

implemこれためしてみたいな。

2017/12/05リンク

その他

oka_mailerほー

2017/12/05リンク

その他

ゲスト

コメントするにはログインが必要ですログインしてコメント

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

リンクを埋め込む

以下のコードをコピーしてサイトに埋め込むことができます

プレビュー

はてなブックマークボタンを作成して埋め込むこともできます

規約違反を報告

アプリのスクリーンショット

いまの話題をアプリでチェック！

バナー広告なし
ミュート機能あり
ダークモード搭載

アプリをダウンロード

関連記事

usersに達しました！

さんが1番目にブックマークした記事「グリグリ動くUIをV...」が注目されています。

気持ちをシェアしよう

ツイートする

グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing

これはVue.js #3 Advent Calendar 2017 – Qiita 4日目の記事です。こんにちは。SVGで色々なコンポーネ...これはVue.js #3 Advent Calendar 2017 – Qiita 4日目の記事です。こんにちは。SVGで色々なコンポーネントを作っているものです。最近の作品は下記のような感じです。 Webでグリグリ動くUIを作りたい！！という一心でやっています。これらはほとんどSVGとVueの組み合わせのみで作っています。依存が少ないというのは大事で、ライブラリ間の相性でハマったり、いろんなドキュメント間を往復することがなくなります。 Webでグリグリ動くUIを作るのは基本的にめんどくさいです。jQuery pluginを駆使して作るのも闇が多いですし、divやcanvasをゴリゴリするのも結構手間がかかります。ですが、最近はSVGで高度なUI実装されることが増えてきた気がします。特に自分が衝撃を受けたのは、CacooがFlashからSVGにスイッチしたことです。nulab-i

ブックマークしたユーザー

take-yu2025/08/06
techtech05212024/01/30
ysog2022/06/04
akanehara2021/10/16
pattier2020/08/01
nyasba2020/05/23
kaz_hiramatsu2020/04/26
kyoruni2020/02/05
g59taxi2019/12/26
snjx2019/10/30
azechi_n2019/09/19
sadness_ojisan2019/05/20
hate_nao2019/05/04
ita_872019/03/23
gt-r-blaze2019/02/13
hagane2019/02/07
tarchan2019/02/04
kinokotv2018/12/28

すべてのユーザーの
詳細を表示します

ブックマークしたすべてのユーザー

同じサイトの新着

同じサイトの新着をもっと読む

いま人気の記事

いま人気の記事をもっと読む

いま人気の記事 - テクノロジー

いま人気の記事 - テクノロジーをもっと読む

新着記事 - テクノロジー

新着記事 - テクノロジーをもっと読む

同時期にブックマークされた記事

いま人気の記事 - 企業メディア

企業メディアをもっと読む

はてなブックマーク

公式Twitter

はてなのサービス

Copyright © 2005-2025Hatena. All Rights Reserved.

設定を変更しましたx

[8]ページ先頭

©2009-2025 Movatter.jp