SVGエッセンシャルズ 第2版

Book description

SVGは2001年にW3C勧告として公開されたXMLベースの画像フォーマットです。ベクターグラフィックスなので拡大縮小、変形しても美しさが損なわれません。本書では簡潔なサンプルを数多く使い、基本的な図形の作成、アニメーションや複雑なグラフィックスの作成、さらにはスクリプトによる制御など、SVGの基礎から応用までをわかりやすく解説します。スマートフォンのSVG対応も進み、今後はさらに利用が膨らむであろうこのレガシーで今とても熱いフォーマットの基本を本書でマスターしましょう。

Table of contents

  1. 大扉
  2. 原書大扉
  3. クレジット
  4.  
  5. まえがき
    1. 本書の対象読者
    2. 本書の非対象読者
    3. それでも本書を読む人は……
    4. サンプルについて
    5. 本書の構成
    6. 表記上のルール
    7. 意見と質問
    8. 初版に関する謝辞
    9. 第2版に関する謝辞
  6. 1章 はじめに
    1. 1.1 グラフィックスシステム
      1. 1.1.1 ラスターグラフィックス
      2. 1.1.2 ベクターグラフィックス
      3. 1.1.3 ラスターグラフィックスの用途
      4. 1.1.4 ベクターグラフィックスの用途
    2. 1.2 拡大と縮小
    3. 1.3 SVGの役割
    4. 1.4 SVGグラフィックスの作成
      1. 1.4.1 文書構造
      2. 1.4.2 基本的な図形
      3. 1.4.3 スタイルを属性として指定する
      4. 1.4.4 グラフィックオブジェクトをグループ化する
      5. 1.4.5 座標系の変換
      6. 1.4.6 その他の基本的な図形
      7. 1.4.7 パス
      8. 1.4.8 テキスト
  7. 2章 WebページでのSVGの使用
    1. 2.1 画像としてのSVG
      1. 2.1.1 <img>要素の中にSVGを含める
      2. 2.1.2 CSSの中にSVGを含める
    2. 2.2 アプリケーションとしてのSVG
    3. 2.3 混合文書でのSVGマークアップ
      1. 2.3.1 SVGでの外部オブジェクト
      2. 2.3.2 XHTMLやHTML5でのインラインSVG
      3. 2.3.3 その他のXMLアプリケーションでのSVG
  8. 3章 座標系
    1. 3.1 ビューポート
    2. 3.2 デフォルトのユーザー座標系の使用
    3. 3.3 ビューポートに対するユーザー座標系の指定
    4. 3.4 アスペクト比の維持
      1. 3.4.1 preserveAspectRatioに関する位置揃えの指定
      2. 3.4.2 meet指定子の使用
      3. 3.4.3 slice指定子の使用
      4. 3.4.4 none指定子の使用
    5. 3.5 ネストされた座標系
  9. 4章 基本図形
    1. 4.1 直線
    2. 4.2 ストロークの特性
      1. 4.2.1 stroke-width
      2. 4.2.2 ストロークの色
      3. 4.2.3 stroke-opacity
      4. 4.2.4 stroke-dasharray
    3. 4.3 矩形
      1. 4.3.1 角の丸い矩形
    4. 4.4 円と楕円
    5. 4.5 <polygon>要素(多角形)
      1. 4.5.1 交差する線を持つ多角形の塗りつぶし
    6. 4.6 <polyline>要素(折れ線)
    7. 4.7 ラインキャップと結合部
    8. 4.8 基本図形のリファレンスの要約
      1. 4.8.1 図形要素
      2. 4.8.2 色の指定
      3. 4.8.3 ストロークと塗りつぶしの特性
  10. 5章 文書構造
    1. 5.1 構造とプレゼンテーション
    2. 5.2 SVGでのスタイルの使用
      1. 5.2.1 インラインスタイル
      2. 5.2.2 内部スタイルシート
      3. 5.2.3 外部スタイルシート
      4. 5.2.4 プレゼンテーション属性
    3. 5.3 オブジェクトのグループ化と参照
      1. 5.3.1 <g>要素
      2. 5.3.2 <use>要素
      3. 5.3.3 <defs>要素
      4. 5.3.4 <symbol>要素
      5. 5.3.5 <image>要素
  11. 6章 座標系の変換
    1. 6.1 translate変換(移動)
    2. 6.2 scale変換(拡大縮小)
    3. 6.3 一連の変換
    4. 6.4 テクニック:デカルト座標系からの変換
    5. 6.5 rotate変換(回転)
    6. 6.6 テクニック:指定した点を中心とする拡大縮小
    7. 6.7 skewX変換とskewY変換(傾斜)
    8. 6.8 変換に関するリファレンスの要約
    9. 6.9 CSSでの変換とSVG
  12. 7章 パス
    1. 7.1 moveto、lineto、closepath
    2. 7.2 相対的なmovetoおよびlineto
    3. 7.3 パスのショートカット
      1. 7.3.1 水平のlinetoコマンドと垂直のlinetoコマンド
      2. 7.3.2 パスに関する表記上のショートカット
    4. 7.4 楕円弧
    5. 7.5 他の楕円弧フォーマットからの変換
    6. 7.6 ベジェ曲線
      1. 7.6.1 二次ベジェ曲線
      2. 7.6.2 三次ベジェ曲線
    7. 7.7 パスに関するリファレンスの要約
    8. 7.8 パスと塗りつぶし
    9. 7.9 <marker>要素(マーカー)
    10. 7.10 マーカーに関するいろいろ
  13. 8章 パターンとグラデーション
    1. 8.1 パターン
      1. 8.1.1 patternUnits属性
      2. 8.1.2 patternContentUnits属性
      3. 8.1.3 ネストされたパターン
    2. 8.2 グラデーション
      1. 8.2.1 linearGradient要素(線形グラデーション)
      2. 8.2.2 radialGradient要素(円形グラデーション)
      3. 8.2.3 グラデーションに関するリファレンスの要約
    3. 8.3 パターンやグラデーションの変換
  14. 9章 テキスト
    1. 9.1 テキストに関する用語
    2. 9.2 <text>要素の属性とプロパティ
    3. 9.3 テキストの位置揃え
    4. 9.4 <tspan>要素
    5. 9.5 textLength属性の設定
    6. 9.6 縦書きのテキスト
    7. 9.7 国際化対応とテキスト
      1. 9.7.1 Unicodeと双方向性
      2. 9.7.2 <switch>要素
      3. 9.7.3 カスタムフォントの使用
    8. 9.8 パスに沿ったテキスト
    9. 9.9 空白類文字とテキスト
    10. 9.10 ケーススタディ:グラフィックにテキストを追加する
  15. 10章 クリッピングとマスキング
    1. 10.1 パスに従うクリッピング
    2. 10.2 マスキング
    3. 10.3 ケーススタディ:グラフィックのマスキング
  16. 11章 フィルター
    1. 11.1 フィルターはどのように機能するか
    2. 11.2 ドロップシャドウの作成
      1. 11.2.1 フィルターの境界を設定する
      2. 11.2.2 <feGaussianBlur>を使ってドロップシャドウを作成する
      3. 11.2.3 フィルター結果の保存、連鎖、統合
    3. 11.3 グローシャドウの作成
      1. 11.3.1 <feColorMatrix>要素
      2. 11.3.2 さらに<feColorMatrix>要素について
    4. 11.4 <feImage>要素
    5. 11.5 <feComponentTransfer>要素
    6. 11.6 <feComposite>要素
    7. 11.7 <feBlend>要素
    8. 11.8 <feFlood>要素と<feTile>要素
    9. 11.9 照明効果
      1. 11.9.1 拡散照明
      2. 11.9.2 鏡面反射照明
    10. 11.10 背景へのアクセス
    11. 11.11 <feMorphology>要素
    12. 11.12 <feConvolveMatrix>要素
    13. 11.13 <feDisplacementMap>要素
    14. 11.14 <feTurbulence>要素
    15. 11.15 フィルターに関するリファレンスの要約
  17. 12章 アニメーション
    1. 12.1 アニメーションの基礎
    2. 12.2 時間はどのように計測されるか
    3. 12.3 アニメーションの同期
    4. 12.4 反復アクション
    5. 12.5 さまざまな属性のアニメーション化
    6. 12.6 複数値の指定
    7. 12.7 多段階アニメーションのタイミング
    8. 12.8 <set>要素
    9. 12.9 <animateTransform>要素
    10. 12.10 <animateMotion>要素
    11. 12.11 モーションパスのkeyPointsとkeyTimesの指定
    12. 12.12 CSSによるSVG要素のアニメーション
      1. 12.12.1 アニメーションのプロパティ
      2. 12.12.2 アニメーションのキーフレームの設定
      3. 12.12.3 CSSによる動きのアニメーション化
  18. 13章 対話性
    1. 13.1 SVGでのリンクの使用
    2. 13.2 CSSアニメーションの制御
    3. 13.3 ユーザーによって始動されるSMILアニメーション
    4. 13.4 SVGでのスクリプト
      1. 13.4.1 イベント:概要
      2. 13.4.2 イベントに対する監視と応答
      3. 13.4.3 複数オブジェクトの属性を変更する
      4. 13.4.4 オブジェクトのドラッグ
      5. 13.4.5 HTMLページとの連携
      6. 13.4.6 新しい要素の作成
  19. 14章 SVG DOMの使用
    1. 14.1 要素の属性値の判別
      1. 14.1.1 SVGデータオブジェクト
    2. 14.2 SVGのインターフェースメソッド
      1. 14.2.1 SVG要素に対するインターフェース
    3. 14.3 ECMAScript/JavaScriptを用いたSVGの作成
    4. 14.4 スクリプトによるアニメーション
    5. 14.5 JavaScriptライブラリーの利用
    6. 14.6 Snapでのイベント処理
      1. 14.6.1 オブジェクトのクリック
      2. 14.6.2 オブジェクトのドラッグ
  20. 15章 SVGの生成
    1. 15.1 カスタムデータをSVGに変換する
    2. 15.2 XSLTを使ってXMLデータをSVGに変換する
      1. 15.2.1 課題を定義する
      2. 15.2.2 XSLTはどのように機能するか
      3. 15.2.3 XSLスタイルシートの作成
  21. 付録A SVGのために必要なXML
    1. A.1 XMLとは何か?
    2. A.2 XML文書の解剖
      1. A.2.1 要素と属性
      2. A.2.2 名前に関する構文
      3. A.2.3 整形式
      4. A.2.4 コメント
      5. A.2.5 実体参照
      6. A.2.6 文字参照
    3. A.3 文字エンコード
      1. A.3.1 Unicodeエンコード方式
      2. A.3.2 その他の文字エンコード
    4. A.4 妥当性
      1. A.4.1 文書型定義(DTD)
      2. A.4.2 それらを組み合わせる
    5. A.5 XML名前空間
    6. A.6 XMLを処理するためのツール
      1. A.6.1 パーサーの選択
      2. A.6.2 XSLTプロセッサー
  22. 付録B スタイルシート入門
    1. B.1 スタイルの解剖
    2. B.2 インラインスタイル:style属性
    3. B.3 内部スタイルシート
    4. B.4 クラスセレクター
    5. B.5 SVGでのCSSの使用
  23. 付録C プログラミングの概念
    1. C.1 定数
    2. C.2 変数
    3. C.3 代入と演算子
    4. C.4 配列
    5. C.5 コメント
    6. C.6 条件文
    7. C.7 反復アクション
    8. C.8 関数
    9. C.9 オブジェクト、プロパティ、メソッド
    10. C.10 方法ではなく本質
  24. 付録D 行列代数
    1. D.1 行列に関する用語
    2. D.2 行列の加算
    3. D.3 行列の乗算
    4. D.4 SVGは変換処理で行列代数をどのように使用しているか?
  25. 付録E フォントの作成
    1. E.1 ttf2svgユーティリティー
  26. 付録F 楕円弧を別のフォーマットに変換する
    1. F.1 中心と角度によるフォーマットからSVGへの変換
    2. F.2 SVGから中心と角度によるフォーマットへの変換
  27. 著者紹介
  28. 奥付

