HTMLグラフィックスプログラミング
初心者のための画像の操作からゲーム開発まで
著者 | 日向 俊二 |
---|---|
判型 | B5変型、420頁 |
ISBN | 978-4-87783-515-6 |
価格 | 本体3,600円 |
発行日 | 2021年12月20日(初版 第1刷発行) |
備考 | ダウンロードサービス:学習に使えるサンプルファイル |
本書について
本書では、いわゆるホームページに、図形や絵、アニメーションや画像(二次元グラフィックス)を表示する方法について解説します。この方法を使うと、ホームページの中に図形や画像を表示するだけではなく、自由に図形やグラフを描いたり、ゲームを作ることさえできます。
本書で解説する方法は、HTMLの<canvas>要素を使う方法、CSS(スタイル)を使う方法、SVGを使う方法の3種類です。HTMLドキュメントの中でHTMLの<canvas>要素を使う方法では、プログラミングの経験がないか少ない場合には、グラフィックスのプログラミングは難しいと感じるかもしれません。実際、本書の内容を完全に理解するには、HTMLとCSS、そしてJavaScriptというものを理解する必要がありますが、本書では経験のない初心者のために最初からやさしく解説します。
CSSによる描画や、<svg>要素を使ったSVGによるグラフィックス描画については、CSSやSVGそのものに強力な画像操作機能が備わっているので、JavaScriptを使わなくても比較的単純な記述でさまざまな表現ができます。さらに、SVGをJavaScriptで扱うこともできます。
本書は、ファイルやフォルダ(ディレクトリ)などについて基本的な知識があり、WebブラウザのようなWebクライアントの使い方、ファイルのコピーやテキストファイルの作成と編集などの基本的な操作ができる読者を対象にしています。本書を活用して実際にHTMLドキュメントの作成に取り組むことで確実に実力を身に着けることができます。
本書を活用してHTMLのグラフィックスの基礎を楽しくマスターしてください。
目次
- 第1章 ホームページとグラフィックス
- 1.1 HTMLドキュメント
- 1.2 CSSとJavaScript
- 1.3 HTMLのグラフィックス
- 1.4 Webサーバー
- 第2章 HTMLとCSSの基礎
- 2.1 HTMLの基礎
- 2.2 HTMLの例
- 2.3 CSSの基礎
- 2.4 CSSファイル
- 第3章 JavaScriptの基礎
- 3.1 JavaScriptについて
- 3.2 JavaScriptの基本的な要素
- 3.3 制御構造
- 3.4 演算
- 3.5 オブジェクト指向プログラミング
- 第4章 HTMLの主な要素
- 4.1 HTMLのタグ
- 4.2 イメージとビデオ
- 4.3 input要素
- 第5章 図形とテキストの描画
- 5.1 キャンバス
- 5.2 図形
- 5.3 デザイン要素
- 5.4 テキスト
- 5.5 グラフ
- 第6章 イベント処理
- 6.1 イベントとプログラム
- 6.2 さまざまなイベント
- 6.3 イベントリスナー
- 第7章 キャンバスとイメージ
- 7.1 イメージの表示
- 7.2 イメージの操作
- 第8章 ゲーム
- 8.1 ゲームの要素
- 8.2 シンプルなゲーム
- 8.3 動きのあるゲーム
- 第9章 CSSとグラフィックス
- 9.1 CSSによる操作
- 9.2 変形
- 9.3 グラデーション
- 9.4 アニメーション
- 第10章 SVGの基礎
- 10.1 SVGの基礎
- 10.2 基本的な要素
- 10.3 座標
- 10.4 さまざまな図形
- 10.5 ストロークとフィル
- 10.6 テキストの描画
- 第11章 画像操作とアニメーション
- 11.1 変換
- 11.2 クリッピングとマスキング
- 11.3 フィルター
- 11.4 グラデーション
- 11.5 アニメーションの基礎
- 11.6 単純なアニメーション
- 11.7 さまざまなアニメーション
- 11.8 SVGとJavaScript
- 付 録
- 付録A トラブル対策
- 付録B 課題解答例
- 付録C 参考リソース