1
00:00:00,000 --> 00:00:00,780

2
00:00:00,780 --> 00:00:11,880
>> [Muzik bermain]

3
00:00:11,880 --> 00:00:16,480
>> DAVID CHOUINARD: Saya Daud
Chouinard, dan ini adalah D3.

4
00:00:16,480 --> 00:00:17,700
Selamat datang.

5
00:00:17,700 --> 00:00:21,270
Kita akan belajar tentang D3 hari ini.

6
00:00:21,270 --> 00:00:25,020
D3 adalah satu rangka kerja JavaScript
untuk membina kualiti yang tinggi

7
00:00:25,020 --> 00:00:28,110
visualisasi interaktif untuk web.

8
00:00:28,110 --> 00:00:30,870
Hal-hal seperti apa yang kami
lihat di belakang saya,

9
00:00:30,870 --> 00:00:34,230
kita akan belajar untuk membuat mereka
perkara, jenis asas-asas itu.

10
00:00:34,230 --> 00:00:36,452
Tetapi ia akan menjadi sejuk.

11
00:00:36,452 --> 00:00:38,160
Mari kita bermula
membuat gambar cantik.

12
00:00:38,160 --> 00:00:41,108

13
00:00:41,108 --> 00:00:44,350
Kami mempunyai lebih demo
prospek yang ada.

14
00:00:44,350 --> 00:00:48,040

15
00:00:48,040 --> 00:00:50,760
Mari kita melakukannya.

16
00:00:50,760 --> 00:00:58,700
>> Akta I, DOM manipulation-- kita akan
untuk memulakan segera membuat perkara yang sejuk.

17
00:00:58,700 --> 00:01:01,240
Pertama sekali, di sebelah kiri, kita mempunyai kod.

18
00:01:01,240 --> 00:01:03,470
Di sebelah kanan, kita mempunyai
hasil daripada kod kami.

19
00:01:03,470 --> 00:01:04,900
Mari kita melaluinya.

20
00:01:04,900 --> 00:01:05,780
>> Mari kita membuat satu bulatan.

21
00:01:05,780 --> 00:01:08,570
Bagaimana bunyi itu?

22
00:01:08,570 --> 00:01:14,934
svg.append circle--
kita hanya membuat satu bulatan.

23
00:01:14,934 --> 00:01:16,100
Anda tidak percaya kepadaku, bukan?

24
00:01:16,100 --> 00:01:18,190
Ia bukan di sana.

25
00:01:18,190 --> 00:01:21,830
>> Jadi apa yang kita lakukan di sini adalah,
SVG adalah grafik vektor boleh skala.

26
00:01:21,830 --> 00:01:27,530
Ini adalah cara kita memberitahu pelayar untuk
membuat grafik vektor dalam penyemak imbas.

27
00:01:27,530 --> 00:01:30,740
Apa yang kita hanya lakukan sekarang
ditambah bulatan untuk menyemak imbas.

28
00:01:30,740 --> 00:01:34,790
>> Janji adalah bahawa bulatan
memerlukan sedikit sifat-sifat asas

29
00:01:34,790 --> 00:01:36,850
sebelum kita benar-benar dapat melihatnya.

30
00:01:36,850 --> 00:01:40,045
Kita perlu beritahu kedudukan x mesra,
kedudukan y itu, jejarinya.

31
00:01:40,045 --> 00:01:43,310
Kami tidak beritahu apa-apa itu,
jadi kita tidak melihat ia sekarang.

32
00:01:43,310 --> 00:01:46,210
Tetapi mari kita beritahu barangan.

33
00:01:46,210 --> 00:01:49,510
>> Jadi pertama sekali, anda telah mendapat
untuk memberikan bulatan kami nama.

34
00:01:49,510 --> 00:01:53,070
Jadi mari kita memanggilnya bulatan.

35
00:01:53,070 --> 00:01:54,406
Bulatan kami mempunyai nama yang sekarang.

36
00:01:54,406 --> 00:01:57,230

37
00:01:57,230 --> 00:01:59,490
Dan mari kita memberikan sifat-sifat beberapa.

38
00:01:59,490 --> 00:02:03,690
Bagaimana pula cx akan tertumpu x, jadi
pusat kedudukan x.

39
00:02:03,690 --> 00:02:06,730
Katakan, 200 untuk 200 piksel.

40
00:02:06,730 --> 00:02:10,220
>> Mari kita memberikan y 200 piksel juga.

41
00:02:10,220 --> 00:02:16,032
Dan r, jejari, kira-kira 40 piksel.

42
00:02:16,032 --> 00:02:16,950
Sekarang mari kita lihat.

43
00:02:16,950 --> 00:02:21,740

44
00:02:21,740 --> 00:02:23,440
Saya tidak boleh mengeja.

45
00:02:23,440 --> 00:02:30,430

46
00:02:30,430 --> 00:02:31,520
>> Terdapat anda pergi.

47
00:02:31,520 --> 00:02:37,330
Kami mempunyai bulatan di kedudukan 200
piksel, 200 piksel, jejari 40 piksel.

48
00:02:37,330 --> 00:02:38,280
Jenis sejuk, kan?

49
00:02:38,280 --> 00:02:38,988
Kami mempunyai bulatan.

50
00:02:38,988 --> 00:02:40,880
Yeah.

51
00:02:40,880 --> 00:02:42,670
>> Jadi tidak perlu untuk mengikuti bersama-sama.

52
00:02:42,670 --> 00:02:45,790
Semua contoh-contoh ini, semua
kod yang saya lakukan hari ini

53
00:02:45,790 --> 00:02:51,300
akan disediakan dalam talian di hujung
dalam bentuk contoh interaktif

54
00:02:51,300 --> 00:02:54,010
dengan pusat pemeriksaan di
tiap-tiap perbuatan, dan sebagainya.

55
00:02:54,010 --> 00:02:55,160
>> Mari kita buat hal lagi.

56
00:02:55,160 --> 00:02:58,901
Ini bulatan hitam adalah benar-benar hodoh.

57
00:02:58,901 --> 00:03:01,541
Saya minta maaf untuk kesilapan yang
mesej di sana.

58
00:03:01,541 --> 00:03:05,340
Di sana kami pergi.

59
00:03:05,340 --> 00:03:06,350
>> Mari kita memberikan warna.

60
00:03:06,350 --> 00:03:07,170
Bagaimana itu?

61
00:03:07,170 --> 00:03:08,340
Saya suka keluli biru.

62
00:03:08,340 --> 00:03:13,280

63
00:03:13,280 --> 00:03:16,030
Nah, bulatan kami berubah warna.

64
00:03:16,030 --> 00:03:17,320
Itu yang besar.

65
00:03:17,320 --> 00:03:31,330
Mari kita membuat ia separa telus
too-- separa telus.

66
00:03:31,330 --> 00:03:33,670
>> Jadi ini adalah sifat-sifat
kami menentukan pada bulatan.

67
00:03:33,670 --> 00:03:36,774
Perkara pertama yang kami lakukan adalah
kita meletakkan bulatan pada halaman.

68
00:03:36,774 --> 00:03:38,690
Dan kemudian kita mentakrifkan
sekumpulan sifat-sifat.

69
00:03:38,690 --> 00:03:41,610
Sebahagian daripada yang diperlukan,
seperti CX, CY, dan Radius.

70
00:03:41,610 --> 00:03:42,680
Dan lain-lain adalah pilihan.

71
00:03:42,680 --> 00:03:44,730
>> Terdapat banyak lagi ciri-ciri.

72
00:03:44,730 --> 00:03:46,760
Terdapat banyak daripada mereka.

73
00:03:46,760 --> 00:03:53,070
Sebagai contoh, kita boleh mempunyai
strok juga, strok merah.

74
00:03:53,070 --> 00:03:55,630
Tetapi mari kita keluarkan itu.

75
00:03:55,630 --> 00:04:00,450
Kami kembali ke bulatan, bulatan biru.

76
00:04:00,450 --> 00:04:01,600
>> Jadi mari kita membuat lebih banyak bulatan.

77
00:04:01,600 --> 00:04:02,810
Bagaimana itu?

78
00:04:02,810 --> 00:04:04,665
Mari kita membuat bulatan lain.

79
00:04:04,665 --> 00:04:05,985
Ini adalah menarik, bukan?

80
00:04:05,985 --> 00:04:09,630

81
00:04:09,630 --> 00:04:12,300
>> Jadi mengatakan saya hanya Salinan-ditampalkan
apa yang kita sudah.

82
00:04:12,300 --> 00:04:13,570
Mari kita memanggilnya circle2.

83
00:04:13,570 --> 00:04:15,840
Dan mari kita buat yang tepat
Perkara yang sama dan memberikan

84
00:04:15,840 --> 00:04:20,450
atribut, diberi kedudukan x 300.

85
00:04:20,450 --> 00:04:24,140
Yay, kita mempunyai dua bulatan kini.

86
00:04:24,140 --> 00:04:27,240
>> Dan sudah tentu, kita boleh
mengemas kini nilai-nilai ini.

87
00:04:27,240 --> 00:04:31,640
Saya boleh meletakkannya pada 400, dan kini ia bergerak.

88
00:04:31,640 --> 00:04:35,470
Dan sejak itu menjengkelkan, mari kita
mengeluarkannya, jadi circle2.remove.

89
00:04:35,470 --> 00:04:39,000

90
00:04:39,000 --> 00:04:40,730
Ia pergi sekarang.

91
00:04:40,730 --> 00:04:43,170
>> Jadi apa yang kita lakukan dan
hanya sangat, very-- ini

92
00:04:43,170 --> 00:04:46,030
adalah hampir sama dengan apa yang anda
mungkin lakukan dalam jQuery, sebagai contoh.

93
00:04:46,030 --> 00:04:48,240
Kami hanya memanipulasi
DOM itu, ia dipanggil.

94
00:04:48,240 --> 00:04:50,040
Anda mungkin pernah mendengar perkataan yang sebelum.

95
00:04:50,040 --> 00:04:53,255
Kami mewujudkan barangan, menetapkan
atribut pada barangan, mengeluarkan barangan.

