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

2
00:00:00,780 --> 00:00:11,880
>> [მუსიკალური სათამაშო]

3
00:00:11,880 --> 00:00:16,480
>> DAVID Chouinard: მე ვარ დავით
Chouinard, და ეს არის D3.

4
00:00:16,480 --> 00:00:17,700
მივესალმებით.

5
00:00:17,700 --> 00:00:21,270
ჩვენ ვაპირებთ, რომ გაიგოთ D3 დღეს.

6
00:00:21,270 --> 00:00:25,020
D3 არის JavaScript ფარგლებში
მშენებლობის მაღალი ხარისხი

7
00:00:25,020 --> 00:00:28,110
ინტერაქტიული თვალსაჩინოება ვებ.

8
00:00:28,110 --> 00:00:30,870
რამ, როგორიცაა, რაც ჩვენ
ხედავს უკან ჩემთვის,

9
00:00:30,870 --> 00:00:34,230
ჩვენ ვაპირებთ, რომ ისწავლონ, რათა იმ
რამ, სახის საფუძვლებს იგი.

10
00:00:34,230 --> 00:00:36,452
მაგრამ ეს იქნება მაგარი.

11
00:00:36,452 --> 00:00:38,160
მოდით დავიწყოთ
მიღების ლამაზი სურათები.

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

13
00:00:41,108 --> 00:00:44,350
ჩვენ მივიღეთ უფრო demos
პერსპექტივები შესაძლებელი.

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

15
00:00:48,040 --> 00:00:50,760
მოდით ეს.

16
00:00:50,760 --> 00:00:58,700
>> აქტის მე, DOM manipulation-- ჩვენ ვაპირებთ
დაიწყოს დაუყოვნებლივ მიღების მაგარი რამ.

17
00:00:58,700 --> 00:01:01,240
პირველ რიგში, მარცხენა, ჩვენ გვაქვს კოდი.

18
00:01:01,240 --> 00:01:03,470
მარჯვენა, ჩვენ გვაქვს
შედეგი ჩვენი კოდი.

19
00:01:03,470 --> 00:01:04,900
მოდით გავლა იგი.

20
00:01:04,900 --> 00:01:05,780
>> მოდით, რათა წრე.

21
00:01:05,780 --> 00:01:08,570
როგორ, რომ ხმის?

22
00:01:08,570 --> 00:01:14,934
svg.append circle--
ჩვენ უბრალოდ გააკეთა წრე.

23
00:01:14,934 --> 00:01:16,100
თქვენ არ მჯერა მე, არა?

24
00:01:16,100 --> 00:01:18,190
ეს არ არსებობს.

25
00:01:18,190 --> 00:01:21,830
>> მერე რა ჩვენ სწორედ აქ არის,
SVG არის scalable ვექტორული გრაფიკა.

26
00:01:21,830 --> 00:01:27,530
ეს არის გზა, რომელსაც ჩვენ გეტყვით ბრაუზერი
რათა ვექტორული გრაფიკა ბრაუზერში.

27
00:01:27,530 --> 00:01:30,740
რაც ჩვენ გავაკეთეთ ახლავე
ემატება წრე დაათვალიეროთ.

28
00:01:30,740 --> 00:01:34,790
>> დაპირება, რომ წრე
მოითხოვს ცოტა ძირითადი ატრიბუტები

29
00:01:34,790 --> 00:01:36,850
სანამ ჩვენ შეგვიძლია რეალურად ვხედავ მას.

30
00:01:36,850 --> 00:01:40,045
ჩვენ უნდა გითხრათ, რომ ეს მისი x პოზიცია,
მისი Y პოზიცია, მისი რადიუსი.

31
00:01:40,045 --> 00:01:43,310
ჩვენ არ ვუთხრა ის, რომ არც ერთი,
ასე რომ, ჩვენ არ ვხედავთ, რომ ეს ახლა.

32
00:01:43,310 --> 00:01:46,210
მაგრამ მოდით გეტყვით, რომ ეს ნივთები.

33
00:01:46,210 --> 00:01:49,510
>> ასე რომ, პირველ რიგში, თქვენ მოხვდით
რათა ჩვენი წრე სახელი.

34
00:01:49,510 --> 00:01:53,070
ასე რომ, მოდით ეძახით წრე.

35
00:01:53,070 --> 00:01:54,406
ჩვენი წრე აქვს სახელი ახლა.

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

37
00:01:57,230 --> 00:01:59,490
და მოდით მივცეთ მას რამდენიმე ატრიბუტები.

38
00:01:59,490 --> 00:02:03,690
როგორ შესახებ cx იქნება ცენტრის x, ასე
ცენტრში x პოზიცია.

39
00:02:03,690 --> 00:02:06,730
ვთქვათ, 200 200 pixels.

40
00:02:06,730 --> 00:02:10,220
>> მოდით მივცეთ მას y 200 pixels ასევე.

41
00:02:10,220 --> 00:02:16,032
და რ, რადიუსი, დაახლოებით 40 პიქსელი.

42
00:02:16,032 --> 00:02:16,950
ახლა ვნახოთ.

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

44
00:02:21,740 --> 00:02:23,440
მე ვერ მართლწერის.

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

46
00:02:30,430 --> 00:02:31,520
>> იქ წასვლა.

47
00:02:31,520 --> 00:02:37,330
ჩვენ გვაქვს წრის პოზიცია 200
pixels, 200 pixels, რადიუსი 40 პიქსელი.

48
00:02:37,330 --> 00:02:38,280
სახის cool, არა?

49
00:02:38,280 --> 00:02:38,988
ჩვენ გვაქვს წრე.

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

51
00:02:40,880 --> 00:02:42,670
>> ასე არ უნდა დაიცვას გასწვრივ.

52
00:02:42,670 --> 00:02:45,790
ყველა ეს მაგალითები, ყველა
კოდი მე ვაკეთებ დღეს

53
00:02:45,790 --> 00:02:51,300
უზრუნველყოფილი იქნება ონლაინ ბოლოს
სახით ინტერაქტიული მაგალითები

54
00:02:51,300 --> 00:02:54,010
ერთად საგუშაგოებს
ყველა აქტი, და ასე შემდეგ.

55
00:02:54,010 --> 00:02:55,160
>> მოდით გავაკეთოთ მეტი პერსონალი.

56
00:02:55,160 --> 00:02:58,901
ამ შავი წრე მართლაც მახინჯი.

57
00:02:58,901 --> 00:03:01,541
მე ვწუხვარ, რომ შეცდომა
შეტყობინებები უფლება არსებობს.

58
00:03:01,541 --> 00:03:05,340
იქ ჩვენ წავიდეთ.

59
00:03:05,340 --> 00:03:06,350
>> მოდით მივცეთ მას ფერი.

60
00:03:06,350 --> 00:03:07,170
როგორ არის, რომ?

61
00:03:07,170 --> 00:03:08,340
მე მიყვარს ფოლადის ლურჯი.

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

63
00:03:13,280 --> 00:03:16,030
ასევე, ჩვენი წრე შეიცვალა ფერი.

64
00:03:16,030 --> 00:03:17,320
ეს არის დიდი.

65
00:03:17,320 --> 00:03:31,330
მოდით ეს ნახევრად გამჭვირვალე
too-- ნახევრად გამჭვირვალე.

66
00:03:31,330 --> 00:03:33,670
>> ასე რომ ეს არის ატრიბუტები
ჩვენ განსაზღვრის წრე.

67
00:03:33,670 --> 00:03:36,774
პირველი, რაც ჩვენ გავაკეთეთ არის
ჩვენ დააყენა წრე გვერდზე.

68
00:03:36,774 --> 00:03:38,690
და მაშინ ჩვენ განმსაზღვრელი
რამოდენიმე ატრიბუტები.

69
00:03:38,690 --> 00:03:41,610
ზოგიერთი მათგანი საჭირო,
როგორიცაა CX, CY, და რადიუსი.

70
00:03:41,610 --> 00:03:42,680
და სხვა აუცილებელი.

71
00:03:42,680 --> 00:03:44,730
>> არსებობს ბევრი სხვა ატრიბუტები.

72
00:03:44,730 --> 00:03:46,760
არსებობს უამრავი მათგანი.

73
00:03:46,760 --> 00:03:53,070
მაგალითად, ჩვენ შეგვეძლო
ინსულტის ისევე, ინსულტის წითელი.

74
00:03:53,070 --> 00:03:55,630
მაგრამ მოდით ამოიღონ, რომ.

75
00:03:55,630 --> 00:04:00,450
ჩვენ უკან წრე, ლურჯი წრე.

76
00:04:00,450 --> 00:04:01,600
>> მოდით უფრო წრეებში.

77
00:04:01,600 --> 00:04:02,810
როგორ არის, რომ?

78
00:04:02,810 --> 00:04:04,665
მოდით, რათა კიდევ ერთი წრე.

79
00:04:04,665 --> 00:04:05,985
ეს არის საინტერესო, არა?

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

81
00:04:09,630 --> 00:04:12,300
>> ასე ვთქვათ, მე უბრალოდ ასლი გაკრული
ის, რაც ჩვენ უკვე.

82
00:04:12,300 --> 00:04:13,570
მოდით ეძახით circle2.

83
00:04:13,570 --> 00:04:15,840
და მოდით ზუსტი
იგივე და მისთვის

84
00:04:15,840 --> 00:04:20,450
ატრიბუტები, ეძლევა x პოზიცია 300.

85
00:04:20,450 --> 00:04:24,140
Yay, ჩვენ გვაქვს ორი წრეების ახლა.

86
00:04:24,140 --> 00:04:27,240
>> და რა თქმა უნდა, ჩვენ შეგვიძლია
განახლება ამ ფასეულობების.

87
00:04:27,240 --> 00:04:31,640
მე ვერ დააყენა ის 400, და ახლა ის მოძრაობს.

88
00:04:31,640 --> 00:04:35,470
და რადგან ეს არის შემაშფოთებელი, მოდით
ამოიღონ იგი, ასე circle2.remove.

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

90
00:04:39,000 --> 00:04:40,730
ის წავიდა ახლა.

91
00:04:40,730 --> 00:04:43,170
>> ასე, რას ვაკეთებთ და
მხოლოდ ძალიან, very-- ეს

92
00:04:43,170 --> 00:04:46,030
ძალიან ჰგავს, რაც თქვენ
შეიძლება გავაკეთოთ jQuery, მაგალითად.

93
00:04:46,030 --> 00:04:48,240
ჩვენ უბრალოდ მანიპულირების
DOM, ის მოუწოდა.

94
00:04:48,240 --> 00:04:50,040
თქვენ ალბათ გსმენიათ, რომ სიტყვა, სანამ.

95
00:04:50,040 --> 00:04:53,255
ჩვენ შექმნის პერსონალი, შექმნის
ატრიბუტები პერსონალი, მოხსნის პერსონალი.

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

97
00:04:58,950 --> 00:05:02,360
>> ახლა, აქ, სადაც იგი იღებს საინტერესო.

98
00:05:02,360 --> 00:05:07,250
ასე მოგვიანებით კოდი, ჩვენ შეიძლება მაინც
ეხება ორიგინალური წრის აქ.

99
00:05:07,250 --> 00:05:14,100
ასე რომ, მოდით აღადგინოთ მისი ატრიბუტი cx.

100
00:05:14,100 --> 00:05:18,260
ასე ვთქვათ, მისი x პოზიცია 400.

