August 2017
Intermediate to advanced
500 pages
12h 3m
Japanese
Content preview from PythonとJavaScriptではじめるデータビジュアライゼーション
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
100
4 章 Web 開発の基本
グループに変換を行うと、グループ内の形状がすべて影響を受けます。図
4-17
は図
4-16
を係
数
0.75
で拡大縮小し、それを
90
度回転した結果を示しています。これは、以下のような変換属性
を適用して実現します。
<svg id="chart" width="300" height="150">
<g id="shapes",
transform = "translate(150,75),scale(0.5),rotate(90)">
...
</svg>
■
4.7.10
階層化と透明度
SVG
要素を
DOM
ツリーに追加する順番は重要です。後に追加した要素が優先され、他の要素
より上位の階層になります。例えば、図
4-16
では三角形のパスが赤い円と青い矩形を覆い隠し、
逆に黄色の円に覆い隠されています。
DOM
順序の操作は
JavaScript
でのデータ可視化の重要な部分です（例えば、
D3
の
insert
メ
ソッドは
SVG
要素を既存の要素の前に配置します）。
要素の透明度は、
rgba(R,G,B,A)
のアルファチャンネルか、さらに便利な
opacity
プロパティを
使って操作できます。どちらも
CSS
で設定できます。重ね合わされた要素では、以下の
SVG
で作
成する図
4-18
の色三角で示されているように透明度が累積されます。
図
4-16
SVG
の
<g>
タグを使った形のグループ化
図
4-17
SVG
グループの変換
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.