タグ

SVGに関するkiyoshi1211のブックマーク (7)

  • 畳み込みニューラルネットワークをKeras風に定義するとアーキテクチャの図をパワーポイントで保存してくれるツールを作った - Qiita

    (2018/01/05 追記)ちょうどpython-pptxを調べていたので、pptx形式で図を保存できるようにし、タイトルも修正しました。 はじめに 論文やスライドで、畳み込みニューラルネットワークのアーキテクチャを良い感じに表示したいときがありますよね?スライドだとオリジナル論文の図の引用でも良いかなという気がしますが、論文の図としては使いたくありません。 ということでKerasのSequentialモデルのような記法でモデルを定義すると、そのアーキテクチャを良い感じに図示してくれるツールを作りました。言ってしまえばテキストを出力しているだけのツールなので依存ライブラリとかもありません。 https://github.com/yu4u/convnet-drawer ここまで実装するつもりはなかったので綺麗に設計できていませんが、バグ報告や追加機能要望welcomeです! 経緯 元々は、

    畳み込みニューラルネットワークをKeras風に定義するとアーキテクチャの図をパワーポイントで保存してくれるツールを作った - Qiita
  • 簡単にガントチャートとかクラス図とか書けるやつ - Qiita

    mermaidは、Web上で簡単にフローチャートやシーケンス図などのUMLが描けるライブラリです。 d3.jsの機能特化型というかんじで、d3ほど様々なことはできませんが、そのかわりに対応してる図形なら非常に簡単に描くことが可能です。 なお、ヘルプはGitGraphやクラス図が載ってないなど未完成で、いまいち頼れません。 ごたくはいい、実物を見せろ こんなかんじ →支払い忘れてサーバが死んだので代替(誰かが書いたやつに勝手にリンク) できること 以下の図が描ける。 ・フローチャート ・シーケンス図 ・ガントチャート ・クラス図 ・gitグラフ 最後だけ異質だ。 インストール CDNを使えばいいだけだが、自分のところに置きたい場合はyarnで引っ張ってこれる。 <!DOCTYPE html> <html lang="ja"> <head> <link rel="stylesheet" hre

    簡単にガントチャートとかクラス図とか書けるやつ - Qiita
    kiyoshi1211
    kiyoshi1211 2017/08/03
    簡単だけど簡単じゃない
  • 作図系ツール・ライブラリまとめ

    diag.md シーケンス図とかフローチャートをしごとで描画することになった場合、 テキストから生成できたら楽なので、それ系のツールまとめ GraphViz http://www.graphviz.org/ C製 Doxygen, Moinmoinなどと連携可能 ブロック図、クラス図、ネットワーク図など PNG, SVGなど 出力可能形式一覧 JavaScriptEmscripten)版もある。リアルタイムプレビュー出来て便利 https://github.com/mdaines/viz.js PlantUML Java製 シーケンス図, ユースケース図, クラス図, アクティビティ図, コンポーネント図, ステート図, デプロイ図, オブジェクト図などめっちゃたくさん作れる PNG, SVG, LaTeX, ASCII出力 なんとワイヤーフレームも作れる。アイコンとかも入れられる。 オ

    作図系ツール・ライブラリまとめ
  • SVG Viewing & Diffing

    AI & MLLearn about artificial intelligence and machine learning across the GitHub ecosystem and the wider industry. Generative AILearn how to build with generative AI. GitHub CopilotChange how you work with GitHub Copilot. LLMsEverything developers need to know about LLMs. Machine learningMachine learning tips, tricks, and best practices. How AI code generation worksExplore the capabilities and be

    SVG Viewing & Diffing
    kiyoshi1211
    kiyoshi1211 2014/10/07
    すごい
  • SVGや動画、CSSアニメーションを使った面白いアイデア満載!じっくりチェックしておきたい最近のWebサイトのまとめ

    まだまだ魅力溢れるスクロールエフェクト、SVGなどのベクターデータや動画を使った演出、ユーザーを楽しませたり注目を得るアニメーションエフェクトなど、面白いアイデア満載のWebサイトを紹介します。 Garden 制作のコンセプト:Garden Estúdio 秋を感じるカラースキームとイラストだけがこのサイトの魅力ではありません。公園のモニュメントをモチーフにしたSVGの素敵なエレメント、スクロールに応じて変化するSVGのアニメーションやパララックスのエフェクトなど、最新のテクニックを効果的に使用しています。 Portfolioに掲載されている他のサイトもかっこいいものばかりです。

    SVGや動画、CSSアニメーションを使った面白いアイデア満載!じっくりチェックしておきたい最近のWebサイトのまとめ
  • D3.jsで作成したグラフ(SVG)を画像として保存する - Tech-Sketch

    先日公開した D3.jsをつかってData-Drivenにリッチなグラフやチャートを作成しよう の記事ではD3.jsをつかってグラフを作成しました。記事ではD3.jsで作成したSVG形式のグラフをPNG形式の画像として保存する方法をご紹介します。 D3.jsにはCSVやJSONなど 様々なデータ形式を扱う為の便利なメソッド が用意されており、アプリケーションへの組み込みが容易です。しかしアプリケーションへの組み込みとなると、「X月X日の状態のグラフを保存しておきたい」、「グラフを資料に添付したい」といった要望も出てくるのではないでしょうか。 単純に画面のスクリーンショットを取得する以外では Phantom.js を利用してキャプチャを取得する方法や Apache Batik を利用してSVGを変換する方法などが考えられましたが、クライアントサイドだけで完結しない上、実装が少々手間です。

  • Advent Calendar 3日目:SVG画像を1キロバイトでも削るダイエット術! - 聴く耳を持たない(片方しか)

    これは GraphicalWeb (CSS, SVG, WebGL etc) Advent Calendar 2012 - Adventar への参加の記事です。 3日目の今日は私 id:rikuo がSVG画像ファイルの軽量化テクニックを取り上げてみます。 ちょっと長くなってしまったので、ご注意ください。 はじめに、SVGとは? まず始めに、SVGとは何か?の簡単な説明です。 SVGとはScalable Vector Graphics(スケーラブルベクターグラフィックス)の略で、XMLを基盤に書かれた画像記述言語、またはベクター画像ファイルのことです。画像ファイルというと、JPEG、GIF、PNGまたBMPなどはよく知られていますね。それらの画像はピクセル(ドット)ごとに色を表現したもので、総じてラスター(ビットマップ)画像と呼ばれています。 対してSVGは座標や図形で扱うため、拡大・縮

    Advent Calendar 3日目:SVG画像を1キロバイトでも削るダイエット術! - 聴く耳を持たない(片方しか)
  • 1