埼玉で「ちょうどいい」を提案するホームページ制作会社 | 株式会社 滝沢デザイン私たちは、埼玉県に拠点を置き、 お客様と共に考え、共に創るホームページ制作会社です。 そのホームページには何が必要で何が必要でないかを真剣に考え、 目的達成のための本当に「ちょうどいい」と思えるような提案・制作をいたします。 その上でちょっとしたチャレンジや、目新しい仕組みを取り入れて 少しだけワクワクするようなクリエイティブを目指します。 さらに、SEO対策にもこだわり集客力の高いWebサイトを作成することによって、 お客様のビジネスをサポートいたしていきます。
[Web] スマートフォンとHTML5のCanvasを用いたお絵描きを実装してみた - YoheiM .NET
HTML5のCanvasというグラフィックを描ける機能と、スマートフォンを掛け合わせて、 スマホで絵を書くWebアプリのサンプルを作成してみました。 サンプルアプリを紹介しつつ、 Canvasで絵を描く実装、タップイベントとの連携、スマホ対応のためのmetaタグなどの 実装内容を記載します(*´∇｀*) サンプル内容 Canvasを用いたお絵描きアプリを、iPhoneに最適化してみました。 Canvas上を指でなぞると線を書くことが出来て、 色の変更と線の太さの変更を行うことができます。 また、ホーム画面に保存としてから、作成されたホーム画面アイコンから起動すると、 検索バーなどの無いアプリ風な画面で立ち上がります。 ぜひお試してみて頂けると幸いです。 http://www.yoheim.net/labo/html5/canvas/canvasForTouch.html お絵描き機能の実装
![[Web] スマートフォンとHTML5のCanvasを用いたお絵描きを実装してみた - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/0dc58f26cebb68beec9cb28a7d6a919c6d1425b5/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F041.png)
HTML5のcanvasを使ったお絵かきツール詳説
HTML5のcanvasを使ったお絵かきツールを勉強がてら作ってみました。下記の画像リンクをクリックすればサンプルページにジャンプします。 サンプル 以下、サンプルのHTMLとJavaScript（jQuery）を使って、canvasのお絵かきツールについて解説します。 探しきれてないだけと思いますが、お絵かきツールのjQueryでの実装が見つからなかったので、自力で書いてみました。いろいろ間違ってたらすいません。 １．HTML サンプルのHTMLは次のようになっています。 <canvas width="500" height="400">お使いのブラウザはHTML5のCanvas要素に対応していません。</canvas> <ul> <li style="background-color:#000"></li> <li style="background-color:#f00"></li>
HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」
はじめに HTML5において追加されたCanvasは、HTMLとJavaScriptを用いてWebページ内に図形や線などを描画できる機能で、動画や音楽を再生するvideoタグやaudioタグなどとともに、HTML5の代表的な機能としてしばしば紹介されます。 Canvas機能を用いるとHTMLのcanvas要素で定義された領域に対してJavaScriptで描画処理を行えます。以下のような描画を行うAPIが提供されています。 線（直線、曲線） 図形（四角形、円） 色とスタイル（単色、グラデーション、影） 文字の描画（サイズ、フォント、色の指定） 変形（拡大、回転、マトリクス変換） しかし、Canvas描画処理のJavaScript APIはグラフィックス処理独特の記述方法となっており、学習のハードルはそれなりに高いものになっています。 今回紹介するjCanvasは、HTML5 Canvasの機
HTML5のCanvasを簡単に高機能化してくれるJSライブラリ「Fabric.js」
こんにちは、渡辺です。 HTML5のCanvasを簡単に高機能化してくれるJSライブラリ「Fabric.js」を紹介します。 Canvas上に描いた絵をマウス操作で動かしたり、拡大縮小する機能が標準で付いていてスゴい便利なライブラリです！ まず、このライブラリの主な特徴についてです。 ■特徴 ・インタラクティブ性 Canvas上に描いたものをマウスやタッチで自由に操作できます（ドラッグ、拡大縮小、回転）。 ・Canvasに描いた内容をオブジェクトとして扱える Canvasに描いたものをgetメソッドやsetメソッド経由で設定変更できます。 ・Canvasのシリアライゼーション・デシリアライゼーションのサポート Canvas上の内容をJSONまたはSVGに変換でき、再度インタラクティブな描画内容を復元することができます。 ■準備 1. ライブラリのダウンロード https://github.
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