101
00:05:18,260 --> 00:05:22,406
და მე ვაპირებ გადასვლას
რომ, ასე რომ ცხადია.

102
00:05:22,406 --> 00:05:23,360
იქ ჩვენ წავიდეთ.

103
00:05:23,360 --> 00:05:24,780
>> ამიტომ ჩვენ დამატებული წრე.

104
00:05:24,780 --> 00:05:26,440
ჩვენ მითითებული ზოგიერთი ატრიბუტები.

105
00:05:26,440 --> 00:05:28,210
ჩვენ დაემატა კიდევ ერთი წრე, მოიხსნება ეს.

106
00:05:28,210 --> 00:05:31,650
და მაშინ ჩვენ შეცვლის
ორიგინალური წრე.

107
00:05:31,650 --> 00:05:35,400
>> მაგრამ აქ, სადაც იგი იღებს
კიდევ უფრო საინტერესოა.

108
00:05:35,400 --> 00:05:39,070
არა მხოლოდ შეიძლება ჩვენ მითითებული ატრიბუტები
როგორც მხოლოდ აფასებს, შეიძლება ითქვას,

109
00:05:39,070 --> 00:05:41,610
hey, წრე, წასვლა პოზიცია 200.

110
00:05:41,610 --> 00:05:44,540
ჩვენ შეგვიძლია ასევე მათ, როგორც ფუნქციები.

111
00:05:44,540 --> 00:05:48,850
>> ასე გაცემის ნაცვლად 400 აქ,
ჩვენ შეგვიძლია გარკვეული გაანგარიშებით

112
00:05:48,850 --> 00:05:53,950
on the fly, რასაც ჩვენ
მინდა, რომ ატრიბუტი უნდა იყოს.

113
00:05:53,950 --> 00:05:56,580
ასე რომ, ეს არის, თუ როგორ მინდა რომ გამოეხატათ.

114
00:05:56,580 --> 00:06:00,660
ჩვენ ვამბობთ, ნაცვლად 400, ნება მომეცით
გაძლევთ ფუნქცია ნაცვლად.

115
00:06:00,660 --> 00:06:04,180
და აქ, შიგნით ამ ფუნქციას,
ჩვენ შეგვიძლია რაიმე გიჟები გაანგარიშებით.

116
00:06:04,180 --> 00:06:06,820
>> ჩვენ შეგვიძლია დრო და
შევხედოთ ზოგიერთი სხვა რამ

117
00:06:06,820 --> 00:06:11,230
და დინამიურად გადაწყვიტოს
წრე, რა მნიშვნელობა გვინდა.

118
00:06:11,230 --> 00:06:15,266
როგორ შესახებ ჩვენ მხოლოდ მისცეს
ეს შემთხვევითი x პოზიცია?

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

120
00:06:20,360 --> 00:06:21,120
ასე რომ.

121
00:06:21,120 --> 00:06:25,490
>> მერე რა, რომ ამბობს, არ არის,
ყველა x, აწარმოებს ამ ფუნქციის.

122
00:06:25,490 --> 00:06:29,340
და იმას, რასაც ვაკეთებთ არის საანგარიშო
ზოგიერთი რამ, შემთხვევითი ჯერ სიგანე

123
00:06:29,340 --> 00:06:30,410
და დაბრუნების რომ.

124
00:06:30,410 --> 00:06:34,765
ასე რომ ყოველ ჯერზე ჩვენ აწარმოებს, რომ, მივიღებთ
წრე, რომელიც მიდის შემთხვევითი ადგილი.

125
00:06:34,765 --> 00:06:36,394
ეს სახის cool.

126
00:06:36,394 --> 00:06:38,310
მე ვგრძნობ, რომ მე ვერ შეხედავს
ამ ცოტა.

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

128
00:06:44,274 --> 00:06:46,440
ჩვენ ვიწყებთ მისაღებად
რაღაც საინტერესო აქ.

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

130
00:06:49,120 --> 00:06:51,390
მოდით ეს მონაცემები ამოძრავებს არის.

131
00:06:51,390 --> 00:06:53,420
არ არსებობს მონაცემები აქ.

132
00:06:53,420 --> 00:06:54,482
მოდით შეცვლის.

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

134
00:06:57,440 --> 00:07:12,140
>> მეორე მოქმედება, მონაცემთა Driven Documents--
ასე რომ, მოდით დაბრუნდეს აქ.

135
00:07:12,140 --> 00:07:15,340
და მოდით, უბრალოდ, თავი დაეღწია circle2,
იმიტომ, რომ ჩვენ ვამატებთ და მოხსნის

136
00:07:15,340 --> 00:07:15,840
მას.

137
00:07:15,840 --> 00:07:17,382
ასე რომ, ჩვენ ნამდვილად არ სჭირდება.

138
00:07:17,382 --> 00:07:21,421
ჩვენ უნდა იყოს უფრო ჭკვიანი აქ.

139
00:07:21,421 --> 00:07:23,170
ვთქვათ, ჩვენ გვაქვს
ზოგიერთი მონაცემები გარკვეული.

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

141
00:07:31,540 --> 00:07:40,020
ერთი წუთით მოდით, ვთქვათ,
ჩვენ გვქონდა მონაცემები ამ ფორმით.

142
00:07:40,020 --> 00:07:41,800
ჩვენ გვქონდა მასივი, უბრალოდ
რიცხვების.

143
00:07:41,800 --> 00:07:45,750
ჩვენ გვაქვს შვიდი ნომრები აქ,
ის, რასაც ეს represent-- თანხა

144
00:07:45,750 --> 00:07:48,810
ხალხის საბანკო ანგარიშზე, თუ როგორ
რამდენად ისინი მოხდეს, ღმერთმა იცის რა.

145
00:07:48,810 --> 00:07:51,310
>> ეს არის ნომრები, და ჩვენ
გსურთ გამოიყენოთ ჩვენი წრეების

146
00:07:51,310 --> 00:07:53,240
წარმოადგენს იმ ნომრები რატომღაც.

147
00:07:53,240 --> 00:07:55,515
ჩვენ გვინდა, რომ ჩვენი
წრეების იმ ნომრები.

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

149
00:07:58,750 --> 00:07:59,626
რასაც ჩვენ ვაკეთებთ.

150
00:07:59,626 --> 00:08:01,500
ვთქვათ, ჩვენ გვინდა
წრე ყველა ნომერი.

151
00:08:01,500 --> 00:08:03,590
ჩვენ შეგვიძლია ამის გაკეთება ძველ
რამ ჩვენ აკეთებს

152
00:08:03,590 --> 00:08:06,020
წრე დამატება და circle2 და circle3.

153
00:08:06,020 --> 00:08:10,020
მაგრამ ეს გამოდის მხრივ, და
არსებობს ბევრი იმეორებს ლოგიკა.

154
00:08:10,020 --> 00:08:12,760
>> მოდით კიდევ უფრო ჭკვიანი რომ.

155
00:08:12,760 --> 00:08:17,810
იმის მაგივრად, რომ var წრე
svg.append, რომ ჩვენ უბრალოდ გამოყენებით,

156
00:08:17,810 --> 00:08:21,580
ჩვენ ვაპირებთ გამოვიყენოთ
ამ პატარა ბლოკი აქ.

157
00:08:21,580 --> 00:08:24,510
მე არ მინდა წასვლა სიღრმისეული
შევიდა რა ყველა ეს ნაწილები გააკეთოს.

158
00:08:24,510 --> 00:08:26,020
და ეს არის სახის მოწინავე თემაზე.

159
00:08:26,020 --> 00:08:27,830
და მე მინდა შემეძლო.

160
00:08:27,830 --> 00:08:31,370
>> მაგრამ მთავარია, რომ recognize-- და
დაინახავთ ძალიან ხშირად D3 კოდი.

161
00:08:31,370 --> 00:08:36,840
ამ ტექსტს ძირითადი
ქმნის როგორც ბევრი წრეების

162
00:08:36,840 --> 00:08:41,360
როგორც არსებობს მონაცემთა ელემენტები
ამ მასივი უფლება აქ.

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

164
00:08:53,420 --> 00:08:55,780
ასე რომ, ეს ქმნის როგორც ბევრი
წრეებში არსებობს ელემენტები.

165
00:08:55,780 --> 00:08:58,520
ის აპირებს შექმნას შვიდი წრეებში.

166
00:08:58,520 --> 00:09:01,710
და ეს ასეა ნამდვილად, ნამდვილად მთავარია.

167
00:09:01,710 --> 00:09:02,460
მოდით აწარმოებს, რომ.

168
00:09:02,460 --> 00:09:05,460
მოდით ამოიღონ ჩვენი სხვა წრეში.

169
00:09:05,460 --> 00:09:09,565
მოდით უბრალოდ განვიხილოთ ეს
ნაწილი და აწარმოებს ამ ერთხელ.

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

171
00:09:13,840 --> 00:09:15,260
>> იქ ჩვენ წავიდეთ.

172
00:09:15,260 --> 00:09:18,030
ასე რომ, ჩვენი წრე აქ
ბევრი მუქი, იმიტომ, რომ ჩვენ

173
00:09:18,030 --> 00:09:20,720
შვიდი წრეების, ერთი
თავზე სხვა.

174
00:09:20,720 --> 00:09:25,425
ჩვენ შევქმენით შვიდი წრეების, ერთი
თითოეულ თითოეული ამ მონაცემთა ელემენტს.

175
00:09:25,425 --> 00:09:28,860
მაგრამ არსებობს გასაღები რამ, რაც მოხდა
ამ მონაკვეთში უფლება აქ.

176
00:09:28,860 --> 00:09:31,030
>> ის, რომ მონაცემები იყო ვალდებული.

177
00:09:31,030 --> 00:09:33,440
ასე ყველა ერთი
იმ მონაცემთა ელემენტები,

178
00:09:33,440 --> 00:09:38,830
10, 45, 105, იყო შეკრული
კონკრეტულ წრეში.

179
00:09:38,830 --> 00:09:40,960
ასე რომ, ეს არა მხოლოდ შექმნა
რამოდენიმე წრეების

180
00:09:40,960 --> 00:09:43,420
მაგრამ კავშირები იმ ორი რამ ერთად.

181
00:09:43,420 --> 00:09:48,740
>> და მომავალში, რადგან ჩვენ შევქმენით
იმ წრეებში ამ D3 ფუნქცია,

182
00:09:48,740 --> 00:09:52,430
თუ მე გაძლევთ წრე, თქვენ შეგიძლიათ
მომეცი მონაცემები ასოცირდება იგი.

183
00:09:52,430 --> 00:09:53,280
ასე რომ, ჩვენ შეგვიძლია მოვითხოვოთ, D3.

184
00:09:53,280 --> 00:09:54,840
Hey, D3, მაქვს ამ წრეში.

185
00:09:54,840 --> 00:09:57,350
რა არის მონაცემები, რომ წრე აქვს?

186
00:09:57,350 --> 00:10:01,290
და D3 გვითხრათ 10 ან 45 ან 105.

187
00:10:01,290 --> 00:10:02,380
>> ეს ყველაფერი იკვრება.

188
00:10:02,380 --> 00:10:04,490
ეს ძალიან, ძალიან ფუნდამენტური კონცეფცია.

189
00:10:04,490 --> 00:10:06,070
მოდით შევხედოთ, რომ.