Product information

  • Title: SVGエッセンシャルズ 第2版
  • Author(s): J. David Eisenberg, Amelia Bellamy-Royds, 原 隆文
  • Release date: May 2017
  • Publisher(s): O'Reilly Japan, Inc.
  • ISBN: 9784873117973

You might also like

book

詳説 イーサネット 第2版

by Charles E. Spurgeon, Joann Zimmerman, 三浦 史光, 豊沢 聡

イーサネット技術についての解説書。本書では、ファーストイーサネットやギガビットイーサネットなどの従来技術だけでなく、10ギガ、40ギガ、100ギガビットなど最新のイーサネット仕様を詳しく解説します。また、全二重イーサネット、オートネゴシエーション、Power over Ethernet、Energy Efficient Ethernet、構造化ケーブリングシステム、スイッチを用いたネットワークの設計、ネットワーク管理、ネットワークのトラブルシューティングのテクニックなども解説します。ネットワークの設計、監視、保守、障害時対応までを網羅し、信頼性の高いネットワークの構築を支援します。

book

データサイエンスのための統計学入門 第2版 ―予測、分類、統計モデリング、統計的機械学習とR/Pythonプログラミング

by Peter Bruce, Andrew Bruce, Peter Gedeck, 黒川 利明, 大橋 真也

