タグ

ブックマーク / daiiz.hatenablog.com (1)

  • リンクもまるごとキャプチャしてSVGで出力するChromeスクリーンショット拡張をつくりました - #daiizメモ

    閲覧しているウェブサイトの選択された範囲のスクリーンショットを撮ってSVG形式でダウンロードできるChrome拡張機能をつくりました.SVGで出力しているため,普通のPNGやJPGと比べると,以下のような少しだけ高度なことができます. スクリーンショットを撮ったページのURLを<svg>のdata属性として保持できる スクリーンショットの範囲内のリンクをそのまま残すことができる. ページ中の<a>の位置に,外部ページヘのリンクを持つ<rect>を挿入しています.クリックするとリンク先のページが開きます. ブラウザで通常リンクと同じように扱われるため,rectをホバーするとChromeの左下にジャンプしようとしているURLが表示されるので,移動先もしっかり確認できます. まだかなり荒いベータ版ですが,GitHubで公開しています.クローンして,そのままChrome拡張機能管理ページから読み

    リンクもまるごとキャプチャしてSVGで出力するChromeスクリーンショット拡張をつくりました - #daiizメモ
    igrep
    igrep 2016/04/07
    あー。色つけたサンプルのソースコードにSVGで注釈付けるのに使えないかと思ったけどpngにしちゃうのかー。そりゃそうかー。
  • 1