190
00:10:06,070 --> 00:10:12,210
>> ასე რომ, სხვათა შორის, ჩვენ მინდა ვთხოვო D3-- ასე
ეს არის შეუსაბამო ამ,

191
00:10:12,210 --> 00:10:16,620
მაგრამ უბრალოდ მერწმუნეთ იგი.

192
00:10:16,620 --> 00:10:17,620
ეს არის გზა, ჩვენ ვთხოვთ D3.

193
00:10:17,620 --> 00:10:21,312
Hey, D3, მომეცი პირველი
წრე, რომელიც შეგიძლიათ.

194
00:10:21,312 --> 00:10:23,580
მომეცი პირველი წრე შეგიძლიათ.

195
00:10:23,580 --> 00:10:29,660
და მაშინ ჩვენ ვერ ვთხოვ D3, რა არის
მონაცემები, რომ, როგორც ეს 10.

196
00:10:29,660 --> 00:10:33,380
>> ასე რომ, ჩვენ უბრალოდ ვთხოვთ D3, იპოვოს me
პირველ წრეში შეგიძლიათ.

197
00:10:33,380 --> 00:10:34,400
რა არის მისი მონაცემები?

198
00:10:34,400 --> 00:10:36,650
10, რომელიც ნამდვილად არის ჩვენი
პირველი მონაცემთა ელემენტს.

199
00:10:36,650 --> 00:10:42,150
ჩვენ შეიძლება ვთხოვოთ მას, hey, D3,
მოგვაგნოთ ჩვენი მესამე წრე.

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

201
00:10:44,450 --> 00:10:45,740
რატომ არის ეს მართლაც მნიშვნელოვანია?

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

203
00:10:49,790 --> 00:10:52,250
>> ასე რომ სწორედ აქ, აღვნიშნე,
რომ ჩვენ შეგვიძლია გამოვიყენოთ ფუნქციები.

204
00:10:52,250 --> 00:10:54,910
და მე ვთქვი, რომ იყო
ძალიან ძლიერი რამ.

205
00:10:54,910 --> 00:11:03,070
ასე არა მხოლოდ შეგიძლიათ ფუნქციები გავაკეთოთ რამ,
როგორიცაა დაკავდით გამოთვლები, მაგალითად,

206
00:11:03,070 --> 00:11:09,170
დაბრუნდეს შემთხვევითი ნომერი, მას შეუძლია
ასევე გავაკეთოთ რამ, მონაცემების საფუძველზე.

207
00:11:09,170 --> 00:11:11,550
ეს არის ის, რაც მონაცემთა ორიენტირებული დოკუმენტების ნიშნავს.

208
00:11:11,550 --> 00:11:13,750
რომ ის, რაც D3 დგას.

209
00:11:13,750 --> 00:11:17,800
>> ასე რომ, ეს x postition-- ნაცვლად
მხოლოდ ვამბობთ, ყველა წრეების,

210
00:11:17,800 --> 00:11:21,735
მიიღეთ x პოზიცია 200, ჩვენ
შეიძლება ეს ფუნქცია.

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

212
00:11:26,140 --> 00:11:30,140
და აქ, ჩვენ შეგვიძლია გარკვეული გაანგარიშებით.

213
00:11:30,140 --> 00:11:33,710
დ აქ დგას ადგილი მონაცემები.

214
00:11:33,710 --> 00:11:36,120
ასე რომ ყოველ ჯერზე ჩვენ გვაქვს
წრე, ძირითადად,

215
00:11:36,120 --> 00:11:37,750
D3 შევქმნით ამ შვიდი წრეებში.

216
00:11:37,750 --> 00:11:38,500
და შემდეგ ყველა

217
00:11:38,500 --> 00:11:41,920
>> წრე, ის აპირებს, hey,
circle1 რა არის თქვენი x პოზიცია.

218
00:11:41,920 --> 00:11:45,210
ადრე ვიყავით,
ყოველთვის პასუხობდა 200.

219
00:11:45,210 --> 00:11:48,630
მაგრამ ახლა, ყოველ ჯერზე D3 სთხოვს
us რა არის თქვენი x პოზიცია,

220
00:11:48,630 --> 00:11:51,790
ის აპირებს, რათა us-- გვაქვს
რომ წრე, ამიტომ ჩვენ გვაქვს მონაცემები.

221
00:11:51,790 --> 00:11:55,290
ის აპირებს მოგვცეს მონაცემები და აცხადებენ,
რა გინდათ ექსპოზიცია უნდა იყოს,

222
00:11:55,290 --> 00:11:57,120
საფუძველზე, რომ მონაცემები.

223
00:11:57,120 --> 00:11:59,590
>> მოდით უბრალოდ დააბრუნებს ფაქტობრივი მონაცემები.

224
00:11:59,590 --> 00:12:04,910
ასე რომ, თუ ჩვენ აწარმოებს ამ, ეს აძლევს
ჩვენს მონაცემთა ორიენტირებული დოკუმენტები.

225
00:12:04,910 --> 00:12:08,040
ამ წრეებში ეფუძნება
დაკავშირებით position--

226
00:12:08,040 --> 00:12:11,120
ისინი ბაზების როგორც ფუნქცია მონაცემები.

227
00:12:11,120 --> 00:12:13,100
>> ასე რომ პირველი წრე,
D3 აყენებს წრე.

228
00:12:13,100 --> 00:12:16,770
და შემდეგ D3 გვთხოვს, რა
გსურთ ექსპოზიცია უნდა იყოს.

229
00:12:16,770 --> 00:12:19,620
და ჩვენ უბრალოდ, ვამბობთ, რასაც მონაცემები.

230
00:12:19,620 --> 00:12:21,185
რათა ექსპოზიცია 10.

231
00:12:21,185 --> 00:12:26,320
>> მაშინ იგი სთხოვს, რა გინდათ
ექსპოზიცია იყოს მეორე წრეში.

232
00:12:26,320 --> 00:12:27,270
და ჩვენ ვპასუხობთ, 45.

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

234
00:12:30,000 --> 00:12:32,230
და ჩვენ, რა თქმა უნდა, შეგიძლიათ
მიიღოს გარკვეული გამოთვლები აქ.

235
00:12:32,230 --> 00:12:35,510
მე რომ იმ წრეებში
სახის squished up.

236
00:12:35,510 --> 00:12:38,965
>> ასე გამრავლების იგი 3, გამრავლების მონაცემები 3-ზე.

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

238
00:12:41,870 --> 00:12:43,840
ჩვენი წრე უბრალოდ მიიღო გაფართოვდა.

239
00:12:43,840 --> 00:12:46,730
ჩვენი ღირებულება გასამმაგდა.

240
00:12:46,730 --> 00:12:51,010
>> წრე ნამდვილად ზღვარზე,
მოდით იქნებ სახის ოფსეტური იგი.

241
00:12:51,010 --> 00:12:53,632
ვთქვათ, 20.

242
00:12:53,632 --> 00:12:56,070
აქ წასვლა.

243
00:12:56,070 --> 00:12:57,590
>> ეს არის მონაცემთა ვიზუალიზაცია.

244
00:12:57,590 --> 00:13:01,767
ეს არის ძალიან ძირითადი, მაგრამ ეს
გვაძლევს რამდენიმე რისთვისაც ჩვენი მონაცემებით.

245
00:13:01,767 --> 00:13:04,600
იგი გვეუბნება, რომ, მაგალითად, ჩვენ
აქვს პატარა კასეტური ელემენტები.

246
00:13:04,600 --> 00:13:06,340
და ჩვენ გვაქვს დიდი outlier აქ.

247
00:13:06,340 --> 00:13:10,830
ეს გვაძლევს რამდენიმე ინფორმაცია
განაწილების.

248
00:13:10,830 --> 00:13:20,830
>> თუ ჩვენ, მაგალითად, შეცვალოს
მონაცემები 150 აქ და განახლება,

249
00:13:20,830 --> 00:13:22,630
ჩვენი ვიზუალიზაცია შეიცვალა.

250
00:13:22,630 --> 00:13:24,285
ეს დოკუმენტი მონაცემები ამოძრავებს.

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

252
00:13:32,640 --> 00:13:36,180
>> ასე რომ, რა თქმა უნდა, ყველა ამ ელემენტების,
ყველა ეს ატრიბუტიკა აქ,

253
00:13:36,180 --> 00:13:38,430
ჩვენ შეგვიძლია გამოვიყენოთ ფუნქცია, არ
უბრალოდ ნომრები, არა მხოლოდ

254
00:13:38,430 --> 00:13:39,900
x და y პოზიციებზე.

255
00:13:39,900 --> 00:13:42,120
ასე რომ, ჩვენ შეგვიძლია გამოვიყენოთ ფუნქცია ფერი.

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

257
00:13:45,260 --> 00:13:46,360
ამიტომ ჩვენ ყველაფერს გავაკეთებთ იგივე.

258
00:13:46,360 --> 00:13:49,360
ჩვენ მივცემ ეს ფუნქცია.

259
00:13:49,360 --> 00:13:52,320
>> და ვთქვათ, ჩვენ შეგვეძლო
conditionals ჩვენი ფუნქცია.

260
00:13:52,320 --> 00:13:54,770
ეს ფუნქცია შეიძლება
ასი ხაზების ხანგრძლივი.

261
00:13:54,770 --> 00:13:57,150
მას შეუძლია გააკეთოს ძალიან, ძალიან რთული რამ.

262
00:13:57,150 --> 00:13:59,080
>> მოდით დააყენა თუ განაცხადი აქ.

263
00:13:59,080 --> 00:14:03,420
ვთქვათ, თუ ჩვენი მონაცემებით ნაკლებია
50-ზე, რომ ზოგიერთი ბარიერი

264
00:14:03,420 --> 00:14:05,817
რომ ჩვენ დაინტერესებული
in რატომღაც.

265
00:14:05,817 --> 00:14:06,650
მოდით ეს მწვანე.

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

267
00:14:09,830 --> 00:14:15,320
წინააღმდეგ შემთხვევაში, მოდით ეს წითელი.

268
00:14:15,320 --> 00:14:16,110
როგორ არის, რომ?

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

270
00:14:19,630 --> 00:14:21,220
ლამაზი.

271
00:14:21,220 --> 00:14:24,860
>> ასე რომ, ჩვენი მონაცემების ვიზუალიზაცია იწყება
გადმომეცა უფრო საინტერესო ინფორმაცია

272
00:14:24,860 --> 00:14:26,727
ბევრი არხებით.

273
00:14:26,727 --> 00:14:28,560
ახლა ჩვენ ვიცით, ცოტა
განაწილების.

274
00:14:28,560 --> 00:14:31,768
და ჩვენ ვიცით, რომ არსებობს გარკვეული
შეწყვიტა 50 რომ ჩვენ დაინტერესებული.

275
00:14:31,768 --> 00:14:35,630
ჩვენ ვიცით, რომ არსებობს ორი მონაცემების რაოდენობა
ქვემოთ რომ ბარიერი და მათი უმრავლესობა

276
00:14:35,630 --> 00:14:36,130
ზემოთ.

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

278
00:14:41,510 --> 00:14:46,160
>> ისე, საბოლოო ნაბიჯი, ეს მონაცემები აქ,
ეს ძალიან იშვიათი, რომ ეს იგრძნობა.

279
00:14:46,160 --> 00:14:52,610
ასე რომ, მოდით უბრალოდ გადატანა out ცვლადი
იმიტომ, რომ სუფთა, მოსწონს ეს.

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