96
00:04:53,255 --> 00:04:58,950

97
00:04:58,950 --> 00:05:02,360
>> Sekarang, di sini di mana ia menjadi menarik.

98
00:05:02,360 --> 00:05:07,250
Jadi kemudian dalam kod, kita masih boleh
merujuk kepada bulatan asal di sini.

99
00:05:07,250 --> 00:05:14,100
Jadi mari kita menetapkan semula atribut untuk cx.

100
00:05:14,100 --> 00:05:18,260
Katakan, kedudukan x untuk 400.

101
00:05:18,260 --> 00:05:22,406
Dan saya akan beralih
itu, jadi ia jelas.

102
00:05:22,406 --> 00:05:23,360
Di sana kami pergi.

103
00:05:23,360 --> 00:05:24,780
>> Oleh itu, kita tambah satu bulatan.

104
00:05:24,780 --> 00:05:26,440
Kami menetapkan beberapa sifat-sifat.

105
00:05:26,440 --> 00:05:28,210
Kami telah menambah satu lagi bulatan, ia dikeluarkan.

106
00:05:28,210 --> 00:05:31,650
Dan kemudian kami mengubah suai
bulatan asal.

107
00:05:31,650 --> 00:05:35,400
>> Tetapi di sini di mana ia menjadi
banyak yang lebih menarik.

108
00:05:35,400 --> 00:05:39,070
Bukan sahaja kita boleh menetapkan sifat-sifat
sebagai hanya menghargai, kita boleh mengatakan,

109
00:05:39,070 --> 00:05:41,610
hey, bulatan, pergi ke kedudukan 200.

110
00:05:41,610 --> 00:05:44,540
Kami juga boleh menetapkan mereka sebagai fungsi.

111
00:05:44,540 --> 00:05:48,850
>> Jadi, daripada memberikan 400 di sini,
kita boleh membuat pengiraan beberapa

112
00:05:48,850 --> 00:05:53,950
pada lalat untuk apa yang kita
mahu atribut yang menjadi.

113
00:05:53,950 --> 00:05:56,580
Jadi ini adalah bagaimana anda akan menyatakan bahawa.

114
00:05:56,580 --> 00:06:00,660
Kami berkata, daripada 400, biarlah saya
memberikan anda fungsi yang sebaliknya.

115
00:06:00,660 --> 00:06:04,180
Dan di sini, di dalam fungsi ini,
kita boleh membuat apa-apa perkiraan gila.

116
00:06:04,180 --> 00:06:06,820
>> Kita boleh mengambil masa dan
melihat beberapa perkara lain

117
00:06:06,820 --> 00:06:11,230
dan dinamik untuk membuat keputusan
bulatan apa nilai yang kita mahu.

118
00:06:11,230 --> 00:06:15,266
Bagaimana kalau kita hanya memberikan
ia kedudukan x rawak?

119
00:06:15,266 --> 00:06:20,360

120
00:06:20,360 --> 00:06:21,120
Jadi itulah yang.

121
00:06:21,120 --> 00:06:25,490
>> Jadi apa yang mengatakan, kerana
setiap x, menjalankan fungsi ini.

122
00:06:25,490 --> 00:06:29,340
Dan apa yang kita lakukan adalah mengira
beberapa perkara, kali rawak lebar

123
00:06:29,340 --> 00:06:30,410
dan kembali itu.

124
00:06:30,410 --> 00:06:34,765
Jadi setiap kali kita berjalan itu, kita akan mendapat
bulatan yang pergi ke tempat yang rawak.

125
00:06:34,765 --> 00:06:36,394
Ia adalah jenis sejuk.

126
00:06:36,394 --> 00:06:38,310
Saya rasa seperti saya boleh melihat
pada ini untuk sedikit.

127
00:06:38,310 --> 00:06:44,274

128
00:06:44,274 --> 00:06:46,440
Kami bermula untuk sampai ke
sesuatu yang menarik di sini.

129
00:06:46,440 --> 00:06:49,120

130
00:06:49,120 --> 00:06:51,390
Mari kita membuat data ini didorong kini.

131
00:06:51,390 --> 00:06:53,420
Tidak ada data di sini.

132
00:06:53,420 --> 00:06:54,482
Mari kita mengubahnya.

133
00:06:54,482 --> 00:06:57,440

134
00:06:57,440 --> 00:07:12,140
>> Documents-- Akta II, Data Didorong
Jadi mari kita kembali ke sini.

135
00:07:12,140 --> 00:07:15,340
Dan mari kita hanya menghilangkan circle2,
kerana kami hanya menambah dan mengalih keluar

136
00:07:15,340 --> 00:07:15,840
ia.

137
00:07:15,840 --> 00:07:17,382
Oleh itu, kita tidak benar-benar memerlukannya.

138
00:07:17,382 --> 00:07:21,421
Kita perlu lebih banyak pandai di sini.

139
00:07:21,421 --> 00:07:23,170
Katakan, kita mempunyai
beberapa data dari beberapa macam.

140
00:07:23,170 --> 00:07:31,540

141
00:07:31,540 --> 00:07:40,020
Satu moment-- katakan,
kami mempunyai data borang ini.

142
00:07:40,020 --> 00:07:41,800
Kami mempunyai array, hanya
sekumpulan nombor.

143
00:07:41,800 --> 00:07:45,750
Kami mempunyai tujuh nombor tersebut di sini,
sebarang jumlah ini represent--

144
00:07:45,750 --> 00:07:48,810
dalam akaun bank rakyat, bagaimana
banyak yang berat, tuhan tahu apa yang.

145
00:07:48,810 --> 00:07:51,310
>> Ini adalah nombor, dan kami
mahu menggunakan bulatan kami

146
00:07:51,310 --> 00:07:53,240
untuk mewakili nombor-nombor entah bagaimana.

147
00:07:53,240 --> 00:07:55,515
Kita mahu untuk mengikat kami
kalangan untuk nombor-nombor tersebut.

148
00:07:55,515 --> 00:07:58,750

149
00:07:58,750 --> 00:07:59,626
Jadi apa yang kita lakukan.

150
00:07:59,626 --> 00:08:01,500
Katakan, kita mahu
bulatan untuk setiap nombor.

151
00:08:01,500 --> 00:08:03,590
Kami boleh buat yang lama
perkara yang kami telah doing--

152
00:08:03,590 --> 00:08:06,020
append bulatan dan circle2 dan circle3.

153
00:08:06,020 --> 00:08:10,020
Tetapi ini keluar dari tangan, dan
ada banyak mengulangi logik.

154
00:08:10,020 --> 00:08:12,760
>> Jadi mari kita mendapatkan lebih pandai dengan itu.

155
00:08:12,760 --> 00:08:17,810
Daripada menggunakan bulatan var yang
svg.append bahawa kami hanya menggunakan,

156
00:08:17,810 --> 00:08:21,580
kita akan menggunakan
blok kecil ini di sini.

157
00:08:21,580 --> 00:08:24,510
Saya tidak mahu pergi secara mendalam
apa ke semua bahagian-bahagian ini tidak.

158
00:08:24,510 --> 00:08:26,020
Dan ia jenis topik maju.

159
00:08:26,020 --> 00:08:27,830
Dan saya berharap saya boleh.

160
00:08:27,830 --> 00:08:31,370
>> Tetapi perkara utama untuk recognize-- dan
anda akan melihat sangat sering dalam kod D3.

161
00:08:31,370 --> 00:08:36,840
Ini blok asas teks
menciptakan apa yang banyak bulatan

162
00:08:36,840 --> 00:08:41,360
kerana ada unsur-unsur data
dalam pelbagai ini di sini.

163
00:08:41,360 --> 00:08:53,420

164
00:08:53,420 --> 00:08:55,780
Jadi ini mewujudkan banyak
bulatan kerana terdapat unsur-unsur.

165
00:08:55,780 --> 00:08:58,520
Ia akan membuat kita tujuh bulatan.

166
00:08:58,520 --> 00:09:01,710
Dan ia satu perkara yang benar-benar, benar-benar penting.

167
00:09:01,710 --> 00:09:02,460
Jadi mari kita berjalan itu.

168
00:09:02,460 --> 00:09:05,460
Mari kita keluarkan bulatan kami yang lain.

169
00:09:05,460 --> 00:09:09,565
Mari kita komen ini
sebahagian keluar dan menjalankan ini lagi.

170
00:09:09,565 --> 00:09:13,840

171
00:09:13,840 --> 00:09:15,260
>> Di sana kami pergi.

172
00:09:15,260 --> 00:09:18,030
Jadi bulatan kami di sini adalah
banyak lebih gelap, kerana kita

173
00:09:18,030 --> 00:09:20,720
mempunyai tujuh bulatan, satu
di atas yang lain.

174
00:09:20,720 --> 00:09:25,425
Kami hanya menciptakan tujuh bulatan, satu
setiap satu bagi setiap elemen-elemen data.

175
00:09:25,425 --> 00:09:28,860
Tetapi ada satu perkara yang utama yang berlaku
dengan coretan ini di sini.

176
00:09:28,860 --> 00:09:31,030
>> Ia adalah bahawa data telah terikat.

177
00:09:31,030 --> 00:09:33,440
Oleh itu, setiap seorang daripada
elemen-elemen data,

178
00:09:33,440 --> 00:09:38,830
10, 45, 105, adalah terikat
kepada suatu golongan tertentu.

179
00:09:38,830 --> 00:09:40,960
Jadi ini bukan sahaja dicipta
sekumpulan bulatan

180
00:09:40,960 --> 00:09:43,420
tetapi mengikat kedua-dua perkara bersama-sama.

181
00:09:43,420 --> 00:09:48,740
>> Dan pada masa akan datang, kerana kita dicipta
orang-orang bulatan dengan fungsi D3 ini,

182
00:09:48,740 --> 00:09:52,430
jika saya memberikan anda bulatan, anda boleh
memberi saya data yang berkaitan dengannya.

183
00:09:52,430 --> 00:09:53,280
Oleh itu, kita boleh meminta D3.

184
00:09:53,280 --> 00:09:54,840
Hey, D3, saya mempunyai bulatan ini.