データサイエンスにおいて重要な統計学と機械学習に関する52の基本概念と関連用語について、簡潔な説明とその知識の背景となる最低限の数式、グラフ、RとPythonのコードを提示し、多面的なアプローチにより、深い理解を促します。データの分類、分析、モデル化、予測という一連のデータサイエンスのプロセスにおいて統計学の必要な項目と不必要な項目を明確にし、統計学の基本と実践的なデータサイエンス技法を効率よく学ぶことができます。データサイエンス分野における昨今のPython人気を反映し、第1版ではRのみの対応だったコードが、今回の改訂でPythonにも対応。コードはすべてGitHubからダウンロード可能です。

book

ハンズオンNode.js

by 今村 謙士

Node.jsの入門書。対象読者は、フロントエンド開発の知識はあってもサーバサイド開発は知らないエンジニアや、他言語の経験はあってもNode.jsは触ったことがないプログラマー。本書ではターミナルのプロンプトにコマンドを入力してその反応を確認したり、簡単なスクリプトをNode.js環境で実行したりしながら、Node.jsプログラミングの基本からWebアプリケーションの開発、テスト、デプロイまでをハンズオン形式で学びます。また、コードの背景にある設計思想や、プログラムの挙動の仕組みについてもしっかり掘り下げます。本書のゴールは、読者がNode.jsの全体像を掴み、業務レベルでのアプリケーション開発に対応可能な知識を身につけることです。

book

戦略的データサイエンス入門 ―ビジネスに活かすコンセプトとテクニック

by Foster Provost, Tom Fawcett, 竹田 正和, 古畠 敦, 瀬戸山 雅人, 大木 嘉人, 藤野 賢祐, 宗定 洋平, 西谷 雅史, 砂子 一徳, 市川 正和, 佐藤 正士

ビッグデータ時代とも言われる昨今においては、膨大なデータをビジネスの枠組みの中に組み込んで活用することが重要課題となっています。つまり、データ収集を行ってビジネスの全体像を把握し、適切なデータ分析を行って正確な予測をした上でビジネス戦略を決めることが求められています。本書は、データをビジネスに活かすために身に付けておくべき基本的な考え方と、データマイニングやモデリングの根底に存在するコンセプトについて、体系的に解説しています。データサイエンスの重要性とその威力を学べる一冊です。