281
00:15:02,980 --> 00:15:05,197
და მაშინ ჩვენ რომ გამოიყენოს ცვალებად აქ.

282
00:15:05,197 --> 00:15:06,280
ეს არის ზუსტად იგივე.

283
00:15:06,280 --> 00:15:07,280
ეს უბრალოდ ცოტა სუფთა.

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

285
00:15:25,300 --> 00:15:35,300
>> შემდეგი up, აქტის III, Scales--
ასე რომ, ერთი პრობლემა უფლება

286
00:15:35,300 --> 00:15:38,920
აქ არის, თუ შევცვლით ჩვენი
მონაცემები ამ 200 ღირებულება

287
00:15:38,920 --> 00:15:41,685
თუ შევცვლით მას 400
ან რაღაც და განახლება,

288
00:15:41,685 --> 00:15:44,540
მაშინ ეს მნიშვნელობა უბრალოდ წავიდა offscreen.

289
00:15:44,540 --> 00:15:49,040
ასე რომ, ჩვენი ლოგიკა უფლება აქ
როგორ გავაკეთოთ ჯერ 3

290
00:15:49,040 --> 00:15:52,570
და 20, გავრცელება და შემდეგ
ოფსეტური ეს ცოტა ნამდვილად clunky.

291
00:15:52,570 --> 00:15:54,150
>> რას ნიშნავს ეს ციფრები ნიშნავს?

292
00:15:54,150 --> 00:15:55,400
ისინი უბრალოდ მყარი კოდირებული არსებობს.

293
00:15:55,400 --> 00:15:58,830
და ისინი ძალიან მიბმული მონაცემები.

294
00:15:58,830 --> 00:16:00,550
ჩვენ გვინდა მონაცემთა ორიენტირებული დოკუმენტი.

295
00:16:00,550 --> 00:16:05,460
ჩვენ გვინდა ძალიან მოქნილი დოკუმენტი,
რომ ეს მონაცემები, იყენებს მას

296
00:16:05,460 --> 00:16:07,900
და წარმოადგენს მას.

297
00:16:07,900 --> 00:16:11,330
>> ის, რაც ჩვენ ძირითადად გვჭირდება, ჩვენ
აქვს ამ სპექტრს ნომრები 10.

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

299
00:16:12,640 --> 00:16:17,630
და ჩვენ გვინდა, რუკაზე რომ out გადატანა
სიგანე, სრული სიგანე აქ.

300
00:16:17,630 --> 00:16:20,620
ასე რომ, ჩვენ არ სპექტრი
ნომრები მიმდინარეობს 0 100.

301
00:16:20,620 --> 00:16:24,980
და ჩვენ გვაქვს ამ campus I მიდის
20-დან 700, ამ შემთხვევაში.

302
00:16:24,980 --> 00:16:26,515
>> ჩვენ სახის მინდა განვსაზღვრავთ, რომ.

303
00:16:26,515 --> 00:16:30,002
ჩვენ გვინდა, რომ გავაფართოვოთ, რომ და
მაშინ ოფსეტური იგი ცოტა.

304
00:16:30,002 --> 00:16:33,165
გამოდის, რომ D3 აქვს.

305
00:16:33,165 --> 00:16:34,220
ეს ე.წ. მასშტაბით.

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

307
00:16:37,410 --> 00:16:38,250
მოდით გამოვიყენოთ იგი.

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

309
00:16:46,300 --> 00:16:49,670
>> ისე, რომ works-- მე ვაპირებ
აკრიფოთ ამ და შემდეგ ამას.

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

311
00:17:01,530 --> 00:17:02,450
ეს არის მასშტაბით.

312
00:17:02,450 --> 00:17:08,670
რას გააკეთებს ის არის, რომ ეს განვსაზღვრავთ
ღირებულებები 1-დან 200 on 20-დან 600.

313
00:17:08,670 --> 00:17:10,990
ჩვენ შეგვიძლია შევამოწმოთ, რომ.

314
00:17:10,990 --> 00:17:13,329
ჩვენ ვხედავთ, რომ აქ.

315
00:17:13,329 --> 00:17:21,704
>> ასე რომ, თუ მე შესანახი 1-- ერთ მომენტში.

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

317
00:17:47,764 --> 00:17:48,555
მომეცი მეორე.

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

319
00:17:53,680 --> 00:17:55,080
მე უნდა აკრიფეთ იგი.

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

321
00:18:15,320 --> 00:18:15,990
იქ წასვლა.

322
00:18:15,990 --> 00:18:17,930
ვწუხვარ, რომ.

323
00:18:17,930 --> 00:18:22,050
>> ასე რომ, რა მასშტაბის გააკეთებს
არის, დასჭირდება მნიშვნელობა

324
00:18:22,050 --> 00:18:24,930
და შემდეგ გარდაქმნას, რომ,
გაფართოებას, რომ, ასე, რომ ეს

325
00:18:24,930 --> 00:18:27,320
ავსებს სრულ სპექტრს თქვენ ითხოვს.

326
00:18:27,320 --> 00:18:32,910
ასე რომ, ამ შემთხვევაში, თუ ჩვენ მას ერთი,
ის აპირებს რუკაზე რომ out გადატანა 20.

327
00:18:32,910 --> 00:18:37,750
და თუ ჩვენ მას 200, ეს
ვაპირებთ რუკაზე რომ 600.

328
00:18:37,750 --> 00:18:40,460
და სადღაც შორის,
თუ მივიღებთ 100, ეს

329
00:18:40,460 --> 00:18:44,610
იქნება სადმე
შორის 20 და 600.

330
00:18:44,610 --> 00:18:51,480
>> და რა თქმა უნდა, ახლა ეს არის ის, რაც
ჩვენ უნდა ამოიღონ იმ რთული კოდირებული

331
00:18:51,480 --> 00:18:53,402
რამ გვაქვს უფლება არსებობს.

332
00:18:53,402 --> 00:18:55,950
ასე რომ, ჩვენ გვინდა გავაკეთოთ არის
მიიღონ მონაცემები, რომ ჩვენ

333
00:18:55,950 --> 00:19:00,950
იმის გათვალისწინებით, რომ ინდივიდუალური მონაცემები
ელემენტს, და გაივლის მას მასშტაბის პირველი.

334
00:19:00,950 --> 00:19:02,635
ასე მასშტაბის მასშტაბის up.

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

336
00:19:27,020 --> 00:19:48,880
>> Well-- Oh, ჩვენ გვაქვს პატარა შეცდომა აქ.

337
00:19:48,880 --> 00:19:50,120
ჩვენ დაკარგული მონაცემები.

338
00:19:50,120 --> 00:19:51,290
იქ წასვლა.

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

340
00:19:58,550 --> 00:19:59,550
და რომ ფართოვდება იგი out.

341
00:19:59,550 --> 00:20:01,383
>> რომ გვაძლევს იგივე
შედეგი გვქონდა ადრე,

342
00:20:01,383 --> 00:20:04,030
მაგრამ იმის მაგივრად რომ იმ
მყარი კოდირებული შეზღუდვები.

343
00:20:04,030 --> 00:20:07,790
და თუ ზომა ჩვენი
ტილო ცვლილებები, მაგალითად,

344
00:20:07,790 --> 00:20:11,790
თუ ჩვენ გვინდა ამ მეტი
400 პიქსელი და squishes out,

345
00:20:11,790 --> 00:20:15,440
ჩვენ შეიძლება ჰქონდეს მას over--
ჩვენ შეგვიძლია გაფართოების, ან ჩვენ

346
00:20:15,440 --> 00:20:21,890
შეგიძლიათ შეამციროს ამ დატოვა ზღვარი
რაღაც ნაკლებად ან 20-ზე მეტი.

347
00:20:21,890 --> 00:20:25,470
ამ ნომრებზე, ეს რთული კოდირებული
ციფრები, ახლა აზრი ჩვენთვის.

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

349
00:20:28,110 --> 00:20:30,520
>> და ჩვენ შეგვიძლია ამის გაკეთება გაცილებით მეტი
საინტერესო რამ ისევე.

350
00:20:30,520 --> 00:20:35,990
ასე ნაცვლად, რომელმაც ხაზოვანი
მასშტაბის, ჩვენ დაგვჭირდება შეხვიდეთ მასშტაბით.

351
00:20:35,990 --> 00:20:37,840
და რომ მოგვცემს ჟურნალი მასშტაბით.

352
00:20:37,840 --> 00:20:41,269
>> ასე რომ, ახლა ჩვენი მასშტაბის, ნაცვლად
უბრალოდ გაფართოების სპექტრი,

353
00:20:41,269 --> 00:20:42,810
ის აკეთებს უფრო დახვეწილი რამ.

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

355
00:20:48,790 --> 00:20:53,790
იმის მაგივრად, რომ ამ სპექტრს მძიმე
დაშიფრულია, და იმის მაგივრად, რომ 600,

356
00:20:53,790 --> 00:20:58,465
ჩვენ დაგვჭირდება უბრალოდ გამოიყენოთ სიგანე,
ასე 20 სიგანე მინუს 40,

357
00:20:58,465 --> 00:21:02,392
2 ჯერ ზღვარი მეორე მხარეს.

358
00:21:02,392 --> 00:21:05,350
და რაც უფრო გრძნობა, რომ
ვიღაც, ვინც შეიძლება შევხედოთ კოდი.

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

360
00:21:08,080 --> 00:21:11,850
>> საინტერესოა, რომ სასწორები მისაღებად
ძალიან, ძალიან დახვეწილი, ასევე.

361
00:21:11,850 --> 00:21:13,350
მათ ბევრი საინტერესო რამ.

362
00:21:13,350 --> 00:21:17,620
ასე მასშტაბებს არ არის აუცილებელი
მუშაობას მხოლოდ ნომრები.

363
00:21:17,620 --> 00:21:18,955
გადავდგათ ფერის.

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

365
00:21:23,120 --> 00:21:26,120
>> ასე რომ, ჩვენი სპექტრი შეიძლება be--
ჩვენი დომენი 1 200.

366
00:21:26,120 --> 00:21:28,220
რომ შეყვანის რამ.

367
00:21:28,220 --> 00:21:33,793
მაგრამ ჩვენ დაგვჭირდება MAP- დან
მწვანე წითელი, მაგალითად.

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

369
00:21:39,710 --> 00:21:42,910
და ახლა, თუ ჩვენ გაიაროს ეს 1,
ჩვენ ვაპირებთ, რომ მიიღოთ მწვანე.

370
00:21:42,910 --> 00:21:45,110
თუ ჩვენ მას 200, ჩვენ კიდევ წითელი.

371
00:21:45,110 --> 00:21:49,480
და თუ ჩვენ გაიაროს ეს რაღაც შორის,
ეს იქნება გარკვეული ნაზავი, რომელიც,

372
00:21:49,480 --> 00:21:52,520
სადღაც გრადიენტი
შორის მწვანე და წითელი.

373
00:21:52,520 --> 00:21:55,210
>> და იმის მაგივრად
ამ სახის clunky ლოგიკა

374
00:21:55,210 --> 00:21:58,550
ჩვენ გვაქვს აქ
პირობითი უფლება არსებობს,

375
00:21:58,550 --> 00:22:03,250
ჩვენ შეგვეძლო რაღაც
ხაზოვანი მასშტაბი შორის იმ.

