[B! svg] noeloasisのブックマーク

目指すのはぶっちぎりの速さ! なぜ HTML5 版CacooはSVGを採用するのか | 株式会社ヌーラボ(Nulab inc.)

こんにちは！ Cacoo チームの中原です。現在CacooチームはFlashで作られている図の編集画面(以下エディタと表現します)を* HTML5 で置き換える開発を進めています。このブログでは、 HTML5 版 Cacoo で図形の描画に使用される、SVGを選択した理由と経緯について説明したいと思います。（*置き換える理由については「Good-Bye Flash ~ CacooはHTML5で生まれ変わります」をご覧ください）どの技術を使って図形を描く?重視したのは「パフォーマンス」図形の描画にどんな技術を使うか。いくつか候補を上げました。 2D Canvas 3D Canvas (WebGL) SVG (これ以外に、Unityという意見もありましたが今回はWeb標準技術を使うことを前提にしました。) さて、どれを使おう。私たちがどの技術を選択するのか、基準を決める必要があります。そ

noeloasis 2017/02/28

svg

リンク

Yarrow — svg animated arrow pointer and tooltip

var yarrow = new Yarrow(); yarrow.arrow({ x1: 100, y1: 220, x2: 300, y2: 80, text: "I'm arrow!" }).render(); var yarrow = new Yarrow(); yarrow.arrow({ x1: 100, y1: 220, x2: 300, y2: 80, text: "I'm arrow!", d: 'M0,140 Q0,0 200,0' }).render();

noeloasis 2016/06/16

SVG

リンク

SVGでプログラマブルな書体を作る話｜dwango creators' blog（ドワンゴクリエイターズブログ）

こんにちは、2016年度にデザイナー職で新卒入社しました@Ln_northです。新卒研修も終わり、現在はOJTのもとで生放送チームにジョインしています。さて、Googleのロゴが変わっていくらか経ちますが、このロゴはSVGを使うと少ないデータ量で表現できるというニュースが話題になりました。この記事を見た際に、厳密には視覚調整が入るはずなので、正確に幾何的図形とは一致しないだろうという感想も抱きました。しかし、SVGで文字を生成するということには非常に興味を持ちました。今までにも、文字のアウトラインを使ったアニメーションや表現はありましたが、文字自体を生成するというものは見たことがなく、そしてSVGはJavaScriptで操作することができるため、書体の印象が動的なフォントを作ることができると考えたからです。どういうことかというと、例えばであるとか、といったことができるかもしれない

noeloasis 2016/06/14

svg

リンク

Android 5.0からSVG準拠のdrawableが書けるようになりました - agri-note inside

こんにちは、Androidチームの中川@Nkznです。 Android Studio 0.8.14のリリースノートを見ていて知ったのですが、LollipopのAPI Level 21では<vector>などのdrawable系タグが拡充されたのですね。名前的にベクターイメージが書けそうですが、実際何ができるのだろうと思って調べてみました。 Working with Drawables | Android Developers Vector images are represented in Android as VectorDrawable objects. For more information about the pathData syntax, see the SVG Path reference. <vector>の中に書く<path>タグのpathDataの記法が、SVG準拠

noeloasis 2015/10/05

Android
svg

リンク

フロントエンドの実装から見る第四十七回衆議院選挙　開票速報ページまとめ - 暮らしの技術

700億円ほどのお金がかかっているといわれ，why-kaisan.comなんてサイトも作られ巷を賑わせた第四十七回衆議院選挙の投票日が今日でした．投票日と言うことはその後に来るのは開票で，開票と言うことは開票速報がはじまるわけです．報道各社を見てみますと，各々工夫を凝らした開票速報ページを用意しておりまして，これがなかなかおもしろいということで，その比較でございます．まとめ長いので先にまとめです．まずテレビと新聞で圧倒的に態度が違います．テレビはあくまで番組の補助だったり宣伝が目的．ウェブページではあまり情報を出したくない様子です．一方新聞各社は　トップページ上段，ファーストビューのど真ん中を思いっきり使い，文字通り全面展開といったパターンが多い．フロントエンドの実装から見ると，基本的にグラフが必要な場面ではCSS，日本地図が必要な場面では「画像+mapで部分リンク」か「要素の絶