GitHub - hideshi/pyagram
Python Finite State Machine Diagram Generator This is a command line tool, which generates finite state machine diagram for web and mobile application development from a source file through graphviz. The finite state machine diagram is a kind of diagram, which describes screen transitions and flows of the processes. The source file is written in a specific format, which enables us to write a code
Web開発でもアプリ開発でも使える状態遷移図を自動生成するツールを作りました - Qiita
概要 先日こちらの記事でgraphvizを使って状態遷移図を作成する方法をご紹介したのですが、これでもまだ複雑で記述量も多いのでとっつきづらいと思い、このgraphvizのソースコードを自動生成して画像を出力するコマンドラインアプリケーションを作成しました。 このアプリケーションはPyagram（ぱいあぐらむ）といい、その名前から察しがつくかと思いますがPythonを使用して開発されました。開発期間は１日でした。 このPyagramを使うことで複雑な状態遷移図を比較的簡単に作成することができるようになりますので、以下でご紹介したいと思います。 状態遷移図の描き方についてはこちらの記事を参考にしています。 出来上がりの図は以下のような感じになります。 図には幾つかのオブジェクトがあります。 図のタイトル（最上段） ビュー（二重丸） サーバサイドの処理（灰色の背景の一重丸） 画面遷移（破線の矢
ネットワーク機器の美しいフリーアイコン素材を使おう！:Geekなぺーじ
ルータやスイッチなどによるネットワーク図を描くときのために、美しいフリーアイコン素材があります。 2014年のInterop Tokyoで使われたものがフリー素材として公開されたものですが、一部界隈では既に多く利用されています(以下、「ShowNetアイコン」と呼びます)。 ShowNetアイコンは、2014年のInterop Tokyoページからダウンロード可能です。 2001年からいままで毎年ネットワークトポロジ図を作成されている河口さんによる、図作成に向ける熱い想いを綴ったブログが公開されていますが、その5ページ目に「One more thing...」として、ShowNetアイコン配布先リンクが示されています。 図面とともにあらんことを！：第二面 ネットワークのゲンバ -ShowNetを支えるメンバーたちの奮闘ブログ- そのままでも利用できますが、ShowNetアイコン利用上の注意
MarkDownDiagram - Markdown風記法を使ってダイアグラム作成
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Markdownが流行ると、Markdown風の記法を用いることでユーザの導入障壁を下げることができます。また、パーサーも多いのでそうしたライブラリを使うことで簡単にMarkdown風の記法が使えるようになります。 今回紹介するMarkDownDiagramもそんなMarkdown風記法を使ったソフトウェアの一つです。ダイアグラムをテキストで書けます。 MarkDownDiagramの使い方 メイン画面です。左側のエディタ部を編集すると右側のダイアグラムに反映されます。 ブロックという文字に変更してみました。 ブロックの位置はドラッグ&ドロップで変更できます。 線の色や太さを変えることもできます。 ズームもできます。 MarkDownDiagramを使えばダイアグラムを作成するのが
Markdown風テキストでダイアグラムが描けるWebツール - Qiita
MarkDownDiagram Markdown風のテキストで、ER図やブロックダイアグラムのようなチャートを描けるツールです。 こちらにインスパイアされて、もうちょっと汎用的にダイアグラムを描けるツールを作りました。 もう保守されない画面遷移図は嫌なので、UI Flow図を簡単にマークダウンぽく書くエディタ作った 特徴としては Webブラウザのみでローカルで動作 配置はマウスでドラッグして編集できる CSSで色や装飾を制御可能 といったあたりです。 githubからclone/ダウンロードして使えます。 オンラインで試すのはこちらでどうぞ。 ローカルでブラウザのみで動作します。index.htmlをブラウザで開いてください。 Chrome推奨ですが、Safari,Firefoxでも動作します。タッチIFは未対応。 機能 テキストでブロックを記述し、ブロック間を線で繋ぐ描画 ブロックをマウ
ネットワーク図を作る時に便利なアイコン集のまとめ(2016年度版)
以前「ネットワーク図を作る時に便利なアイコン集のまとめ(2013年度版) 」という記事をエントリしたのですが、それから時間が経過したので2016年度版を作ってみました。 ※ 2020年 12月05日 「Kubernetesのアイコン集」と「ヤマハネットワーク機器のアイコン集」を追加、その他のリンク集に「資料で使う技術/プロダクトロゴのリンク集 – Qiita」を追加いたしました。 ※ 2018年 11月28日 Alibaba Cloud iconsを追加いたしました。 ※ 2017年 12月22日 ニフクラ アイコン＆シンボルを追加いたしました。 ※ 2017年11月18日 cocha-iconsを追加いたしました。 ※ 2017年8月27日セキュリティアイコン/Security icons – Security along DesigNを追加いたしました。 ※ 2016年12月26日 「
WiseMapping - 5分で使い始められるWebベースマインドマップ！ MOONGIFT
ここまで高機能なマインドマップがごく手軽に！ マインドマップは思考を掘り下げ、本来考えなければならないことを明確にする良いツールです。いつでも使えるように手元に置いておくのが良いでしょう。しかしプラットフォームに左右されてしまうソフトウェアがとても多いです。 そこでWebベースのマインドマップソフトウェアを使ってみるのはいかがでしょう。今回はかなり高機能なWiseMappingを紹介します。 WiseMappingの使い方 デモのマインドマップです。高機能ぶりが分かるでしょう。 ノードにアイコンを追加したり、ノード同士を親子以外でリレーションとして結びつけることもできます。ノードの移動もドラッグ&ドロップで簡単です。 ノートの追加もできます。タイトルだけでは短いのでこういうのも欲しいですよね。 他にもリンクを付けたり、色を変更したりすることもできます。FlashではなくWebベースでさくさ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「Cacoo」でシステム構成図を書くのが捗る「さくらのアイコンセット」無料公開 