376
00:22:03,250 --> 00:22:07,100
ასე რომ ჩვენ გვინდა გამოვიყენოთ მასშტაბის ჩვენ უბრალოდ
შექმნა, რომელიც ჩვენ მოუწოდა ფერი.

377
00:22:07,100 --> 00:22:09,060
და ჩვენ მინდა მისცეს მას D, რომელიც
ჩვენი მონაცემთა ელემენტს.

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

379
00:22:14,250 --> 00:22:15,060
და იქ ჩვენ წავიდეთ.

380
00:22:15,060 --> 00:22:18,070
ჩვენ გვაქვს ფერის.

381
00:22:18,070 --> 00:22:18,940
>> ასე რომ, ეს არის რუკების.

382
00:22:18,940 --> 00:22:20,960
ასე შორს წავიდა სრულიად მწვანე.

383
00:22:20,960 --> 00:22:22,560
შორს უფლება მთლიანად წითელი.

384
00:22:22,560 --> 00:22:24,828
და ყველაფერი შორის
ფუნქცია დ.

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

386
00:22:33,369 --> 00:22:35,160
ჩვენ გვაქვს საინტერესო
თვალსაჩინოება აქ.

387
00:22:35,160 --> 00:22:36,952
მაგრამ ჩვენი მონაცემებით იყო ერთგვარი მოსაწყენი.

388
00:22:36,952 --> 00:22:39,410
ვნახოთ, თუ რისი გაკეთება შეგვიძლია, თუ
ჩვენ გვქონდა უფრო საინტერესო მონაცემები.

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

390
00:22:44,420 --> 00:22:50,500
>> აქტის IV, სამუშაო
მონაცემები პირველი, რაც

391
00:22:50,500 --> 00:22:53,560
ჩვენ გვინდა, რომ გავაკეთოთ, რათა ჩვენი
ვიზუალიზაცია უფრო საინტერესო

392
00:22:53,560 --> 00:22:56,140
გადაადგილება მონაცემები სხვაგან.

393
00:22:56,140 --> 00:22:58,310
ეს ძალიან მოუხერხებელი აქვს
მონაცემები რთული კოდირებული აქ.

394
00:22:58,310 --> 00:23:01,220
და საერთოდ, ჩვენ უნდა ითხოვს
სხვისი მონაცემები.

395
00:23:01,220 --> 00:23:05,400
ჩვენ უნდა იქნებ ითხოვენ,
მოსახლეობის აღწერის ბიუროს, რა არის თქვენი მონაცემები

396
00:23:05,400 --> 00:23:10,170
და შემდეგ შეთქმულება, რომ ან ითხოვს
ზოგიერთი მესამე მხარის პირის ზოგიერთი მონაცემები

397
00:23:10,170 --> 00:23:13,330
და შემდეგ აშენებს
ვიზუალიზაცია, რომ.

398
00:23:13,330 --> 00:23:17,170
>> ასე რომ, პირველი, რაც ჩვენ გვინდა, რომ
არის ნაბიჯი, რომ სხვაგან.

399
00:23:17,170 --> 00:23:24,130
ამიტომ, მე ვაპირებ, რომ შევქმნათ
ფაილი აქ მოუწოდა data.json.

400
00:23:24,130 --> 00:23:25,600
JSON არის მონაცემები ფორმატში.

401
00:23:25,600 --> 00:23:29,210
თქვენ არ ვიცი ბევრად შესახებ, რომ.

402
00:23:29,210 --> 00:23:33,210
და ჩვენ ვაპირებთ კოპირება
პატარა მონაცემები გვაქვს იქ,

403
00:23:33,210 --> 00:23:40,330
ჩასვით იქ verbatim, წავიდეთ
უკან ჩვენი ვიზუალიზაცია კოდი

404
00:23:40,330 --> 00:23:45,362
აქ, და გამოიყენოთ ეს ფუნქცია უფლება აქ.

405
00:23:45,362 --> 00:23:46,820
თქვენ არ ვიცი დეტალები.

406
00:23:46,820 --> 00:23:49,800
მაგრამ რა ამ ყველაფერს გააკეთებს,
ეს ნახავთ, რომ ფაილი,

407
00:23:49,800 --> 00:23:51,780
მოიტანონ, და დაგვიბრუნოთ ის.

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

409
00:24:11,660 --> 00:24:15,220
რა ეს იმას არის, ის მიდის
და მიიღეთ data.json ფაილი.

410
00:24:15,220 --> 00:24:18,570
და მაშინ ყველა კოდი, რომელიც არის
indented შიგნით არსებითად,

411
00:24:18,570 --> 00:24:21,800
ყველა კოდი ჩვენ გვაქვს იქ იქნება
აწარმოებს მხოლოდ მაშინ, როდესაც ჩვენ ვიღებთ მონაცემები უკან.

412
00:24:21,800 --> 00:24:25,760
და მაშინ ის აწარმოებს, რომ
კოდი მონაცემებს გვაქვს.

413
00:24:25,760 --> 00:24:28,870
დიდი, ჩვენ გვაქვს
ვიზუალიზაცია, მიმართეთ

414
00:24:28,870 --> 00:24:31,390
ზოგიერთი კოდი სადღაც
სხვა, რაც, როგორც წესი,

415
00:24:31,390 --> 00:24:36,110
სადაც ეს შეკითხვა ზოგიერთი მონაცემები
სხვაგან, რაც, როგორც წესი,

416
00:24:36,110 --> 00:24:38,656
როგორ თვალსაჩინოება მუშაობა.

417
00:24:38,656 --> 00:24:41,400
>> მაგრამ მე მინდა, რომ დაბრუნდეს მონაცემებით.

418
00:24:41,400 --> 00:24:48,030
ასე მონაცემები ფუნდამენტურად D3-- D3
მოიხმარს მონაცემები, რომ სიაში რამ.

419
00:24:48,030 --> 00:24:53,000
D3 ელოდება მონაცემები უბრალოდ იყოს სიაში
რამ მასივი რამ.

420
00:24:53,000 --> 00:24:58,780
არ აქვს მნიშვნელობა, რა იმ რამ
, ასე რომ სანამ ის მასივი მათ.

421
00:24:58,780 --> 00:25:02,460
>> ასე რომ, აქ, მაგალითად, ჩვენ ვერ და
რა თქმა უნდა, არ მცურავი პუნქტიანი ღირებულებებს.

422
00:25:02,460 --> 00:25:04,830
ჩვენ შეგვეძლო ნეგატივები.

423
00:25:04,830 --> 00:25:09,400
D3 არ აინტერესებს, თუ ისე დიდი ხნის
როგორც ეს სია რამ.

424
00:25:09,400 --> 00:25:13,270
>> როგორც საინტერესო რამ ჩვენ
შეიძლება, ჩვენ შეგვიძლია ასევე

425
00:25:13,270 --> 00:25:19,410
აქვს სტრიქონების სია, როგორიცაა, რომ.

426
00:25:19,410 --> 00:25:25,440
ასე რომ ეს არის Crimson სათაურები
მე აიყვანეს რამდენიმე დღის წინ.

427
00:25:25,440 --> 00:25:29,220
და იქნებ შეგიძლიათ რამდენიმე საინტერესო
რამ ამ ერთად.

428
00:25:29,220 --> 00:25:30,970
>> ასე რომ კიდევ ერთხელ, ეს არის სია რამ.

429
00:25:30,970 --> 00:25:32,360
D3 არ აინტერესებს.

430
00:25:32,360 --> 00:25:35,572
ეს არ უნდა იყოს სიმებიანი.

431
00:25:35,572 --> 00:25:36,530
ჩვენ შეიცვალა ჩვენი მონაცემებით.

432
00:25:36,530 --> 00:25:38,210
>> დავუბრუნდეთ ჩვენი ვიზუალიზაცია.

433
00:25:38,210 --> 00:25:42,495
ახლა, ჩვენი ვიზუალიზაცია მოელის
შეყვანის იყოს ნომრები.

434
00:25:42,495 --> 00:25:44,370
ასე რომ, ჩვენ ვაპირებთ აქვს
იმისათვის, რომ რამდენიმე ცვლილებები.

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

436
00:25:47,180 --> 00:25:52,180
ასე მაგალითად, პირველ რიგში, ალბათ,
ჩვენ გვინდა, რომ ეს წრეები ერთად

437
00:25:52,180 --> 00:25:56,870
ხანგრძლივობა სათაურით,
რაოდენობის სიმბოლოებს ამ სათაურით.

438
00:25:56,870 --> 00:26:03,600
>> ასე რომ ჩვენ ყველაფერს გავაკეთოთ არის ყოველ ჯერზე ჩვენი
ფუნქცია ეწოდება სიმებიანი,

439
00:26:03,600 --> 00:26:09,095
ჩვენ იპოვით ის სიგრძის და
მაშინ გაივლის, რომ მასშტაბით.

440
00:26:09,095 --> 00:26:11,550
ფერი, მე დაბრუნებას
რომ ფოლადის ლურჯი.

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

442
00:26:19,060 --> 00:26:20,420
და იქ ჩვენ წავიდეთ.

443
00:26:20,420 --> 00:26:23,190
ჩვენ გვაქვს ვიზუალიზაცია
of Crimson ერთად.

444
00:26:23,190 --> 00:26:25,500
>> სასწორი არის ცოტა off.

445
00:26:25,500 --> 00:26:29,680
მოდით ვივარაუდოთ, რომ ყველაზე
სათაური 100 სიმბოლომდე

446
00:26:29,680 --> 00:26:32,244
ასე span რომ გამოდის.

447
00:26:32,244 --> 00:26:33,410
და ჩვენ გვაქვს ვიზუალიზაცია.

448
00:26:33,410 --> 00:26:36,710
ასე რომ, როგორც ჩანს, ყველაზე ერთად
საკმაოდ მჭიდრო ერთად,

449
00:26:36,710 --> 00:26:38,750
თვალსაზრისით ხასიათი ონლაინ.

450
00:26:38,750 --> 00:26:41,200
მაგრამ არსებობს ერთი ნამდვილად გამოირჩევა.

451
00:26:41,200 --> 00:26:46,660
>> ჩვენ შეგვიძლია ავაშენოთ ზოგიერთი ინსტრუმენტები
შეისწავლონ, რომ მეტი.

452
00:26:46,660 --> 00:26:50,710
მაგრამ, როდესაც ვმუშაობდი ამ, მე
აინტერესებდა, ამ მონაცემების კომპლექტი,

453
00:26:50,710 --> 00:26:53,880
სათაურები მსხვილი ნაწლავის
მათ იქნება აღარ.

454
00:26:53,880 --> 00:26:55,770
მე ვარაუდობს, რომ ისინი.

455
00:26:55,770 --> 00:26:56,660
>> ასე რომ, მოდით გავარკვიოთ.

456
00:26:56,660 --> 00:27:00,650
მოდით გამოვიყენოთ ფერი
არხი, როგორც ადრე,

457
00:27:00,650 --> 00:27:04,540
encode ზოგიერთი იმის შესახებ,
არსებობს მსხვილი ნაწლავის ან არ.

458
00:27:04,540 --> 00:27:07,220
ასე რომ, ჩვენ ვიყენებთ პირობითი ერთხელ.

459
00:27:07,220 --> 00:27:09,350
თქვენ არ უნდა იცოდეს
დეტალები ამ,