185
00:09:54,840 --> 00:09:57,350
Apakah data yang mempunyai bulatan?

186
00:09:57,350 --> 00:10:01,290
Dan D3 akan memberitahu kita 10 atau 45 atau 105.

187
00:10:01,290 --> 00:10:02,380
>> Perkara-perkara ini adalah terikat.

188
00:10:02,380 --> 00:10:04,490
Itulah satu konsep yang sangat, sangat asas.

189
00:10:04,490 --> 00:10:06,070
Mari kita lihat itu.

190
00:10:06,070 --> 00:10:12,210
>> Jadi cara kita akan bertanya D3-- jadi
ini adalah tidak relevan untuk ini,

191
00:10:12,210 --> 00:10:16,620
tetapi hanya mempercayai saya di atasnya.

192
00:10:16,620 --> 00:10:17,620
Ini adalah bagaimana kami meminta D3.

193
00:10:17,620 --> 00:10:21,312
Hey, D3, berilah pertama
bulatan yang boleh anda dapati.

194
00:10:21,312 --> 00:10:23,580
Berikan saya bulatan pertama yang anda boleh mencari.

195
00:10:23,580 --> 00:10:29,660
Dan kemudian kita boleh meminta D3, apa yang
data pada itu, seperti ini, 10.

196
00:10:29,660 --> 00:10:33,380
>> Oleh itu, kita hanya meminta D3, saya mendapati
bulatan pertama yang anda boleh mencari.

197
00:10:33,380 --> 00:10:34,400
Apa yang datanya?

198
00:10:34,400 --> 00:10:36,650
10, yang memang kami
elemen data pertama.

199
00:10:36,650 --> 00:10:42,150
Kita juga boleh tanya ia, hey, D3,
mencari kami Bulatan ketiga kami.

200
00:10:42,150 --> 00:10:44,450
105.

201
00:10:44,450 --> 00:10:45,740
Mengapa ini benar-benar penting?

202
00:10:45,740 --> 00:10:49,790

203
00:10:49,790 --> 00:10:52,250
>> Jadi di sini, saya nyatakan
bahawa kita boleh menggunakan fungsi-fungsi.

204
00:10:52,250 --> 00:10:54,910
Dan saya nyatakan bahawa adalah
satu perkara yang sangat kuat.

205
00:10:54,910 --> 00:11:03,070
Jadi bukan sahaja boleh berfungsi kita melakukan perkara-perkara
seperti melakukan pengiraan, sebagai contoh,

206
00:11:03,070 --> 00:11:09,170
mengembalikan nombor rawak, ia boleh
juga melakukan perkara-perkara berdasarkan data.

207
00:11:09,170 --> 00:11:11,550
Ini adalah apa yang dipacu data dokumen bermakna.

208
00:11:11,550 --> 00:11:13,750
Itulah yang D3 bermaksud.

209
00:11:13,750 --> 00:11:17,800
>> Jadi ini bukan x postition--
hanya berkata, semua kalangan,

210
00:11:17,800 --> 00:11:21,735
mendapatkan kedudukan 200 x, kita
boleh memberikan fungsi.

211
00:11:21,735 --> 00:11:26,140

212
00:11:26,140 --> 00:11:30,140
Dan di sini, kita boleh membuat pengiraan beberapa.

213
00:11:30,140 --> 00:11:33,710
dan d sini berada di tempat untuk data.

214
00:11:33,710 --> 00:11:36,120
Jadi setiap kali kita mempunyai
bulatan, pada dasarnya,

215
00:11:36,120 --> 00:11:37,750
D3 akan mewujudkan tujuh bulatan.

216
00:11:37,750 --> 00:11:38,500
Dan kemudian untuk setiap

217
00:11:38,500 --> 00:11:41,920
>> bulatan, ia akan pergi, hey,
circle1 apa yang x kedudukan anda.

218
00:11:41,920 --> 00:11:45,210
Sebelum ini, kami
sentiasa menjawab 200.

219
00:11:45,210 --> 00:11:48,630
Tetapi sekarang, setiap kali D3 meminta
kami apa yang x kedudukan anda,

220
00:11:48,630 --> 00:11:51,790
ia akan memberikan kita mempunyai us--
kelompok ini, jadi kami mempunyai data.

221
00:11:51,790 --> 00:11:55,290
Ia akan memberi kita data dan berkata,
apa yang anda mahu penjelasan yang menjadi,

222
00:11:55,290 --> 00:11:57,120
berdasarkan data yang.

223
00:11:57,120 --> 00:11:59,590
>> Mari kita kembali data sebenar.

224
00:11:59,590 --> 00:12:04,910
Jadi, jika kita menjalankan ini, ini memberi
kami data didorong dokumen.

225
00:12:04,910 --> 00:12:08,040
Ini bulatan adalah berdasarkan
berhubung position--

226
00:12:08,040 --> 00:12:11,120
mereka asas sebagai fungsi data.

227
00:12:11,120 --> 00:12:13,100
>> Jadi untuk bulatan yang pertama,
D3 meletakkan bulatan.

228
00:12:13,100 --> 00:12:16,770
Dan kemudian D3 meminta kita, apa yang dilakukan
anda mahu penjelasan untuk menjadi.

229
00:12:16,770 --> 00:12:19,620
Dan kita hanya berkata, apa sahaja data itu.

230
00:12:19,620 --> 00:12:21,185
Membuat penjelasan 10.

231
00:12:21,185 --> 00:12:26,320
>> Kemudian ia bertanya, apa yang anda mahu
penjelasan bagi sesuatu bulatan kedua.

232
00:12:26,320 --> 00:12:27,270
Dan kita menjawab, 45.

233
00:12:27,270 --> 00:12:30,000

234
00:12:30,000 --> 00:12:32,230
Dan kita, sudah tentu, boleh
membuat beberapa pengiraan di sini.

235
00:12:32,230 --> 00:12:35,510
Saya mendapati bahawa orang-orang bulatan
adalah sejenis squished up.

236
00:12:35,510 --> 00:12:38,965
>> Jadi kalikan dengan 3, darab data oleh 3.

237
00:12:38,965 --> 00:12:41,870

238
00:12:41,870 --> 00:12:43,840
Bulatan kami baru sahaja berkembang keluar.

239
00:12:43,840 --> 00:12:46,730
Nilai kita telah meningkat tiga kali ganda.

240
00:12:46,730 --> 00:12:51,010
>> Bulatan adalah benar-benar di pinggir,
jadi mari kita mungkin jenis mengimbangi ia.

241
00:12:51,010 --> 00:12:53,632
Katakan, sebanyak 20.

242
00:12:53,632 --> 00:12:56,070
Di sini anda pergi.

243
00:12:56,070 --> 00:12:57,590
>> Ini adalah visualisasi data.

244
00:12:57,590 --> 00:13:01,767
Ia adalah salah satu yang sangat asas, tetapi ini
memberikan kita sedikit pemahaman tentang data kami.

245
00:13:01,767 --> 00:13:04,600
Ia memberitahu kita bahawa, sebagai contoh, kita
mempunyai kelompok sedikit unsur-unsur.

246
00:13:04,600 --> 00:13:06,340
Dan kita mempunyai titik terpencil besar di sini.

247
00:13:06,340 --> 00:13:10,830
Ini memberikan kami beberapa maklumat
mengenai pengagihan.

248
00:13:10,830 --> 00:13:20,830
>> Jika kita, sebagai contoh, untuk menukar
data ke 150 di sini dan segar semula,

249
00:13:20,830 --> 00:13:22,630
visualisasi kita berubah.

250
00:13:22,630 --> 00:13:24,285
Dokumen ini adalah data didorong.

251
00:13:24,285 --> 00:13:32,640

252
00:13:32,640 --> 00:13:36,180
>> Jadi, sudah tentu, semua elemen-elemen ini,
semua sifat-sifat ini di sini,

253
00:13:36,180 --> 00:13:38,430
kita boleh menggunakan fungsi, tidak
hanya nombor, bukan hanya

254
00:13:38,430 --> 00:13:39,900
x dan y jawatan.

255
00:13:39,900 --> 00:13:42,120
Oleh itu, kita boleh menggunakan fungsi untuk warna.

256
00:13:42,120 --> 00:13:45,260

257
00:13:45,260 --> 00:13:46,360
Oleh itu, kita akan melakukan perkara yang sama.

258
00:13:46,360 --> 00:13:49,360
Kami akan memberikan fungsi.

259
00:13:49,360 --> 00:13:52,320
>> Dan mari kita mengatakan, kita boleh mempunyai
syarat dalam fungsi kami.

260
00:13:52,320 --> 00:13:54,770
Fungsi ini boleh menjadi
ratus daripada barisan panjang.

261
00:13:54,770 --> 00:13:57,150
Ia boleh melakukan perkara-perkara yang sangat, sangat rumit.

262
00:13:57,150 --> 00:13:59,080
>> Jadi mari kita meletakkan jika kenyataan di sini.

263
00:13:59,080 --> 00:14:03,420
Katakan, jika data kami adalah kurang
daripada 50, itu beberapa ambang

264
00:14:03,420 --> 00:14:05,817
bahawa kita berminat
di atas sebab tertentu.

265
00:14:05,817 --> 00:14:06,650
Mari kita membuat ia hijau.

266
00:14:06,650 --> 00:14:09,830

267
00:14:09,830 --> 00:14:15,320
Jika tidak, mari kita menjadikannya merah.

268
00:14:15,320 --> 00:14:16,110
Bagaimana itu?

269
00:14:16,110 --> 00:14:19,630

270
00:14:19,630 --> 00:14:21,220
Nice.

271
00:14:21,220 --> 00:14:24,860
>> Jadi visualisasi data kita bermula
untuk menyampaikan maklumat yang lebih menarik

272
00:14:24,860 --> 00:14:26,727
di banyak saluran.

273
00:14:26,727 --> 00:14:28,560
Jadi sekarang kita tahu sedikit
mengenai pengagihan.

274
00:14:28,560 --> 00:14:31,768
Dan kita tahu bahawa ada beberapa jenis
memotong di 50 yang kita minati.

