SVG Screenshot のウェブアプリを公開しました - #daiizメモ
SVG形式でウェブページのスクリーンショットを撮るChrome拡張機能「SVG Screenshot」をより便利に使うためのウェブアプリを Google App Engine で公開しました．SVG Screenshotのコンセプトについては以下の記事をご覧ください． この記事では ウェブアプリでできること Chrome拡張機能とウェブアプリの融合（撮影したファイルをウェブアプリにアップロードして保存する機能） について，順に紹介します． ウェブアプリでできること スクリーンショットファイルを表示する https://svgscreenshot.appspot.com/viewer にアクセスすると，これまで拡張機能に付属していたものと同様なビューワページが開きます．拡張機能で生成されたスクリーンショットSVGファイルを，中央の白い領域にドラッグ・アンド・ドロップすると内容を表示できます．
リンクもまるごとキャプチャしてSVGで出力するChromeスクリーンショット拡張をつくりました - #daiizメモ
閲覧しているウェブサイトの選択された範囲のスクリーンショットを撮ってSVG形式でダウンロードできるChrome拡張機能をつくりました．SVGで出力しているため，普通のPNGやJPGと比べると，以下のような少しだけ高度なことができます． スクリーンショットを撮ったページのURLを<svg>のdata属性として保持できる スクリーンショットの範囲内のリンクをそのまま残すことができる． ページ中の<a>の位置に，外部ページヘのリンクを持つ<rect>を挿入しています．クリックするとリンク先のページが開きます． ブラウザで通常リンクと同じように扱われるため，rectをホバーするとChromeの左下にジャンプしようとしているURLが表示されるので，移動先もしっかり確認できます． まだかなり荒いベータ版ですが，GitHubで公開しています．クローンして，そのままChromeの拡張機能管理ページから読み
Polymer 1.0 でカスタムHTMLタグをつくる - #daiizメモ
昨日の記事に引き続き、Polymerの話です。今日は以下のPolymer公式ページ Publish an element - Polymer Project を読みながら、reusableなelementをつくります。ブログを書きながらプログラムを書いていきます。ブログ駆動開発!!! 初回のみ npmでpolyserveというものをインストールする。polymerではimportタグを使っており、これはサーバーから色々読み込むので開発中はローカルサーバーを立てる必要がある。index.htmlをダブルクリックして開いてもimportされないので注意。ということで、-gを付けてnpm: $ npm install -g polyserve 一回やればもう次回以降はやらなくてOK seed elementを貰う 冒頭で紹介した公式ページで種が配られているのでもらってきて、フォルダの名前をこれか
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