460
00:27:09,350 --> 00:27:14,260
მაგრამ ეს როგორ ჩვენ შეამოწმოთ
string ერთი კონკრეტული ხასიათის

461
00:27:14,260 --> 00:27:16,355
JavaScript, კიდევ ერთხელ, არ შეესაბამება.

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

463
00:27:18,910 --> 00:27:23,270
>> მაგრამ თუ ჩვენ არ მიგვაჩნია
მსხვილი ნაწლავის, ჩვენ დავიბრუნოთ მწვანე.

464
00:27:23,270 --> 00:27:26,100
და თუ ჩვენ გავაკეთებთ, ჩვენ დავიბრუნოთ წითელი.

465
00:27:26,100 --> 00:27:29,010
ასე რომ კიდევ ერთხელ, ერთად რომ
არ მსხვილი ნაწლავის იქნება წითელი.

466
00:27:29,010 --> 00:27:34,980
ეს არის ის, რაც ამ იმას ნიშნავს ლამაზი.

467
00:27:34,980 --> 00:27:38,040
>> გამოდის, რომ ჩემი
ჰიპოთეზა შეხვდნენ.

468
00:27:38,040 --> 00:27:39,360
არსებობს მხოლოდ ორი.

469
00:27:39,360 --> 00:27:42,380
ჩვენ მხოლოდ ექვსი მონაცემების რაოდენობა
და მხოლოდ ორი ჰქონდა colons.

470
00:27:42,380 --> 00:27:45,510
მაგრამ, როგორც ჩანს, ცოტა მეტი
ქვედა ბოლოს, ფაქტობრივად.

471
00:27:45,510 --> 00:27:47,830
სათაურები colons, როგორც ჩანს,
ზოგადად, მოკლე,

472
00:27:47,830 --> 00:27:52,370
მაინც ჩვენი მონაცემებით კომპლექტი საინტერესო.

473
00:27:52,370 --> 00:27:55,830
>> დავუბრუნდეთ, რომ
ფოლადის ლურჯი და მერე ვნახოთ

474
00:27:55,830 --> 00:28:00,601
რა ჩვენ შეგვიძლია ერთად კი
უფრო საინტერესო მონაცემები.

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

476
00:28:04,370 --> 00:28:09,070
ასე რომ კიდევ ერთხელ, მე ვთქვი, რომ
მონაცემები D3 არის სია რამ.

477
00:28:09,070 --> 00:28:11,080
ჩვენ ვნახეთ ნომრები მრავალი სახის.

478
00:28:11,080 --> 00:28:12,810
ჩვენ ვნახეთ strings.

479
00:28:12,810 --> 00:28:15,700
მაგრამ რამ შეიძლება იყოს ობიექტები.

480
00:28:15,700 --> 00:28:20,080
>> ისინი შეიძლება იყოს რთული რამ
რომელიც მოიცავს ბევრი რამ.

481
00:28:20,080 --> 00:28:24,510
ვთქვა, რომ უფრო ნათლად,
უმეტეს შემთხვევაში, ჩვენ

482
00:28:24,510 --> 00:28:28,384
გვსურს, ავაშენოთ ყველა მონაცემები წერტილი, როგორც
უფრო რთული, ვიდრე უბრალოდ ერთი მნიშვნელობა.

483
00:28:28,384 --> 00:28:30,175
თუ გსურთ წარმოსადგენია
მონაცემთა ბაზა, სტუდენტები,

484
00:28:30,175 --> 00:28:32,470
შეიძლება იყოს სტუდენტი
ასახელებს, სტუდენტი ID,

485
00:28:32,470 --> 00:28:36,370
და ბევრი რამ ასოცირდება
კონკრეტულ ჩანაწერი,

486
00:28:36,370 --> 00:28:39,834
არა მხოლოდ სიმებიანი ან ნომერი.

487
00:28:39,834 --> 00:28:40,750
ასე რომ, მოდით შევხედოთ, რომ.

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

489
00:28:55,180 --> 00:28:56,760
>> ეს არის ერთ-ერთი ასეთი მონაცემები კომპლექტი.

490
00:28:56,760 --> 00:28:59,090
ეს მონაცემები მითითებული შესახებ მიწისძვრები.

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

492
00:29:01,910 --> 00:29:08,430
ასე რომ, ყველაფერი აქ ჩვენს სიაში და მასივი
რამ შეიცავს ბევრი რამ თავად.

493
00:29:08,430 --> 00:29:11,380
ასე რომ, ყოველ მონაცემები წერტილი აქვს
მასშტაბები და კოორდინაციას.

494
00:29:11,380 --> 00:29:13,425
და კოორდინაციას უწევს თავად
შეიცავს ორი რამ.

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

496
00:29:15,960 --> 00:29:20,450
>> ასე რომ, ყოველდღე არის გაცილებით მეტი
რთული და უფრო საინტერესო,

497
00:29:20,450 --> 00:29:22,700
და შეიცავს ბევრად უფრო
საინტერესო ინფორმაცია.

498
00:29:22,700 --> 00:29:26,730
ვნახოთ, ჩვენ შეგვიძლია ავაშენოთ, რომ.

499
00:29:26,730 --> 00:29:36,130
დაბრუნების აქ, კიდევ ერთხელ, გამოყენებით
ჩვენი ჰისტოგრამის წრე ვიზუალიზაცია

500
00:29:36,130 --> 00:29:42,110
ჩვენ ავაშენეთ, ვნახოთ, თუ ჩვენ შეგვიძლია ავაშენოთ
ვიზუალიზაცია მასშტაბები განაწილების

501
00:29:42,110 --> 00:29:43,305
ჩვენი მონაცემები კომპლექტი.

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

503
00:29:45,850 --> 00:29:48,660
>> ასე რომ, აქ, ეს იგივე კონცეფცია.

504
00:29:48,660 --> 00:29:51,920
მაგრამ ახლა, d შეიცავს მეტი რამ.

505
00:29:51,920 --> 00:29:54,780
d შეიცავს ბევრ მონაცემთა ელემენტები.

506
00:29:54,780 --> 00:29:57,946
ასე ჩვენ მივიღებთ დ უკან.

507
00:29:57,946 --> 00:29:59,670
D3 გვაძლევს დ.

508
00:29:59,670 --> 00:30:06,080
და ჩვენ რეაგირება მოძიებაში მასშტაბები
დ და შემდეგ გადადის, რომ მასშტაბით.

509
00:30:06,080 --> 00:30:08,490
>> და მაშინ ჩვენ უნდა შეიცვალოს
ჩვენი მასშტაბით, რა თქმა უნდა.

510
00:30:08,490 --> 00:30:12,980
ასე სიდიდეების უბრალოდ არ
წასვლა ბევრად უფრო მეტი ვიდრე 10.

511
00:30:12,980 --> 00:30:15,485
რეალურად, იქ არასოდეს ყოფილა
10 ბალიანი მიწისძვრა.

512
00:30:15,485 --> 00:30:19,360
მაგრამ ეს ერთგვარი ჩვენი ზედა
ბოლოს და ბოლოს, ჩვენი ზედა სპექტრი.

513
00:30:19,360 --> 00:30:20,240
>> მოდით ამოცნობა.

514
00:30:20,240 --> 00:30:22,990
ლამაზი, ჩვენ გვაქვს ვიზუალიზაცია.

515
00:30:22,990 --> 00:30:25,490
ეს საინტერესოა note-- ასე
არსებობს ორი მონაცემები რაოდენობა,

516
00:30:25,490 --> 00:30:29,010
თითქმის ზუსტად თავზე ერთმანეთს
სხვა, თვალსაზრისით მასშტაბები.

517
00:30:29,010 --> 00:30:31,350
თქვენ ხედავთ ამ ბუნდოვანება ჩვენ გამოყენებით.

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

519
00:30:40,810 --> 00:30:42,690
>> ჩვენ გვაქვს გეოგრაფიული მონაცემები ახლა.

520
00:30:42,690 --> 00:30:44,710
ჩვენ გვაქვს სიგანე და განედი.

521
00:30:44,710 --> 00:30:47,549
იქნებ ჩვენ შეგვეძლო რაღაც
კიდევ უფრო საინტერესოა, რომ.

522
00:30:47,549 --> 00:30:49,590
მოდით, კიდევ რამდენიმე
საინტერესო გზა ვიზუალურად

523
00:30:49,590 --> 00:30:53,500
ეს უფრო რთული
მონაცემები ჰქონდეს.

524
00:30:53,500 --> 00:31:04,950
>> აქტის V, Mapping-- ფუნდამენტურად,
ჩვენ გვინდა, რომ ეს რუკა.

525
00:31:04,950 --> 00:31:07,690
ვგულისხმობ, ეს არის, სადაც ეს ხდება.

526
00:31:07,690 --> 00:31:13,130
ჩვენ გვინდა, encode ინფორმაცია
პოზიცია ამ მიწისძვრის კითხვას,

527
00:31:13,130 --> 00:31:16,350
ასევე მათი მასშტაბები,
იმიტომ, რომ ჩვენ რომ ახლა.

528
00:31:16,350 --> 00:31:21,310
ჩვენ გვესმის, როგორ მოიხმარენ
უფრო რთული მონაცემები.

529
00:31:21,310 --> 00:31:26,200
>> პირველი, რაც ჩვენ უნდა გავაკეთოთ არის
შექმნათ რუკა, ფონზე რუკაზე.

530
00:31:26,200 --> 00:31:29,360
მე ვაპირებ გავლა
ეს ძალიან სწრაფად.

531
00:31:29,360 --> 00:31:30,560
ეს არის სახიფათო კოდი.

532
00:31:30,560 --> 00:31:33,110
ეს კიდევ ერთი იმ
რეცეპტები თქვენ ნამდვილად არ

533
00:31:33,110 --> 00:31:35,690
უნდა გვესმოდეს, სრულად გამოიყენოთ.

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

535
00:31:38,510 --> 00:31:39,740
მაგრამ ეს კოდი.

536
00:31:39,740 --> 00:31:43,580
ამ კოდი უფლება აქ ქმნის რუკაზე.

537
00:31:43,580 --> 00:31:45,730
>> ჩვენ არ ვაპირებთ წასვლა დეტალურად.

538
00:31:45,730 --> 00:31:54,210
მაგრამ ზედაპირულად, თუ რას აკეთებს არის,
ეს შეკითხვა ამ us.json ფაილი, რომელიც

539
00:31:54,210 --> 00:31:57,150
არის მონაცემთა ფაილი როგორიცაა
ერთი გვქონდა ადრე.

540
00:31:57,150 --> 00:31:59,150
ეს უფრო რთული, რა თქმა უნდა.

541
00:31:59,150 --> 00:32:02,920
მაგრამ ამ შემთხვევაში, ყველაფერი,
ყველა მონაცემები წერტილი არის ეს სახელმწიფო

542
00:32:02,920 --> 00:32:05,420
და აქვს ჩამონათვალი
სიგანე და გრძედის

543
00:32:05,420 --> 00:32:10,500
რომ განსაზღვროს პოლიგონზე,
რომ ფორმა, რომ სახელმწიფო.

544
00:32:10,500 --> 00:32:13,280
>> ასე რომ, რა D3 გააკეთებს მსგავსი
რა გავაკეთეთ ადრე.

545
00:32:13,280 --> 00:32:18,140
ის მოითხოვს, და
სავალდებულოა, რომ ელემენტს.