275
00:14:31,768 --> 00:14:35,630
Kita tahu bahawa terdapat dua titik data
di bawah tahap itu dan sebahagian besar daripada mereka

276
00:14:35,630 --> 00:14:36,130
atas.

277
00:14:36,130 --> 00:14:41,510

278
00:14:41,510 --> 00:14:46,160
>> Oleh itu sebagai langkah terakhir, data ini di sini,
ia amat jarang untuk melihat ini seperti itu.

279
00:14:46,160 --> 00:14:52,610
Jadi mari kita bergerak keluar untuk pembolehubah
kerana itulah yang lebih bersih, seperti ini.

280
00:14:52,610 --> 00:15:02,980

281
00:15:02,980 --> 00:15:05,197
Dan kemudian kita menggunakan pembolehubah yang di sini.

282
00:15:05,197 --> 00:15:06,280
Ia adalah perkara yang sama.

283
00:15:06,280 --> 00:15:07,280
Ia hanya sedikit lebih bersih.

284
00:15:07,280 --> 00:15:25,300

285
00:15:25,300 --> 00:15:35,300
>> Selanjutnya, Akta III, Scales--
Jadi satu masalah hak

286
00:15:35,300 --> 00:15:38,920
di sini ialah, jika kita menukar kami
data dalam 200 value-- ini

287
00:15:38,920 --> 00:15:41,685
jika kita mengubahnya kepada 400
atau sesuatu dan segar semula,

288
00:15:41,685 --> 00:15:44,540
maka nilai ini hanya pergi rahasia.

289
00:15:44,540 --> 00:15:49,040
Jadi logik kami di sini
bagaimana kita melakukan perkara yang kali 3

290
00:15:49,040 --> 00:15:52,570
dan 20, untuk menyebarkan keluar dan kemudian
mengimbangi ia sedikit clunky adalah benar-benar.

291
00:15:52,570 --> 00:15:54,150
>> Apa yang nombor-nombor bermakna?

292
00:15:54,150 --> 00:15:55,400
Mereka hanya keras berkod ada.

293
00:15:55,400 --> 00:15:58,830
Dan mereka sangat terikat kepada data.

294
00:15:58,830 --> 00:16:00,550
Kami mahu dokumen data didorong.

295
00:16:00,550 --> 00:16:05,460
Kita mahu satu dokumen yang amat fleksibel,
bahawa data yang diberikan, menyesuaikan diri kepadanya

296
00:16:05,460 --> 00:16:07,900
dan ia mewakili.

297
00:16:07,900 --> 00:16:11,330
>> Apa yang kita perlukan adalah pada dasarnya, kita
mempunyai julat ini nombor 10.

298
00:16:11,330 --> 00:16:12,640
45, 105.

299
00:16:12,640 --> 00:16:17,630
Dan kami ingin peta yang keluar ke
lebar, lebar penuh di sini.

300
00:16:17,630 --> 00:16:20,620
Oleh itu, kita mempunyai julat
nombor pergi dari 0 hingga 100.

301
00:16:20,620 --> 00:16:24,980
Dan kita mempunyai kampus ini saya pergi
20-700, dalam kes ini.

302
00:16:24,980 --> 00:16:26,515
>> Kami sejenis ingin peta yang pada.

303
00:16:26,515 --> 00:16:30,002
Kami mahu mengikut skala yang dan
kemudian ia mengimbangi sedikit.

304
00:16:30,002 --> 00:16:33,165
Ia ternyata bahawa D3 mempunyai ini.

305
00:16:33,165 --> 00:16:34,220
Ia dipanggil timbang.

306
00:16:34,220 --> 00:16:37,410

307
00:16:37,410 --> 00:16:38,250
Jadi mari kita menggunakannya.

308
00:16:38,250 --> 00:16:46,300

309
00:16:46,300 --> 00:16:49,670
>> Cara yang works-- saya akan
menaip ini dan kemudian menjelaskannya.

310
00:16:49,670 --> 00:17:01,530

311
00:17:01,530 --> 00:17:02,450
Ini adalah alat timbang.

312
00:17:02,450 --> 00:17:08,670
Apa yang ia akan lakukan adalah, ia akan memetakan
nilai 1-200 pada 20 hingga 600.

313
00:17:08,670 --> 00:17:10,990
Kami boleh pastikan.

314
00:17:10,990 --> 00:17:13,329
Kita dapat melihat bahawa di sini.

315
00:17:13,329 --> 00:17:21,704
>> Jadi jika saya memberi makan 1-- satu masa.

316
00:17:21,704 --> 00:17:47,764

317
00:17:47,764 --> 00:17:48,555
Berikan saya satu saat.

318
00:17:48,555 --> 00:17:53,680

319
00:17:53,680 --> 00:17:55,080
Saya mesti telah salah taip itu.

320
00:17:55,080 --> 00:18:15,320

321
00:18:15,320 --> 00:18:15,990
Terdapat anda pergi.

322
00:18:15,990 --> 00:18:17,930
Saya minta maaf tentang itu.

323
00:18:17,930 --> 00:18:22,050
>> Jadi apa skala yang akan melakukan
adalah, ia akan mengambil nilai yang

324
00:18:22,050 --> 00:18:24,930
dan kemudian menukar bahawa,
mengembangkan yang keluar, sehingga ia

325
00:18:24,930 --> 00:18:27,320
mengisi rangkaian penuh yang anda meminta.

326
00:18:27,320 --> 00:18:32,910
Jadi dalam kes ini, jika kita memberikan satu,
ia akan peta yang keluar ke 20.

327
00:18:32,910 --> 00:18:37,750
Dan jika kita memberikan 200, ia
akan peta yang ke 600.

328
00:18:37,750 --> 00:18:40,460
Dan di suatu tempat di antara,
jika kita mendapat 100, ia

329
00:18:40,460 --> 00:18:44,610
akan menjadi suatu tempat
di antara 20 dan 600.

330
00:18:44,610 --> 00:18:51,480
>> Dan sudah tentu, sekarang ini adalah apa yang
kita perlu membuang mereka Berkod keras

331
00:18:51,480 --> 00:18:53,402
perkara yang kita mempunyai di sana.

332
00:18:53,402 --> 00:18:55,950
Jadi apa yang kita mahu lakukan adalah
mengambil data yang kami

333
00:18:55,950 --> 00:19:00,950
diberikan, bahawa data individu
elemen, dan lulus mengikut skala pertama.

334
00:19:00,950 --> 00:19:02,635
Jadi skala skala akan ia sehingga.

335
00:19:02,635 --> 00:19:27,020

336
00:19:27,020 --> 00:19:48,880
>> Well-- Oh, kita mempunyai sedikit kesilapan di sini.

337
00:19:48,880 --> 00:19:50,120
Kami data yang hilang.

338
00:19:50,120 --> 00:19:51,290
Terdapat anda pergi.

339
00:19:51,290 --> 00:19:58,550

340
00:19:58,550 --> 00:19:59,550
Dan yang mengembang keluar.

341
00:19:59,550 --> 00:20:01,383
>> Yang memberikan kita yang sama
Akibatnya kita mempunyai di hadapan,

342
00:20:01,383 --> 00:20:04,030
tetapi daripada harus mereka
keras berkod kekangan.

343
00:20:04,030 --> 00:20:07,790
Dan jika saiz kami
perubahan kanvas, sebagai contoh,

344
00:20:07,790 --> 00:20:11,790
jika kita ingin mempunyai lebih daripada ini
400 piksel dan ia squishes keluar,

345
00:20:11,790 --> 00:20:15,440
kita boleh memilikinya over--
kita boleh mengembangkannya, atau kita

346
00:20:15,440 --> 00:20:21,890
boleh mengurangkan margin ini dibiarkan
sesuatu yang kurang atau lebih daripada 20.

347
00:20:21,890 --> 00:20:25,470
Nombor-nombor ini, ini keras berkod
nombor kini masuk akal untuk kita.

348
00:20:25,470 --> 00:20:28,110

349
00:20:28,110 --> 00:20:30,520
>> Dan kami boleh lakukan lebih banyak
perkara yang menarik juga.

350
00:20:30,520 --> 00:20:35,990
Jadi, daripada mempunyai linear yang
skala, kita mungkin mahu log timbang.

351
00:20:35,990 --> 00:20:37,840
Dan yang akan memberi kita skala log.

352
00:20:37,840 --> 00:20:41,269
>> Jadi sekarang skala kita, bukan
hanya berkembang daripada pelbagai itu,

353
00:20:41,269 --> 00:20:42,810
ia melakukan perkara-perkara yang lebih canggih.

354
00:20:42,810 --> 00:20:48,790

355
00:20:48,790 --> 00:20:53,790
Daripada perlu julat ini keras
dikodkan, dan daripada harus yang 600,

356
00:20:53,790 --> 00:20:58,465
kita mungkin mahu hanya menggunakan lebar,
demikian daripada 20 kepada lebar tolak 40,

357
00:20:58,465 --> 00:21:02,392
2 kali margin di sisi lain.

358
00:21:02,392 --> 00:21:05,350
Dan ini masuk akal lebih banyak untuk
seseorang yang mungkin melihat kod.

359
00:21:05,350 --> 00:21:08,080

360
00:21:08,080 --> 00:21:11,850
>> Menariknya, penimbang mendapatkan
sangat, sangat canggih juga.

361
00:21:11,850 --> 00:21:13,350
Mereka melakukan banyak perkara yang menarik.

362
00:21:13,350 --> 00:21:17,620
Jadi penimbang tidak semestinya mempunyai
beroperasi hanya dengan nombor.

363
00:21:17,620 --> 00:21:18,955
Mari kita membuat skala warna.

364
00:21:18,955 --> 00:21:23,120

365
00:21:23,120 --> 00:21:26,120
>> Jadi pelbagai kami boleh adalah--
domain kami adalah antara 1 hingga 200.

366
00:21:26,120 --> 00:21:28,220
Itu perkara input.

367
00:21:28,220 --> 00:21:33,793
Tetapi kita mungkin mahu peta dari
hijau ke merah, sebagai contoh.

