Inkscape ink2canvas extension

このエントリーをはてなブックマークに追加
はてなブックマーク - Inkscape ink2canvas extension
Share on Facebook
LINEで送る
Share on LinkedIn
Pocket

概要

ink2canvasはsvgからhtml5のcanvasで出力してくれるinkscapeのエクステンションです。
このエクステンションのインストール方法と使い方を書きます。

環境

  • Windows
  • inkscape 0.48.2

インストール

ソースコードはgithubに公開されています。

Step1

下記のURLからアーカイブをダウンロード&展開して下さい。

https://github.com/hacktoon/ink2canvas

Step2

ink2canvas.inx

ink2canvas.py
lib(Folder)

展開して出来た上記のものを下記のディレクトリに置いて下さい。
[inkscapeをインストールしたディレクトリ]\share\extensions

インストールはこれで完了です。

使い方

イラストを描く

複雑でないものを描いて下さい。

html形式で保存する

名前をつけて保存 > ファイルの種類 HTML 5(*.html) > 保存

できたファイルをブラウザで確認

ソースコード

複雑なものだとどうなる?

この記事の最初のイラストを同じようにhtml5化してみました。

複雑なものになるときれいに出力はできないようです(^_^;)

また、テキストもパス化してないと、表示されないっぽいです。

Inkscape ink2canvas extension」への4件のフィードバック

  1. pon

    ダウンロード場所が勝手に最新バージョンの場所に飛ばされるので気づきませんでした。
    この記事に従うなら、現在は
    https://github.com/jonata/Ink2canvas
    がダウンロード場所で
    ダウンロードは、このページの
    「Download ZIP」ボタンをクリッくすれば始まります。
    なお、記事中の
    ink2canvas.inc
    ではなくて
    ink2canvas.inx
    ですね。

    最新版の
    https://github.com/hacktoon/ink2canvas
    からダウンロードした場合はどれをshare\extensionsフォルダにいれるのか未だ調べていません。

    inkscapeは0.48.3以降は
    http://inkscape.paix.jp/manual/overview/known-problems/
    というバグもあるので、実質0.48.2が安定版と言えるから、このまましばらく使ってみます。

  2. junichi_11 投稿作成者

    コメントありがとうございます!
    typoとリンクを修正しました。
    jnata/ink2canvasはフォーク先なのでそちらは使わないほうがいいかもしれません。
    インストール方法は変更になっているかもしれないので、READMEを参照してみてください。
    Windowsでの0.48.3以降のバグはinkscapeのバグではなくGTKのバグのようなので、そちらが修正されたら動くようになるとは思いますが、今のところどうなっているのかはわかりません。
    (環境変数に英語の言語の設定をすれば、0.48.3以降でも動くことは動きます)

  3. pon

    管理者様、早速の対応お疲れさまです。
    当方、職場ではAdobe illustrator cs5を使って古地図のトレースなどをしているのです。
    でも個人的には、illustratorは高価なので買えませんからしかたなく、その代替品としてinkscapeを使いはじめました。
    ところが使ってみるとオープンソースということもあり、細かい部分ではillustratorとは違いますが色々とできそうです。

    ink2canvasですが、少し使ってみたところグラデーションを施すと、結果は真っ黒になります。
    グラデーションもHTML5ではサポートされているので、まだ改良の余地ありといったところでしょうか?
    それとも最新版では修正されているのでしょうか?
    どうもインストールすらよく判らないので、試すこともできません。

    次はGoogle Web Designerを試してみます。
    ありがとうございました。

  4. junichi_11 投稿作成者

    私がこの記事を書いたのは随分前のことで、残念ながら現在このプラグインを使用していないので試してみていないのでわかりません。
    試してみた時に追記したいと思います。
    Inkscapeは印刷に使わないのであれば、結構いろいろとできますよ。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です