546
00:32:18,140 --> 00:32:20,890
და არსებობს ფუნქცია, რომელიც
განვსაზღვრავთ, რომ ელემენტს,

547
00:32:20,890 --> 00:32:23,410
საფუძველზე latitudes და განედი.

548
00:32:23,410 --> 00:32:24,580
შეგიძლიათ წაიკითხოთ უფრო, რომ.

549
00:32:24,580 --> 00:32:27,385
და მე გირჩევთ ეს.

550
00:32:27,385 --> 00:32:30,090
>> არსებობს ბმულები
დასასრულს ამ კოდექსის განთავსებული.

551
00:32:30,090 --> 00:32:31,570
და კოდი არის კომენტარი.

552
00:32:31,570 --> 00:32:34,050
In არსებობს კავშირების შემდგომი ამ.

553
00:32:34,050 --> 00:32:36,590
მე გირჩევთ ეს.

554
00:32:36,590 --> 00:32:39,460
მაგრამ რაც ჩვენ აინტერესებს
ამ პროექტორის ფუნქცია.

555
00:32:39,460 --> 00:32:41,210
მინდა გავლა, რომ.

556
00:32:41,210 --> 00:32:43,522
>> პირველ რიგში, ნება მომეცით გაჩვენოთ
თქვენ, რომ, დიახ, ჩვენ გვაქვს რუკაზე.

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

558
00:32:47,300 --> 00:32:49,970
რუკები ზემოთ.

559
00:32:49,970 --> 00:32:52,330
ასე რომ, მოდით შევხედოთ ამ
საწარმოო ფუნქცია.

560
00:32:52,330 --> 00:32:56,481
>> პროექტორის არის ძალიან
ისევე როგორც მასშტაბით, სასწორები ერთხელ.

561
00:32:56,481 --> 00:32:59,210
ასე რომ, რა წარმოების
ამ პროექტორის ფუნქცია

562
00:32:59,210 --> 00:33:06,610
არ არის, ჩვენ შეგვიძლია გაიაროს ეს გრძედის
და latitudes-- ამ შემთხვევაში,

563
00:33:06,610 --> 00:33:09,590
ამ ფასეულობების აქ
lat-longs შენობა

564
00:33:09,590 --> 00:33:13,990
ჩვენ ვზივართ მარჯვენა
ახლა პროექტორის.

565
00:33:13,990 --> 00:33:20,560
და პროექტირება იქნება კონვერტირება
რომ შევიდა x და y pixel ღირებულებებს.

566
00:33:20,560 --> 00:33:23,300
>> ასე რომ, რა პროექტირება აკეთებს
ძალიან ჰგავს ჩვენს მასშტაბით.

567
00:33:23,300 --> 00:33:27,270
ეს ხდება ჩვენი latitudes და
განედი რომელიც წარმოადგენს მთელ მსოფლიოში

568
00:33:27,270 --> 00:33:31,390
და მცირდება და sizing, რომ
ქვემოთ მოედანზე, რომ ჩვენ გვინდა,

569
00:33:31,390 --> 00:33:33,510
რომ ჩვენ მოცემული იგი.

570
00:33:33,510 --> 00:33:35,220
ამ შემთხვევაში, ჩვენ
გავლის ამ ღირებულებებს.

571
00:33:35,220 --> 00:33:41,370
და ის გვაძლევს, ისე, რომ
თქვენს ეკრანზე ნიშნავს 640 pixels.

572
00:33:41,370 --> 00:33:46,250
ეს მთელ ეკრანზე არის 700 pixels
ფართო, ასე რომ გვაიძულებს აქ,

573
00:33:46,250 --> 00:33:53,310
და 154 pixels ქვემოთ, რომელიც მე
ხარჯთაღრიცხვა არის საკმაოდ ბევრი აქ.

574
00:33:53,310 --> 00:33:57,250
>> ასე რომ, იმ lat-მიისწრაფვის, რომელიც
წარმოადგენს რაღაც მთელი მსოფლიოს მასშტაბით

575
00:33:57,250 --> 00:34:02,850
და squishing და მოძრავი, რომ გარშემო
მოგვცეს x და y pixel ღირებულებები,

576
00:34:02,850 --> 00:34:05,450
ეს არის პირველი რამ, რომ
გაკეთდეს ამ რუკების კოდი.

577
00:34:05,450 --> 00:34:07,920
და მერე დანარჩენი
კოდი მოიხმარს მონაცემები

578
00:34:07,920 --> 00:34:14,310
და შემდეგ რუკები იმ lat-longs
გადატანა რაღაც თქვენს ეკრანზე.

579
00:34:14,310 --> 00:34:18,380
>> მაგრამ ჩვენ ვაპირებთ, რათა გამოიყენონ ეს პროექტირება
ფუნქციები, რადგან აღმოჩნდება,

580
00:34:18,380 --> 00:34:20,270
ჩვენ გვაქვს lat-longs longs ასევე.

581
00:34:20,270 --> 00:34:24,509
ეძებს უკან ჩვენი მონაცემებით, ჩვენ გვაქვს
სიგანე და გრძედის კოორდინატების

582
00:34:24,509 --> 00:34:25,425
ყველა დაკვირვება.

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

584
00:34:28,131 --> 00:34:29,130
მოდით გამოვიყენოთ პროექტორის.

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

586
00:34:33,250 --> 00:34:37,639
>> ისე შევხედავთ ჩვენი ექსპოზიცია,
ჩვენ გვინდა, რომ ჩვენი exposition--

587
00:34:37,639 --> 00:34:39,590
ჩვენ გვაქვს გრძედი და განედი.

588
00:34:39,590 --> 00:34:40,770
მაგრამ ჩვენ გვინდა pixel ღირებულებებს.

589
00:34:40,770 --> 00:34:43,510
და აღმოჩნდება, ჩვენ გვაქვს ზუსტად
ის, რაც ჩვენ want-- პროექტორის.

590
00:34:43,510 --> 00:34:46,239
ძალიან ჰგავს ვიყავით
გამოყენებით მასშტაბის სწორედ აქ,

591
00:34:46,239 --> 00:34:52,075
ჩვენ ახლა აპირებს გამოიყენოს პროექტირება
და გაიაროს ეს კოორდინატები.

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

593
00:34:55,241 --> 00:34:56,949
ასე რომ, პირველ რიგში,
ჩვენ აკეთებს ასე რომ, ჩვენ

594
00:34:56,949 --> 00:35:01,520
მიღების d, რომელიც არის ინდივიდუალური მონაცემები
ელემენტის ინდივიდუალური მიწისძვრის

595
00:35:01,520 --> 00:35:02,370
კითხულობს.

596
00:35:02,370 --> 00:35:04,640
პირველი, რასაც ვაკეთებთ
არის კოორდინატები.

597
00:35:04,640 --> 00:35:06,150
ყველა უფლება, ჩვენ გვაქვს კოორდინატები.

598
00:35:06,150 --> 00:35:09,160
>> მეორე, რასაც ვაკეთებთ არის
გაიაროს, რომ პროექტორის.

599
00:35:09,160 --> 00:35:13,440
პროექტორის აკონვერტებს იმ კოორდინატები
შევიდა pixel ღირებულებები, x და y.

600
00:35:13,440 --> 00:35:16,680
და მაშინ ბოლო რამ ჩვენ
გსურთ გააკეთოთ უბრალოდ x,

601
00:35:16,680 --> 00:35:19,342
რომელიც ამ შემთხვევაში არის პირველი.

602
00:35:19,342 --> 00:35:22,050
ეს არის პირველი ორი რამ
რომ დაბრუნდა მიერ პროექტორის.

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

604
00:35:27,840 --> 00:35:29,630
>> ჩვენ ყველაფერს გავაკეთებთ იგივე y.

605
00:35:29,630 --> 00:35:34,960
მაგრამ ამის ნაცვლად, ჩვენ დაბრუნდება
მეორე ელემენტს, y.

606
00:35:34,960 --> 00:35:35,980
მისაღებად მზად ამოცნობა.

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

608
00:35:39,830 --> 00:35:46,450
Ooh, დამატებითი ხასიათი
აქ კარგია, რომ ჩვენ გვაქვს

609
00:35:46,450 --> 00:35:51,730
მონაცემთა ორიენტირებული დოკუმენტი, რომელიც არის
დამალვა ეს JSON ფაილი ობიექტების,

610
00:35:51,730 --> 00:35:57,560
მიღების რუკა, და შეცვლის
მიაკუთვნოს იმ მონაცემები

611
00:35:57,560 --> 00:35:59,600
პროექტის ეს რუკა.

612
00:35:59,600 --> 00:36:00,840
ეს არის მართლაც ძალიან საინტერესო.

613
00:36:00,840 --> 00:36:03,770
ეს არის მაგარი.

614
00:36:03,770 --> 00:36:05,640
>> ავიღოთ up მაღალი დონის.

615
00:36:05,640 --> 00:36:08,795
ვგულისხმობ, ჩვენ გვაქვს ორი ცალი
ინფორმაცია თითოეული მონაცემები წერტილი.

616
00:36:08,795 --> 00:36:10,000
ვგულისხმობ, სამი.

617
00:36:10,000 --> 00:36:12,540
ჩვენ გვაქვს კოორდინატები,
რომელიც არის x და y.

618
00:36:12,540 --> 00:36:15,700
და ჩვენ გვაქვს მასშტაბები.

619
00:36:15,700 --> 00:36:17,420
>> ჩვენ უნდა შეიცავდეს მასშტაბები რატომღაც.

620
00:36:17,420 --> 00:36:18,920
ჩვენ გვაქვს უამრავი არხები.

621
00:36:18,920 --> 00:36:20,370
ჩვენ შეგვიძლია გამოვიყენოთ ფერი.

622
00:36:20,370 --> 00:36:21,890
ჩვენ შეგვიძლია გამოვიყენოთ რადიუსში.

623
00:36:21,890 --> 00:36:23,040
ჩვენ შეგვიძლია გამოვიყენოთ ბუნდოვანება.

624
00:36:23,040 --> 00:36:25,540
ჩვენ შეგვიძლია გამოვიყენოთ ბევრი რამ კოდი.

625
00:36:25,540 --> 00:36:29,180
ნებისმიერი ამ ატრიბუტები და მრავალი
სხვა, რომლებიც არ არის ჩამოთვლილი იქ,

626
00:36:29,180 --> 00:36:33,065
იმიტომ, რომ ისინი სურვილისამებრ, ჩვენ შეგვიძლია
გამოიყენოთ შეიცავდეს ამ მონაცემების მიხედვით, ინსულტის

627
00:36:33,065 --> 00:36:35,670
და ეს ყველაფერი მე აღნიშნული.

628
00:36:35,670 --> 00:36:36,690
>> მოდით გავაკეთოთ რადიუსში.

629
00:36:36,690 --> 00:36:38,830
მე ვფიქრობ, რომ რადიუსი არის ყველაზე ინტუიტიური.

630
00:36:38,830 --> 00:36:46,210
ასე რომ კიდევ ერთხელ, ჩვენ ყველაფერს შეცვლის, რომ მძიმე კოდირებული
40 და გარკვეული გათვლები.

631
00:36:46,210 --> 00:36:48,810
ჩვენ ვიყენებთ ჩვენი საყვარელი მასშტაბის ერთხელ.

632
00:36:48,810 --> 00:36:50,290
და ჩვენ წარსულში დ.