368
00:21:33,793 --> 00:21:39,710

369
00:21:39,710 --> 00:21:42,910
Dan sekarang, jika kita lulus 1,
kita akan mendapatkan hijau.

370
00:21:42,910 --> 00:21:45,110
Jika kita memberikan 200, kita akan mendapat merah.

371
00:21:45,110 --> 00:21:49,480
Dan jika kita lulus sesuatu di antara,
ia akan menjadi beberapa campuran yang,

372
00:21:49,480 --> 00:21:52,520
di suatu tempat di kecerunan
antara hijau dan merah.

373
00:21:52,520 --> 00:21:55,210
>> Dan daripada harus
ini jenis logik clunky

374
00:21:55,210 --> 00:21:58,550
kami ada di sini dengan
bersyarat di sana,

375
00:21:58,550 --> 00:22:03,250
kita boleh mempunyai satu something--
skala linear antara mereka.

376
00:22:03,250 --> 00:22:07,100
Jadi kita akan menggunakan skala yang kita hanya
diwujudkan, yang kita dipanggil warna.

377
00:22:07,100 --> 00:22:09,060
Dan kita akan memberikan d, yang
adalah elemen data kami.

378
00:22:09,060 --> 00:22:14,250

379
00:22:14,250 --> 00:22:15,060
Dan di sana kami pergi.

380
00:22:15,060 --> 00:22:18,070
Kami mempunyai skala warna.

381
00:22:18,070 --> 00:22:18,940
>> Jadi ini adalah pemetaan.

382
00:22:18,940 --> 00:22:20,960
Jadi yang paling kiri adalah benar-benar hijau.

383
00:22:20,960 --> 00:22:22,560
Yang paling kanan merah sepenuhnya.

384
00:22:22,560 --> 00:22:24,828
Dan segala sesuatu di antara
adalah fungsi d.

385
00:22:24,828 --> 00:22:33,369

386
00:22:33,369 --> 00:22:35,160
Kami mempunyai menarik
visualisasi sini.

387
00:22:35,160 --> 00:22:36,952
Tetapi data kami adalah jenis membosankan.

388
00:22:36,952 --> 00:22:39,410
Mari kita lihat apa yang boleh kita lakukan jika
kami mempunyai data yang lebih menarik.

389
00:22:39,410 --> 00:22:44,420

390
00:22:44,420 --> 00:22:50,500
>> Akta IV, Kerja Dengan
Data-- perkara pertama

391
00:22:50,500 --> 00:22:53,560
kami akan mahu lakukan untuk membuat kami
visualisasi lebih menarik

392
00:22:53,560 --> 00:22:56,140
adalah untuk memindahkan data di tempat lain.

393
00:22:56,140 --> 00:22:58,310
Ia amat clunky mempunyai
data keras berkod di sini.

394
00:22:58,310 --> 00:23:01,220
Dan secara amnya, kita akan meminta
orang lain bagi data itu.

395
00:23:01,220 --> 00:23:05,400
Kami mungkin akan meminta kerajaan,
Biro Banci, apa data anda

396
00:23:05,400 --> 00:23:10,170
dan kemudian merancang itu atau meminta
beberapa entiti pihak ketiga untuk beberapa data

397
00:23:10,170 --> 00:23:13,330
dan kemudian membina
visualisasi pada itu.

398
00:23:13,330 --> 00:23:17,170
>> Jadi perkara pertama yang kami mahu lakukan
adalah yang bergerak ke tempat lain.

399
00:23:17,170 --> 00:23:24,130
Jadi saya akan membuat
memfailkan di sini dipanggil data.json.

400
00:23:24,130 --> 00:23:25,600
JSON adalah format data.

401
00:23:25,600 --> 00:23:29,210
Anda tidak perlu tahu banyak tentang itu.

402
00:23:29,210 --> 00:23:33,210
Dan kita akan menyalin
sedikit data kita telah ada,

403
00:23:33,210 --> 00:23:40,330
tampalkannya di sana kata demi kata, pergi
kembali ke kod visualisasi kami

404
00:23:40,330 --> 00:23:45,362
di sini, dan menggunakan fungsi ini di sini.

405
00:23:45,362 --> 00:23:46,820
Anda tidak perlu mengetahui butiran.

406
00:23:46,820 --> 00:23:49,800
Tetapi apa yang akan dilakukan adalah,
ia akan mencari fail yang,

407
00:23:49,800 --> 00:23:51,780
mengambil ia, dan kembalikan kepada kami.

408
00:23:51,780 --> 00:24:11,660

409
00:24:11,660 --> 00:24:15,220
Jadi apa ini tidak adalah, ia pergi
dan mendapatkan fail data.json itu.

410
00:24:15,220 --> 00:24:18,570
Dan kemudian semua kod itu
dilekukan inside-- dasarnya,

411
00:24:18,570 --> 00:24:21,800
semua kod yang kita ada akan there--
berjalan hanya apabila kita mendapatkan data kembali.

412
00:24:21,800 --> 00:24:25,760
Dan kemudian ia akan berlari,
kod dengan data yang kita ada.

413
00:24:25,760 --> 00:24:28,870
Great, kita mempunyai
visualisasi bahawa pertanyaan

414
00:24:28,870 --> 00:24:31,390
untuk beberapa kod di suatu tempat
lain, yang biasanya

415
00:24:31,390 --> 00:24:36,110
di mana ia pertanyaan beberapa data dari
di tempat lain, yang biasanya

416
00:24:36,110 --> 00:24:38,656
bagaimana visualisasi bekerja.

417
00:24:38,656 --> 00:24:41,400
>> Tetapi saya ingin kembali kepada data.

418
00:24:41,400 --> 00:24:48,030
Jadi data asas dalam D3-- D3
menggunakan data itu adalah satu senarai barang-barang.

419
00:24:48,030 --> 00:24:53,000
D3 menjangkakan data hanya menjadi senarai
perkara, pelbagai perkara.

420
00:24:53,000 --> 00:24:58,780
Tidak kira apa yang perkara-perkara
adalah, selagi itu pelbagai mereka.

421
00:24:58,780 --> 00:25:02,460
>> Jadi di sini, sebagai contoh, kita dapat daripada
kursus telah terapung mata yang.

422
00:25:02,460 --> 00:25:04,830
Kita boleh mempunyai negatif.

423
00:25:04,830 --> 00:25:09,400
D3 tidak peduli, asalkan
kerana ia adalah senarai perkara.

424
00:25:09,400 --> 00:25:13,270
>> Perkara yang menarik kita
boleh mempunyai, kita juga boleh

425
00:25:13,270 --> 00:25:19,410
mempunyai senarai tali seperti itu.

426
00:25:19,410 --> 00:25:25,440
Jadi ini adalah tajuk-tajuk utama Crimson
Saya mengambil beberapa hari yang lalu.

427
00:25:25,440 --> 00:25:29,220
Dan mungkin anda boleh mencari beberapa menarik
perkara mengenai tajuk-tajuk utama yang.

428
00:25:29,220 --> 00:25:30,970
>> Jadi sekali lagi, ini adalah senarai perkara.

429
00:25:30,970 --> 00:25:32,360
D3 tidak peduli.

430
00:25:32,360 --> 00:25:35,572
Ini berlaku kepada rentetan.

431
00:25:35,572 --> 00:25:36,530
Kami telah mengubah data kami.

432
00:25:36,530 --> 00:25:38,210
>> Mari kita kembali kepada visualisasi kami.

433
00:25:38,210 --> 00:25:42,495
Sekarang, visualisasi kami menjangka
input untuk menjadi nombor.

434
00:25:42,495 --> 00:25:44,370
Jadi, kita akan mempunyai
untuk membuat beberapa perubahan.

435
00:25:44,370 --> 00:25:47,180

436
00:25:47,180 --> 00:25:52,180
Jadi, sebagai contoh, pertama sekali, mungkin
kita mahu meletakkan golongan-golongan ini bersama-sama

437
00:25:52,180 --> 00:25:56,870
dengan panjang tajuk utama, yang
Bilangan aksara dalam tajuk.

438
00:25:56,870 --> 00:26:03,600
>> Jadi apa yang kita akan lakukan is-- setiap kali kami
fungsi dipanggil dengan tali,

439
00:26:03,600 --> 00:26:09,095
kita akan mendapati ia panjang Dan
kemudian lulus itu untuk skala.

440
00:26:09,095 --> 00:26:11,550
Warna, saya akan kembali
bahawa untuk keluli biru.

441
00:26:11,550 --> 00:26:19,060

442
00:26:19,060 --> 00:26:20,420
Dan di sana kami pergi.

443
00:26:20,420 --> 00:26:23,190
Kami mempunyai visualisasi yang
tajuk utama daripada Crimson.

444
00:26:23,190 --> 00:26:25,500
>> Skala kami adalah di luar sedikit.

445
00:26:25,500 --> 00:26:29,680
Mari kita andaikan bahawa yang paling lama
tajuk adalah 100 aksara,

446
00:26:29,680 --> 00:26:32,244
jadi span yang keluar sedikit.

447
00:26:32,244 --> 00:26:33,410
Dan kita mempunyai visualisasi yang.

448
00:26:33,410 --> 00:26:36,710
Oleh itu, ia seolah-olah bahawa kebanyakan berita utama
cukup dekat bersama-sama,

449
00:26:36,710 --> 00:26:38,750
dari segi garis watak.

450
00:26:38,750 --> 00:26:41,200
Tetapi salah ada benar-benar menonjol.

451
00:26:41,200 --> 00:26:46,660
>> Kita boleh membina beberapa alat
untuk meneroka lebih banyak.

452
00:26:46,660 --> 00:26:50,710
Tetapi apabila saya bekerja mengenai perkara ini, saya
ingin tahu sama ada, dalam set data ini,

453
00:26:50,710 --> 00:26:53,880
tajuk utama dengan noktah bertindih
dalam mereka akan lebih panjang.

454
00:26:53,880 --> 00:26:55,770
Saya menganggap mereka akan.

455
00:26:55,770 --> 00:26:56,660
>> Jadi mari kita mengetahui.

