GitHub - rossmoody/svg-gobbler: Open source browser extension for finding, editing, exporting, optimizing, and managing SVG content.You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Deno で Satori を使ってSVGを生成する
Deno/Lume でOGPを利用するために, まずは Satori を使ってSVGを生成する方法を調べました. もともと Deno/Lume で Preact を使っていたため, SVGが生成されないというところがスタートです. 環境 Deno 1.41.3 React 18.2.0 Satori 0.10.13 React の設定 まずは Deno でJSXを扱えるように設定を行います. Deno では React 17 以降の JSX transform に対応しています[1]. 利用するには deno.json に compilerOptions を追加します. 設定項目は tsconfig と同様のようです. Deno 公式では Preact を使った例が紹介されていますが, 通常の React を利用することも可能です. というか React じゃないと Satori が動かな
Kroki!
Kroki provides a unified API with support for BlockDiag (BlockDiag, SeqDiag, ActDiag, NwDiag, PacketDiag, RackDiag), BPMN, Bytefield, C4 (with PlantUML), D2, DBML, Ditaa, Erd, Excalidraw, GraphViz, Mermaid, Nomnoml, Pikchr, PlantUML, Structurizr, SvgBob, Symbolator, TikZ, UMLet, Vega, Vega-Lite, WaveDrom, WireViz... and more to come! 📢 We're planning the future of Kroki, and we need your insights
SVG ANIMATIONS
This is the animation that sparked this entire experiment. Sometime in early 2018, I decided to learn a little about SVG's <animate/> element. However after playing around with it for a while I decided to lean into using CSS animations. From past experience I knew that I could style SVGs using CSS (see the controls of my Chaos Game experiment), but I did not know that you could include full styles
WordPressの投稿でSVG画像を使えるようにしても、OGPやTwitter Cardsで対応してなかった件 – Rriver
WordPressの投稿でSVG画像を使えるようにしても、OGPやTwitter Cardsで対応してなかった件 イメージオプティム でPNG画像を最適化すると、やたらと時間がかかるなぁと思ってTwitterでつぶやいたら「さっさとSVGに行けと言う啓示なのでは？笑」というコメントをいただきました（笑）。最近このブログに使う画像はSVGに最適なイラストが多いですし、ファイルサイズを小さくできて高解像度のディスプレーにも対応できるので確かにメリットがありそうです。 そこで早速WordPressの投稿にSVG画像をアップしようと思ったんですが。。。メディアアップローダーでは以下のようなメッセージが出てきてアップさせてもらえませんでした。デフォルトではサポートされてないんですね。ちょっと驚きました。 ということで、今回はWordPressの投稿でSVGを使うために必要なカスタマイズや関連する設定
Textures.js
SVG patterns for Data Visualization Textures are useful for the selective perception of different categories View on Github Getting started -- from the top of d3.js -- var svg = d3.select("#example") .append("svg"); var t = textures.lines() .thicker(); svg.call(t); svg.append("circle") .attr("r", radius) .style("fill", t.url()); Lines
SVGに対する誤解を紐解く
憎きieがようやっと世代交代するにあたり，今年こそSVG元年となるべく，(個人的に)頑張らにゃいかん，そんな気がするんですが，そうは行っても世間的にはsvgはまだまだマイナーな存在であってwebを眺めると結構な思い込みとか偏見とかが見受けられます．まぁ別に構いやしないんですが，SVGのポテンシャルを引き出すにはより良いSVGへの理解は必須ですから，ひとつ私見ではありますがよくあるSVGに対する誤解に意見してみようかと． つーかHIT数多すぎてびっくりしているんよ ちょこちょこ追加していくよ Thanx @rikuo . 注意・2014/01/16 この記事はある程度SVGについて調べた上で読むことをおすすめします．そうすることでSVGを”理解した後に生まれてくる”数々のモヤモヤが解消することでしょう．（筆者もかつてそうでした） 逆にSVGに不慣れな人が読んだ場合，却って理解を妨げる危険があ
Vega - Redirect
The Vega webpage has moved to http://vega.github.io/vega/.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - andrewcourtice/ripl: Ripl provides a unified API for 2D graphics rendering in the browser with a focus towards high performance and interactive data visualization.
From static to interactive: turn SVG diagrams into exciting experiences on your website
GitHub - xyproto/png2svg: :twisted_rightwards_arrows: Convert small PNG images to SVG Tiny 1.2
GitHub - vercel/satori: Enlightened library to convert HTML and CSS to SVG
Exploiting Scratch with a malicious image
How to create an interactive donut chart using SVG
GitHub - rh12503/triangula: Generate high-quality triangulated and polygonal art from images.
GitHub - ndrwhr/svg-animation-src
GitHub - outbrain/tech-companies-logos-in-css: A repository with tech companies logos made with pure CSS!
Ascii to SVG
GitHub - filamentgroup/grunticon: A mystical CSS icon solution.
Google Code Archive - Long-term storage for Google Code Project Hosting.