633
00:36:50,290 --> 00:36:55,850
მაგრამ არ მინდა, რადგან ჩვენ გვინდა მასშტაბები
დ. d მხოლოდ მონაცემების წერტილი.

634
00:36:55,850 --> 00:36:57,430
ჩვენ გაივლის მასშტაბები მასშტაბით.

635
00:36:57,430 --> 00:36:58,470
>> მოდით ვეცადოთ, რომ კიდევ ერთხელ.

636
00:36:58,470 --> 00:37:00,230
Ooh, ეს არ იმუშავებს.

637
00:37:00,230 --> 00:37:02,940
რატომ არ მუშაობს?

638
00:37:02,940 --> 00:37:04,387
>> ასე მახსოვს, რა მასშტაბის აკეთებს.

639
00:37:04,387 --> 00:37:05,470
მოდით შევხედოთ მასშტაბის ერთხელ.

640
00:37:05,470 --> 00:37:10,800
მასშტაბის რუკების 1 დან 10 წლის
22 600-მდე მეტი ან ნაკლები.

641
00:37:10,800 --> 00:37:12,030
600 დიდია.

642
00:37:12,030 --> 00:37:14,730
სწორედ ამიტომ, ჩვენ ვიღებთ ეს.

643
00:37:14,730 --> 00:37:18,420
>> ასე რომ, ჩვენ გვინდა, რომ შეიცვალოს ჩვენი მასშტაბის
რაღაც უფრო გონივრული.

644
00:37:18,420 --> 00:37:22,610
ვთქვათ, ჩვენ გვინდა 0 60.

645
00:37:22,610 --> 00:37:25,340
60 არის დიდი, მაგრამ 10 მიწისძვრა
წარმოუდგენლად იშვიათი.

646
00:37:25,340 --> 00:37:27,880
ფაქტობრივად, ისინი არასდროს მომხდარა.

647
00:37:27,880 --> 00:37:31,830
>> ასე რომ, რა ამ ყველაფერს გააკეთებს, რომ თქვენ მიიღოს
ჩვენი მასშტაბები, რომ მიდის 1 დან 10

648
00:37:31,830 --> 00:37:34,490
და MAP- ის შესახებ, რომ გაფართოების გარეთ.

649
00:37:34,490 --> 00:37:37,370
და MAP- ის შესახებ, რომ 0 დან 60.

650
00:37:37,370 --> 00:37:38,840
მოდით ამოცნობა.

651
00:37:38,840 --> 00:37:41,850
>> ლამაზი, ჩვენ გვაქვს ვიზუალიზაცია.

652
00:37:41,850 --> 00:37:42,500
ეს არის დიდი.

653
00:37:42,500 --> 00:37:43,736
ეს არის ფაქტობრივი მონაცემები.

654
00:37:43,736 --> 00:37:46,360
თქვენ შეამჩნევთ, ჩემი პატარა სათამაშო
მაგალითად, ყველაზე დიდი მიწისძვრა

655
00:37:46,360 --> 00:37:49,417
არის სწორი თავზე us.

656
00:37:49,417 --> 00:37:50,000
მაგრამ ეს არის ის.

657
00:37:50,000 --> 00:37:54,422
ჩვენ გვყავს თარიღი ორიენტირებული ვიზუალიზაცია
რომ მოიხმარს მონაცემები

658
00:37:54,422 --> 00:37:56,255
და გვაძლევს ნამდვილად
საინტერესო ინფორმაცია.

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

660
00:38:02,600 --> 00:38:06,420
ჰო, მოდით დაამატოთ ზოგიერთი
interactivity მას.

661
00:38:06,420 --> 00:38:08,675
მე ვთქვი, რომ იყო
ძლიერი ძალის D3.

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

663
00:38:11,490 --> 00:38:15,060
>> ასე რომ, აქ, ყოველ ელემენტს, ჩვენ
აღწერს bunch ატრიბუტები.

664
00:38:15,060 --> 00:38:20,230
მაგრამ ჩვენ შეგვიძლია ასევე აღწერს, რაც ჩვენ გვინდა
უნდა მოხდეს interactivity ელემენტებს.

665
00:38:20,230 --> 00:38:26,190
მაგალითად, ჩვენ ვერ აღწერს
რა ხდება, როდესაც ჩვენ მაუსის მეტი.

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

667
00:38:28,740 --> 00:38:33,640
და ძალიან ჰგავს, რომ,
რომ მიიღოს ფუნქცია,

668
00:38:33,640 --> 00:38:36,700
ძალიან ჰგავს
ატრიბუტებს ჩვენ გვქონდა ადრე,

669
00:38:36,700 --> 00:38:44,650
სადაც ჩვენ გავაკეთებთ რაღაც
ელემენტს, როდესაც ჩვენ hover მას.

670
00:38:44,650 --> 00:38:47,100
>> ასე რომ, პირველი, რაც უნდა
გააკეთოთ აირჩიეთ ელემენტს,

671
00:38:47,100 --> 00:38:49,435
რათა იპოვოს ის, ძირითადად, ბრაუზერში.

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

673
00:38:57,090 --> 00:39:00,920
და მაშინ ჩვენ შეგვიძლია მითითებული
ატრიბუტი მას.

674
00:39:00,920 --> 00:39:06,870
ასე, რასაც მე ვაკეთებ აქ არის, როდესაც ჩვენ hover
მეტი რამე, ჩვენ კიდევ, რომ ელემენტს

675
00:39:06,870 --> 00:39:11,197
და შემდეგ მითითებული მისი ბუნდოვანება უკან
1, სრულიად გაუმჭვირვალე.

676
00:39:11,197 --> 00:39:12,488
ვნახოთ, რა, რომ ჰგავს.

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

678
00:39:29,430 --> 00:39:39,080
>> როგორც ჩანს, ჩვენ გვაქვს
დამატებითი მძიმით აქ.

679
00:39:39,080 --> 00:39:42,420
ასე რომ, თუ ჩვენ hover მეტი აქ, იგი იღებს სრულ.

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

681
00:39:46,530 --> 00:39:48,960
მაგრამ ახლა, რა თქმა უნდა,
რჩება სრული, იმიტომ, რომ ჩვენ

682
00:39:48,960 --> 00:39:53,240
უნდა აღწერს რა ხდება
როდესაც ამოიღონ ჩვენი კურსორი.

683
00:39:53,240 --> 00:39:59,990
მოდით გავაკეთოთ ზუსტად რომ
mouseout, როგორც ეწინააღმდეგებოდა mouseover.

684
00:39:59,990 --> 00:40:06,399
>> და ჩვენ აღადგინოთ იგი
რა გვქონდა ადრე 0.5.

685
00:40:06,399 --> 00:40:10,260
და ახლა, ყოველ ჯერზე ჩვენ
hover, მივიღებთ სრულ წრეზე.

686
00:40:10,260 --> 00:40:13,468
ის გვეხმარება, ჩვენ რა
ჩვენ შერჩევით არსებითად.

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

688
00:40:19,210 --> 00:40:22,860
>> და ახლა მოდით ეს ნამდვილად დიდი.

689
00:40:22,860 --> 00:40:26,210
მოდით, ამ რეალური მონაცემები.

690
00:40:26,210 --> 00:40:30,890
მოდით ვკითხოთ შეეძლო
USGS მათი მონაცემები.

691
00:40:30,890 --> 00:40:35,630
ასე რომ, აშშ-ს გეოლოგიური
აქვს მონაცემების შესახებ მიწისძვრები.

692
00:40:35,630 --> 00:40:41,460
მათ აქვთ საჯარო API რომ შეუძლია
მოხმარებული JSON ფორმატში.

693
00:40:41,460 --> 00:40:42,548
მოდით გავაკეთოთ, რომ.

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

695
00:40:49,730 --> 00:40:55,900
>> ასე რომ, ეს ცოტა კოდი რომ
აკავშირებს USGS API.

696
00:40:55,900 --> 00:40:57,990
და იქ ცოტა დამუშავება მას.

697
00:40:57,990 --> 00:41:02,200
ეს არ არის შესაბამისი, მაგრამ ამარტივებს ეს
რომ მარტივი მონაცემების ფორმატი მოსწონს ერთი

698
00:41:02,200 --> 00:41:03,800
ჩვენ გვქონდა ადრე.

699
00:41:03,800 --> 00:41:08,140
ასე რომ, მე მოშორება ჩვენი მოწოდება
ჩვენი ყალბი data.json ფაილი.

700
00:41:08,140 --> 00:41:13,110
და ამის ნაცვლად, მე მოუწოდებენ
USGS არსებითად.

701
00:41:13,110 --> 00:41:16,700
>> მოდით ამოცნობა, ლამაზი.

702
00:41:16,700 --> 00:41:21,260
ეს არის ფაქტობრივი, რეალურ ცხოვრებაში მონაცემები
ამ კვირაში მიწისძვრა.

703
00:41:21,260 --> 00:41:23,217
ეს არის მართლაც ძალიან საინტერესო.

704
00:41:23,217 --> 00:41:25,050
ეს გასაკვირი არ არის
ჩვენთვის, მაგრამ არსებობს

705
00:41:25,050 --> 00:41:27,909
ბევრი მიწისძვრები
West Coast კალიფორნიაში.

706
00:41:27,909 --> 00:41:30,950
მაგრამ ვფიქრობდი, რომ ეს იყო ძალიან საინტერესო
რომ იქ ამდენი მიწისძვრები

707
00:41:30,950 --> 00:41:34,350
Alaska, და, როგორც ჩანს,
აქ Midwest.

708
00:41:34,350 --> 00:41:37,630
ვგულისხმობ, საინტერესო და ჩვენ კარგი.

709
00:41:37,630 --> 00:41:40,410
ეს არის დასკვნა.

710
00:41:40,410 --> 00:41:43,760
>> მაგრამ ძირეულად ეს
არის ის, რაც D3 გვეხმარება.

711
00:41:43,760 --> 00:41:48,030
იგი გვეხმარება მიიღოს მონაცემები, სავალდებულოა
მას ელემენტების DOM,

712
00:41:48,030 --> 00:41:51,620
და იმ ელემენტების შეცვლა
როგორც ფუნქცია მონაცემები,

713
00:41:51,620 --> 00:41:54,780
აქვს იმ ატრიბუტები, ყველა
მრავალი ატრიბუტები ელემენტები,

714
00:41:54,780 --> 00:41:57,393
ყველა იყოს სასარგებლო არხები
გადმომეცა ინფორმაციას.

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

716
00:42:05,440 --> 00:42:09,290
>> D3 არის წარმოუდგენლად ძლიერი
ბიბლიოთეკა და საოცრად კარგად აწარმოებს.

717
00:42:09,290 --> 00:42:12,260
ეს არის რამდენიმე ძლიერი პერსონალი.

718
00:42:12,260 --> 00:42:15,960
მონაცემების ვიზუალიზაცია არის
წარმოუდგენლად ძლიერი ინსტრუმენტი

719
00:42:15,960 --> 00:42:21,530
გადმოცემის ხალხს ღრმა
insights რომ იღებს მათი ძირითადი

720
00:42:21,530 --> 00:42:25,430
და ეხმარება მათ გაგება,
ეს ღრმა და ინტუიციური გზა,

721
00:42:25,430 --> 00:42:29,760
რა მონაცემები მუშაობს და როგორ
მონაცემთა ცვლის ჩვენს ცხოვრებაში.

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