456
00:26:56,660 --> 00:27:00,650
Mari kita gunakan warna
saluran seperti yang kami lakukan sebelum,

457
00:27:00,650 --> 00:27:04,540
untuk mengekod beberapa kira-kira sama ada
ada kolon atau tidak.

458
00:27:04,540 --> 00:27:07,220
Oleh itu, kita akan menggunakan bersyarat lagi.

459
00:27:07,220 --> 00:27:09,350
Anda tidak perlu tahu
butiran ini,

460
00:27:09,350 --> 00:27:14,260
tetapi ini adalah bagaimana kita menyemak
tali untuk watak tertentu

461
00:27:14,260 --> 00:27:16,355
dalam JavaScript, sekali lagi, tidak relevan.

462
00:27:16,355 --> 00:27:18,910

463
00:27:18,910 --> 00:27:23,270
>> Tetapi jika kita tidak mencari
kolon, kami akan kembali hijau.

464
00:27:23,270 --> 00:27:26,100
Dan jika kita lakukan, kita akan kembali merah.

465
00:27:26,100 --> 00:27:29,010
Jadi sekali lagi, tajuk yang
telah kolon yang akan menjadi merah.

466
00:27:29,010 --> 00:27:34,980
Inilah yang ertinya- ini bagus.

467
00:27:34,980 --> 00:27:38,040
>> Oleh itu, ia seolah-olah bahawa saya
hipotesis yang terserempak.

468
00:27:38,040 --> 00:27:39,360
Hanya ada dua.

469
00:27:39,360 --> 00:27:42,380
Kami hanya mempunyai enam mata data
dan hanya dua mempunyai titik bertindih.

470
00:27:42,380 --> 00:27:45,510
Tetapi ia kelihatan sedikit lebih
pada akhir yang lebih rendah, sebenarnya.

471
00:27:45,510 --> 00:27:47,830
Tajuk-tajuk utama dengan titik bertindih kelihatan
untuk secara amnya lebih pendek,

472
00:27:47,830 --> 00:27:52,370
sekurang-kurangnya dalam data kami set-- menarik.

473
00:27:52,370 --> 00:27:55,830
>> Mari kita kembali kepada yang
keluli biru dan kemudian melihat

474
00:27:55,830 --> 00:28:00,601
apa yang kita boleh membuat walaupun dengan
data yang lebih menarik.

475
00:28:00,601 --> 00:28:04,370

476
00:28:04,370 --> 00:28:09,070
Jadi sekali lagi, saya telah mengumumkan bahawa
data dalam D3 adalah senarai perkara.

477
00:28:09,070 --> 00:28:11,080
Kami telah melihat nombor dari banyak jenis.

478
00:28:11,080 --> 00:28:12,810
Kami telah melihat tali.

479
00:28:12,810 --> 00:28:15,700
Tetapi perkara yang juga boleh menjadi objek.

480
00:28:15,700 --> 00:28:20,080
>> Mereka boleh menjadi perkara yang rumit
yang merangkumi banyak perkara.

481
00:28:20,080 --> 00:28:24,510
Untuk mengatakan yang lebih jelas,
dalam kebanyakan kes, kita

482
00:28:24,510 --> 00:28:28,384
mahu membina setiap titik data sebagai
lebih rumit daripada hanya satu nilai.

483
00:28:28,384 --> 00:28:30,175
Jika anda akan membayangkan
pangkalan data mengenai pelajar,

484
00:28:30,175 --> 00:28:32,470
mungkin ada seorang pelajar
nama, ID pelajar,

485
00:28:32,470 --> 00:28:36,370
dan banyak perkara-perkara yang berkaitan
dengan rekod tertentu,

486
00:28:36,370 --> 00:28:39,834
bukan hanya rentetan atau nombor.

487
00:28:39,834 --> 00:28:40,750
Jadi mari kita lihat itu.

488
00:28:40,750 --> 00:28:55,180

489
00:28:55,180 --> 00:28:56,760
>> Ini adalah salah satu data seperti yang ditetapkan.

490
00:28:56,760 --> 00:28:59,090
Ini adalah satu set data mengenai gempa bumi.

491
00:28:59,090 --> 00:29:01,910

492
00:29:01,910 --> 00:29:08,430
Jadi segala-galanya di sini dalam senarai atau array kami
perkara yang mengandungi banyak perkara sendiri.

493
00:29:08,430 --> 00:29:11,380
Jadi setiap titik data mempunyai
magnitud dan menyelaraskan satu.

494
00:29:11,380 --> 00:29:13,425
Dan menyelaraskan diri
mengandungi dua perkara.

495
00:29:13,425 --> 00:29:15,960

496
00:29:15,960 --> 00:29:20,450
>> Jadi setiap hari kini lebih banyak
rumit dan banyak yang lebih menarik

497
00:29:20,450 --> 00:29:22,700
dan mengandungi lebih
maklumat yang menarik.

498
00:29:22,700 --> 00:29:26,730
Mari kita lihat kita boleh membina daripada itu.

499
00:29:26,730 --> 00:29:36,130
Kembali semula ke sini, sekali lagi, dengan menggunakan
visualisasi bulatan histogram kami

500
00:29:36,130 --> 00:29:42,110
kami telah dibina, mari kita lihat jika kita boleh membina
visualisasi pengedaran magnitud

501
00:29:42,110 --> 00:29:43,305
dalam set data kami.

502
00:29:43,305 --> 00:29:45,850

503
00:29:45,850 --> 00:29:48,660
>> Jadi di sini, ia adalah konsep yang sama.

504
00:29:48,660 --> 00:29:51,920
Tetapi sekarang, d mengandungi lebih banyak perkara.

505
00:29:51,920 --> 00:29:54,780
d mengandungi banyak unsur data.

506
00:29:54,780 --> 00:29:57,946
Oleh itu, kita dapat d belakang.

507
00:29:57,946 --> 00:29:59,670
D3 memberikan kita d.

508
00:29:59,670 --> 00:30:06,080
Dan kita bertindak balas dengan mencari magnitud
d dan kemudian lulus itu untuk skala.

509
00:30:06,080 --> 00:30:08,490
>> Dan maka kita perlu mengubah
skala kami, sudah tentu.

510
00:30:08,490 --> 00:30:12,980
Jadi magnitud semata-mata tidak
pergi lebih daripada 10.

511
00:30:12,980 --> 00:30:15,485
Sebenarnya, di sana tidak pernah menjadi
gempa bumi magnitud 10.

512
00:30:15,485 --> 00:30:19,360
Tetapi itulah jenis atas kami
akhir, spektrum atas kami.

513
00:30:19,360 --> 00:30:20,240
>> Mari kita menyegarkan.

514
00:30:20,240 --> 00:30:22,990
Nice, kami mempunyai satu visualisasi.

515
00:30:22,990 --> 00:30:25,490
Ia adalah menarik untuk note-- jadi
terdapat dua titik data yang

516
00:30:25,490 --> 00:30:29,010
adalah hampir tepat di atas satu sama
lain, dari segi magnitud.

517
00:30:29,010 --> 00:30:31,350
Anda melihat ini dengan kelegapan yang kita gunakan.

518
00:30:31,350 --> 00:30:40,810

519
00:30:40,810 --> 00:30:42,690
>> Kami mempunyai data geografi kini.

520
00:30:42,690 --> 00:30:44,710
Kami mempunyai latitud dan longitud.

521
00:30:44,710 --> 00:30:47,549
Mungkin kita boleh melakukan sesuatu yang
banyak lebih menarik dengan itu.

522
00:30:47,549 --> 00:30:49,590
Mari kita menemui beberapa lebih
cara menarik untuk menggambarkan

523
00:30:49,590 --> 00:30:53,500
ini lebih rumit
data kita mempunyai akses kepada.

524
00:30:53,500 --> 00:31:04,950
>> Akta V, Mapping-- asasnya,
kita mahu meletakkan ini pada peta.

525
00:31:04,950 --> 00:31:07,690
Maksud saya, ini adalah di mana ini akan.

526
00:31:07,690 --> 00:31:13,130
Kami mahu mengekod maklumat mengenai
kedudukan ini bacaan gempa bumi,

527
00:31:13,130 --> 00:31:16,350
serta magnitud mereka,
kerana kita mempunyai yang sekarang.

528
00:31:16,350 --> 00:31:21,310
Kami memahami bagaimana untuk mengambil
data yang lebih rumit.

529
00:31:21,310 --> 00:31:26,200
>> Perkara pertama yang kita akan lakukan adalah
membuat peta, peta latar belakang.

530
00:31:26,200 --> 00:31:29,360
Saya akan pergi melalui
ini sangat cepat.

531
00:31:29,360 --> 00:31:30,560
Ini adalah kod rumit.

532
00:31:30,560 --> 00:31:33,110
Ia adalah satu lagi salah seorang daripada mereka
resipi anda tidak benar-benar

533
00:31:33,110 --> 00:31:35,690
perlu memahami sepenuhnya untuk anda gunakan.

534
00:31:35,690 --> 00:31:38,510

535
00:31:38,510 --> 00:31:39,740
Tetapi ini adalah kod.

536
00:31:39,740 --> 00:31:43,580
Kod ini di sini mewujudkan peta.

537
00:31:43,580 --> 00:31:45,730
>> Kami tidak akan pergi secara terperinci.

538
00:31:45,730 --> 00:31:54,210
Tetapi sekali pandang, apa yang ia lakukan adalah,
ia pertanyaan fail us.json ini, yang

539
00:31:54,210 --> 00:31:57,150
adalah fail data seperti
apa yang kita ada sebelum.

540
00:31:57,150 --> 00:31:59,150
Ia lebih kompleks, sudah tentu.

541
00:31:59,150 --> 00:32:02,920
Tetapi dalam kes ini, segala-galanya,
setiap titik data adalah negeri ini

542
00:32:02,920 --> 00:32:05,420
dan mempunyai senarai
latitud dan longitud

543
00:32:05,420 --> 00:32:10,500
yang menentukan poligon,
bentuk yang, menyatakan bahawa.

544
00:32:10,500 --> 00:32:13,280
>> Jadi apa D3 akan lakukan adalah sama
dengan apa yang kita lakukan sebelum ini.

545
00:32:13,280 --> 00:32:18,140
Ia akan meminta itu dan
mengikat yang kepada unsur.

546
00:32:18,140 --> 00:32:20,890
Dan ada satu majlis yang
akan peta elemen yang keluar,

547
00:32:20,890 --> 00:32:23,410
berdasarkan latitud dan longitud.

548
00:32:23,410 --> 00:32:24,580
Anda boleh membaca lebih lanjut mengenai perkara itu.

549
00:32:24,580 --> 00:32:27,385
Dan saya cadangkan ia.

550
00:32:27,385 --> 00:32:30,090
>> Terdapat pautan di bahagian
akhir kod ini disiarkan.

551
00:32:30,090 --> 00:32:31,570
Dan kod akan mengulas.

552
00:32:31,570 --> 00:32:34,050
Dalam terdapat pautan untuk lanjut mengenai ini.

553
00:32:34,050 --> 00:32:36,590
Saya cadangkan anda melihat ia.

554
00:32:36,590 --> 00:32:39,460
Tetapi apa yang kita mengambil berat tentang adalah
ini fungsi unjuran.

555
00:32:39,460 --> 00:32:41,210
Saya mahu pergi melalui itu.

556
00:32:41,210 --> 00:32:43,522
>> Pertama sekali, mari saya tunjukkan
anda bahawa, ya, kita mempunyai peta.

557
00:32:43,522 --> 00:32:47,300

558
00:32:47,300 --> 00:32:49,970
Peta sejuk.

559
00:32:49,970 --> 00:32:52,330
Jadi mari kita lihat ini
fungsi pengeluaran.

560
00:32:52,330 --> 00:32:56,481
>> Unjuran adalah sangat banyak
seperti skala, bersisik lagi.

561
00:32:56,481 --> 00:32:59,210
Jadi apa pengeluaran untuk
fungsi unjuran ini

562
00:32:59,210 --> 00:33:06,610
dilakukan, kita boleh lulus longitud
dan latitudes-- dalam kes ini,

563
00:33:06,610 --> 00:33:09,590
nilai-nilai ini di sini adalah
lat-long bangunan

564
00:33:09,590 --> 00:33:13,990
kami duduk di kanan
now-- kepada unjuran.

565
00:33:13,990 --> 00:33:20,560
Dan unjuran akan menukar
itu ke dalam x dan y nilai piksel.

566
00:33:20,560 --> 00:33:23,300
>> Jadi apa unjuran lakukan
hampir sama dengan skala kami.

567
00:33:23,300 --> 00:33:27,270
Ia mengambil latitud kami dan
longitud yang mewakili seluruh dunia

568
00:33:27,270 --> 00:33:31,390
dan mengecut dan saiz yang
turun ke dataran yang kita mahu,

569
00:33:31,390 --> 00:33:33,510
bahawa kami telah diberikan itu.

570
00:33:33,510 --> 00:33:35,220
Dalam kes ini, kami
lulus nilai-nilai ini.

571
00:33:35,220 --> 00:33:41,370
Dan ia memberi kita, baik, yang
pada skrin anda bermakna 640 piksel.

572
00:33:41,370 --> 00:33:46,250
Ini skrin keseluruhan adalah 700 piksel
luas, sehingga membuat kita tentang di sini,

573
00:33:46,250 --> 00:33:53,310
dan 154 piksel ke bawah, yang saya akan
anggaran adalah cukup banyak di sini.

574
00:33:53,310 --> 00:33:57,250
>> Jadi mengambil orang-lat-long, yang
mewakili sesuatu di seluruh dunia

575
00:33:57,250 --> 00:34:02,850
dan memicit dan bergerak di sekitar
untuk memberi kita x dan nilai y piksel,

576
00:34:02,850 --> 00:34:05,450
ini adalah perkara yang pertama itu
dilakukan dalam kod pemetaan ini.

577
00:34:05,450 --> 00:34:07,920
Dan kemudian yang lain daripada
kod menggunakan data

578
00:34:07,920 --> 00:34:14,310
dan kemudian maps mereka lat-long
kepada sesuatu di skrin anda.

579
00:34:14,310 --> 00:34:18,380
>> Tetapi kita akan menggunakan unjuran ini
fungsi, kerana ternyata

580
00:34:18,380 --> 00:34:20,270
kita mempunyai lat-long long juga.

581
00:34:20,270 --> 00:34:24,509
Mengimbas kembali pada data kami, kami mempunyai
latitud dan longitud koordinat

582
00:34:24,509 --> 00:34:25,425
untuk setiap pemerhatian.

583
00:34:25,425 --> 00:34:28,131

584
00:34:28,131 --> 00:34:29,130
Jadi mari kita menggunakan unjuran.

585
00:34:29,130 --> 00:34:33,250

586
00:34:33,250 --> 00:34:37,639
>> Jadi melihat pameran kami,
kita mahu exposition-- kami

587
00:34:37,639 --> 00:34:39,590
kita mempunyai latitud dan longitud yang.

588
00:34:39,590 --> 00:34:40,770
Tetapi kita mahu nilai piksel.

589
00:34:40,770 --> 00:34:43,510
Dan ternyata, kita betul-betul
apa yang kita want-- unjuran.

590
00:34:43,510 --> 00:34:46,239
Sangat banyak seperti kita
menggunakan skala di sini,

591
00:34:46,239 --> 00:34:52,075
kita kini akan menggunakan unjuran
dan lulus ia Koordinat.

592
00:34:52,075 --> 00:34:55,241

593
00:34:55,241 --> 00:34:56,949
Jadi perkara pertama yang
kami doing-- jadi kami

594
00:34:56,949 --> 00:35:01,520
mendapatkan d, yang merupakan data individu
unsur kejadian gempa bumi individu

595
00:35:01,520 --> 00:35:02,370
membaca.

596
00:35:02,370 --> 00:35:04,640
Perkara pertama yang kami lakukan
adalah mendapatkan koordinat.

597
00:35:04,640 --> 00:35:06,150
Baiklah, kita mempunyai koordinat.

598
00:35:06,150 --> 00:35:09,160
>> Perkara kedua yang kita lakukan adalah
lulus bahawa pada unjuran.

599
00:35:09,160 --> 00:35:13,440
Unjuran menukarkan mereka koordinat
kepada nilai piksel, x dan y.

600
00:35:13,440 --> 00:35:16,680
Dan kemudian sesuatu yang kita tidak
mahu lakukan adalah hanya mendapatkan x,

601
00:35:16,680 --> 00:35:19,342
yang kes ini adalah yang pertama.

602
00:35:19,342 --> 00:35:22,050
Ia merupakan satu dari dua perkara yang
yang dikembalikan oleh unjuran.

603
00:35:22,050 --> 00:35:27,840

604
00:35:27,840 --> 00:35:29,630
>> Kami akan melakukan perkara yang sama untuk y.

605
00:35:29,630 --> 00:35:34,960
Tetapi sebaliknya, kami akan kembali
elemen kedua, y.

606
00:35:34,960 --> 00:35:35,980
Bersedialah untuk menyegarkan.

607
00:35:35,980 --> 00:35:39,830

608
00:35:39,830 --> 00:35:46,450
Ooh, watak tambahan
here-- bagus, kami mempunyai

609
00:35:46,450 --> 00:35:51,730
dokumen data didorong itulah
menyembunyikan fail JSON ini objek,

610
00:35:51,730 --> 00:35:57,560
membuat peta, dan mengubah
atribut berhubung dengan data yang

611
00:35:57,560 --> 00:35:59,600
untuk projek di atas peta.

612
00:35:59,600 --> 00:36:00,840
Ini adalah benar-benar menarik.

613
00:36:00,840 --> 00:36:03,770
Ini tenang.

614
00:36:03,770 --> 00:36:05,640
>> Mari kita mengambil ia sehingga takuk a.

615
00:36:05,640 --> 00:36:08,795
Maksud saya, kita mempunyai dua keping
maklumat dengan setiap titik data.

616
00:36:08,795 --> 00:36:10,000
Maksud saya, tiga.

617
00:36:10,000 --> 00:36:12,540
Kami mempunyai koordinat,
yang merupakan x dan y.

618
00:36:12,540 --> 00:36:15,700
Dan kita mempunyai magnitud.

619
00:36:15,700 --> 00:36:17,420
>> Kita perlu untuk mengekod magnitud entah bagaimana.

620
00:36:17,420 --> 00:36:18,920
Kami mempunyai banyak saluran.

621
00:36:18,920 --> 00:36:20,370
Kita boleh menggunakan warna.

622
00:36:20,370 --> 00:36:21,890
Kita boleh menggunakan jejari.

623
00:36:21,890 --> 00:36:23,040
Kita boleh menggunakan kelegapan.

624
00:36:23,040 --> 00:36:25,540
Kita boleh menggunakan banyak perkara dalam kod.

625
00:36:25,540 --> 00:36:29,180
Mana-mana sifat-sifat dan banyak
lebih yang tidak disenaraikan di sini,

626
00:36:29,180 --> 00:36:33,065
kerana mereka pilihan, kita boleh
digunakan untuk mengekod data ini, angin ahmar

627
00:36:33,065 --> 00:36:35,670
dan semua ini saya sebutkan.

628
00:36:35,670 --> 00:36:36,690
>> Mari kita buat jejari.

629
00:36:36,690 --> 00:36:38,830
Saya rasa jejari adalah yang paling intuitif.

630
00:36:38,830 --> 00:36:46,210
Jadi sekali lagi, kami akan menggantikan yang keras berkod
40 dan membuat beberapa pengiraan.

631
00:36:46,210 --> 00:36:48,810
Kami akan menggunakan skala kegemaran kami lagi.

632
00:36:48,810 --> 00:36:50,290
Dan kami lalu d.

633
00:36:50,290 --> 00:36:55,850
Tetapi tidak d kerana kita mahu magnitud
d. d hanyalah titik data.

634
00:36:55,850 --> 00:36:57,430
Kami akan lulus magnitud mengikut skala.

635
00:36:57,430 --> 00:36:58,470
>> Mari kita cuba sekali lagi.

636
00:36:58,470 --> 00:37:00,230
Ooh, ia tidak berfungsi.

637
00:37:00,230 --> 00:37:02,940
Mengapakah ia tidak berfungsi?

638
00:37:02,940 --> 00:37:04,387
>> Jadi ingat apa skala tidak.

639
00:37:04,387 --> 00:37:05,470
Mari kita lihat skala lagi.

640
00:37:05,470 --> 00:37:10,800
Peta skala dari 1 hingga 10 pada
untuk 22-600, lebih atau kurang.

641
00:37:10,800 --> 00:37:12,030
600 adalah besar.

642
00:37:12,030 --> 00:37:14,730
Inilah sebabnya mengapa kami mendapat ini.

643
00:37:14,730 --> 00:37:18,420
>> Oleh itu, kita mahu menukar skala kami
kepada sesuatu yang lebih munasabah.

644
00:37:18,420 --> 00:37:22,610
Katakan, kita mahu 0-60.

645
00:37:22,610 --> 00:37:25,340
60 adalah besar, tetapi 10 gempa bumi
adalah sangat jarang berlaku.

646
00:37:25,340 --> 00:37:27,880
Malah, mereka tidak pernah berlaku.

647
00:37:27,880 --> 00:37:31,830
>> Jadi apa yang akan dilakukan adalah, ia akan mengambil
magnitud kami yang masuk dari 1 hingga 10

648
00:37:31,830 --> 00:37:34,490
dan peta di atas untuk mengembangkan ia keluar.

649
00:37:34,490 --> 00:37:37,370
Dan peta ia ke 0-60.

650
00:37:37,370 --> 00:37:38,840
Mari kita menyegarkan.

651
00:37:38,840 --> 00:37:41,850
>> Nice, kami mempunyai satu visualisasi.

652
00:37:41,850 --> 00:37:42,500
Ini adalah besar.

653
00:37:42,500 --> 00:37:43,736
Ini adalah data sebenar.

654
00:37:43,736 --> 00:37:46,360
Anda akan perasan, dalam mainan kecil saya
Sebagai contoh, gempa bumi terbesar

655
00:37:46,360 --> 00:37:49,417
yang tepat di atas kami.

656
00:37:49,417 --> 00:37:50,000
Tetapi itu sahaja.

657
00:37:50,000 --> 00:37:54,422
Kami mempunyai tarikh didorong visualisasi
yang menggunakan data

658
00:37:54,422 --> 00:37:56,255
dan memberikan kita benar-benar
maklumat yang menarik.

659
00:37:56,255 --> 00:38:02,600

660
00:38:02,600 --> 00:38:06,420
Yeah, mari kita menambah beberapa
interaktiviti kepadanya.

661
00:38:06,420 --> 00:38:08,675
Saya nyatakan bahawa adalah
daya yang kuat D3.

662
00:38:08,675 --> 00:38:11,490

663
00:38:11,490 --> 00:38:15,060
>> Jadi di sini, bagi setiap elemen, kami
menggambarkan sekumpulan sifat-sifat.

664
00:38:15,060 --> 00:38:20,230
Tetapi kita juga dapat menggambarkan apa yang kita mahu
berlaku dengan unsur-unsur interaktiviti.

665
00:38:20,230 --> 00:38:26,190
Sebagai contoh, kita boleh menggambarkan
apa yang berlaku apabila kita tetikus ke atas.

666
00:38:26,190 --> 00:38:28,740

667
00:38:28,740 --> 00:38:33,640
Dan sangat serupa itu,
yang akan mengambil fungsi,

668
00:38:33,640 --> 00:38:36,700
hampir sama dengan
atribut kita mempunyai di hadapan,

669
00:38:36,700 --> 00:38:44,650
di mana kita melakukan sesuatu kepada
unsur apabila kita pergi ke atas ia.

670
00:38:44,650 --> 00:38:47,100
>> Jadi perkara pertama yang perlu kita
lakukan adalah memilih elemen yang,

671
00:38:47,100 --> 00:38:49,435
untuk merasa pada dasarnya, dalam penyemak imbas.

672
00:38:49,435 --> 00:38:57,090

673
00:38:57,090 --> 00:39:00,920
dan kemudian kita boleh menetapkan
sifat kepadanya.

674
00:39:00,920 --> 00:39:06,870
Jadi apa yang saya lakukan di sini adalah, apabila kita berlegar
atas sesuatu, kami akan mendapatkan elemen yang

675
00:39:06,870 --> 00:39:11,197
dan kemudian menetapkan opacity kembali
1, untuk benar-benar telus.

676
00:39:11,197 --> 00:39:12,488
Mari kita lihat apa yang kelihatan seperti.

677
00:39:12,488 --> 00:39:29,430

678
00:39:29,430 --> 00:39:39,080
>> Nampaknya kita mempunyai
koma bertitik tambahan di sini.

679
00:39:39,080 --> 00:39:42,420
Jadi, jika kita tuding sini, ia menjadi penuh.

680
00:39:42,420 --> 00:39:46,530

681
00:39:46,530 --> 00:39:48,960
Tetapi sekarang, sudah tentu, ia
tetap penuh, kerana kita

682
00:39:48,960 --> 00:39:53,240
perlu menerangkan apa yang berlaku
apabila mengeluarkan kursor kami.

683
00:39:53,240 --> 00:39:59,990
Jadi mari kita buat betul-betul bahawa pada
mouseout, bertentangan dengan mouseover.

684
00:39:59,990 --> 00:40:06,399
>> Dan kami akan menetapkan semula kepada
apa yang kita mempunyai before-- 0.5.

685
00:40:06,399 --> 00:40:10,260
Dan sekarang, setiap kali kita
hover, kita akan mendapat satu bulatan penuh.

686
00:40:10,260 --> 00:40:13,468
Ia membantu kita lihat apa yang kita
kami memilih dasarnya.

687
00:40:13,468 --> 00:40:19,210

688
00:40:19,210 --> 00:40:22,860
>> Dan sekarang mari kita membuat ini benar-benar hebat.

689
00:40:22,860 --> 00:40:26,210
Mari kita sambung ini kepada data sebenar.

690
00:40:26,210 --> 00:40:30,890
Jadi mari kita bertanya boleh
USGS mengenai data mereka.

691
00:40:30,890 --> 00:40:35,630
Jadi Kajian Geologi Amerika Syarikat
mempunyai data mengenai gempa bumi.

692
00:40:35,630 --> 00:40:41,460
Mereka mempunyai API awam yang dapat
untuk dimakan dalam format JSON.

693
00:40:41,460 --> 00:40:42,548
Jadi mari kita buat itu.

694
00:40:42,548 --> 00:40:49,730

695
00:40:49,730 --> 00:40:55,900
>> Jadi ini adalah sedikit kod yang
menghubungkan kepada API USGS itu.

696
00:40:55,900 --> 00:40:57,990
Dan ada sedikit pemprosesan di atasnya.

697
00:40:57,990 --> 00:41:02,200
Ini tidak berkaitan tetapi ia memudahkan
kepada format data yang mudah seperti yang

698
00:41:02,200 --> 00:41:03,800
kita mempunyai di hadapan.

699
00:41:03,800 --> 00:41:08,140
Jadi saya menghilangkan panggilan kami untuk
data.json palsu kami dalam fail.

700
00:41:08,140 --> 00:41:13,110
Dan sebaliknya, saya memanggil
USGS dasarnya.

701
00:41:13,110 --> 00:41:16,700
>> Mari kita menyegarkan, bagus.

702
00:41:16,700 --> 00:41:21,260
Ini adalah sebenar, data sebenar
dari minggu ini untuk gempa bumi.

703
00:41:21,260 --> 00:41:23,217
Ini adalah benar-benar menarik.

704
00:41:23,217 --> 00:41:25,050
Ini tidak menghairankan
bagi kita, tetapi ada

705
00:41:25,050 --> 00:41:27,909
banyak gempa bumi di
Pantai Barat di California.

706
00:41:27,909 --> 00:41:30,950
Tetapi saya fikir ia adalah sangat menarik
bahawa terdapat begitu banyak gempa bumi

707
00:41:30,950 --> 00:41:34,350
di Alaska, dan nampaknya,
di sini di Midwest.

708
00:41:34,350 --> 00:41:37,630
Maksud saya, menarik, dan kami baik.

709
00:41:37,630 --> 00:41:40,410
Itulah kesimpulan.

710
00:41:40,410 --> 00:41:43,760
>> Tetapi pada dasarnya, ini
adalah apa yang D3 membantu kita lakukan.

711
00:41:43,760 --> 00:41:48,030
Ia membantu kita mengambil data, mengikat
kepada unsur-unsur dalam DOM,

712
00:41:48,030 --> 00:41:51,620
dan mempunyai unsur-unsur mengubah
sebagai fungsi data,

713
00:41:51,620 --> 00:41:54,780
mempunyai sifat-sifat mereka, semua
banyak sifat-sifat unsur-unsur,

714
00:41:54,780 --> 00:41:57,393
semua berguna untuk saluran
untuk menyampaikan maklumat.

715
00:41:57,393 --> 00:42:05,440

716
00:42:05,440 --> 00:42:09,290
>> D3 adalah sangat kuat
perpustakaan dan menakjubkan dikendalikan dengan baik.

717
00:42:09,290 --> 00:42:12,260
Ini adalah beberapa perkara yang kuat.

718
00:42:12,260 --> 00:42:15,960
Visualisasi data adalah
alat yang sangat kuat

719
00:42:15,960 --> 00:42:21,530
untuk menyampaikan kepada orang-orang yang mendalam
wawasan yang mendapat untuk teras mereka

720
00:42:21,530 --> 00:42:25,430
dan membantu mereka memahami, dalam
cara mendalam dan intuitif ini,

721
00:42:25,430 --> 00:42:29,760
bagaimana data kerja dan bagaimana
data mengubah hidup kami.

722
00:42:29,760 --> 00:42:31,019