[Musika jotzen] 

DAVID Chouinard: naiz David Chouinard, eta hau D3 da. Ongi. Gaur egun D3 buruz ikasten goaz. D3 JavaScript esparru bat da kalitate handiko bat eraikitzeko Horrenbeste Bistaratzeak interaktiboa. Zer ari gara bezalako gauzak me back ikusita, horiek egiteko ikasten goaz Gauza da, oinarriak mota. Baina cool izango da. Dezagun Hasteko Nahiko irudiak egiteko. Lortu dugu demoak gehiago irtenbideak eskuragarri dauden. Egin dezagun. 

Act I, DOM manipulation-- goaz berehala hasteko gauzak cool eginez. Lehenik eta behin, ezker aldean, kodea behar dugu. Eskuinean, dugun gure kodea emaitza. Goazen horren bidez. 

Egin dezagun zirkulu bat. Nola soinu hori? svg.append circle-- zirkulu bat egin besterik ez dugu. Ez duzu uste me, ezta? Ez da han. 

Beraz, zer hementxe egin dugu, hau da, SVG SVG da. Hau da nabigatzaileak duen esango dugu da Nabigatzailean bektore grafikoak egiteko. Zer egin dugu besterik oraintxe zirkulu bat arakatzen gehitzen da. 

Promesa zirkulua dela Oinarrizko atributuak pixka bat behar du ezin dugu benetan aurretik ikusi. Kontatzeko bere x posizioa behar dugu, Bere y posizioa, bere erradioa. Ez dugu esango dela edozein, beraz, ez dugu ikusten ari oraintxe. Baina dezagun kontatu egiten stuff. 

Beraz, lehenik eta, lortu duzun Gure zirkulu izen bat emateko. Hargatik zirkulua deitu. Gure zirkulu izen bat dauka orain. Eta dezagun ematen atributu batzuk. Nola cx buruz x zentratzeko litzateke, beraz, x posizioa erdian. Demagun, 200 200 pixel da. 

Dezagun eman 200 pixeleko y baita. Eta I, erradioa, pixel 40. Orain ikus dezagun. Ezin dut ortografia. 

Bertan joan zaitezke. Posizio 200 zirkulu bat daukagu pixel, 200 pixel, 40 pixel erradioak. Kind of cool, ezta? Zirkulu bat daukagu. Bai. 

Beraz batera jarraitu behar ez. Adibide hauek guztiak, guztia Kodea gaur egiten ari naiz emango da online amaieran Adibide interaktiboa formularioa kontrolak dituzten ekintza guztietan, eta abar. 

Egin gauza gehiago utzi. Zirkulu beltz honek benetan itsusia da. Error dagoela sentitzen naiz mezuak bertan. Bertan dugu. 

Dezagun kolore bat ematen diote. Nola da hori? Gustatzen altzairuzko blue dut. Beno, gure zirkulu kolorea aldatu. Hori handia da. Dezagun erdi-gardena too-- erdi-gardena. 

Beraz, horiek atributuak dira zirkulua ari gara definituz. Lehenengo gauza egin genuen dago zirkulu bat jarri dugu orrian. Eta gero definitzeko ari gara atributu mordo bat. Horietako batzuk beharrezkoak dira, CX, CY, eta Erradioa bezala. Eta beste batzuk aukerakoak dira. 

Badira atributuak asko gehiago. Horietako asko. Adibidez, bat izan dugu trazua baita, gorria trazua. Baina utzi kendu egin dutela. Zirkulu bat, zirkulu urdin bat itzuli gara. 

Hargatik da zirkulu gehiago. Nola da hori? Egin dezagun zirkulua beste. Honek zirraragarria da, ezta? 

Beraz, esan besterik ez dut Kopia-itsatsi zer dagoeneko izan dugu. Dezagun deitu circle2. Eta egin zehatza utzi Gauza bera eta eman atributuak, x 300 posizio bat ematen. Yay, bi zirkulu ditugu orain. 

Eta, jakina, ezin izan dugu balio horiek eguneratu. Jarri dut ezin 400, eta orain dela mugitzen. Eta gogaikarriak geroztik, dezagun kendu, beraz circle2.remove. Desagertu da orain. 

Beraz, zer egiten ari gara eta besterik ez da, oso, hau very-- Oso zer duzu antzekoa da Baliteke jQuery egin, adibidez. Zu besterik manipulatzeko dugu DOM, deitzen. You aurretik hitz hori entzun izan liteke. Stuff sortzen ari gara, ezarpena Gauza on atributuak, gauzak kendu. 

Orain, hemen non interesgarri lortzen. Beraz geroago kodea, oraindik ezin izan dugu jatorrizko zirkulu hemen aipatzeko. Hargatik berrezartzeko bere atributu cx da. Demagun, bere x 400 ahulagoa. Eta ez dut trantsizio joan dela eta, beraz, begi-bistakoa da. Bertan dugu. 

Beraz zirkulu bat gehitu ditugu. Atributu batzuk ezarri ditugu. Zirkulu bat gehitu dugu kendu. Eta gero ari gara aldatzea jatorrizko zirkulua. 

Baina hemen non lortzen askoz ere gehiago interesgarri. Ez bakarrik atributuak daiteke ezarri dugu besterik balio gisa, esan dezakegu, beno, zirkulua, joan 200 kokatzeko. Ere ezarri ahal izango ditugu, funtzio gisa. 

Beraz emanez 400 ordez, hemen, kalkulu batzuk egin ahal izango dugu zer unean dugu Atributu hori nahi izan. Beraz, hau da, nola adierazi nahi duzuna. , Esaten dugu, horren ordez, 400, let me funtzio bat ematen duzu horren ordez. Eta hemen, funtzio honen barruan, Edozein ero kalkulua egin ahal izango dugu. 

Denbora hartu ahal izan dugu, eta Beste gauza batzuk begiratu eta dinamikoki erabaki zer balio nahi dugu zirkulua. Nola eman besterik ez dugu it ausazko x posizioa? Beraz, hori da. 

Beraz, zer esaten duen, zeren x guztietan, funtzio hau exekutatu. Eta zer egiten ari garen kalkulatzeko Gauza batzuk, ausazko aldiz zabalera eta hori itzuli. Beraz, korrika dugun bakoitzean, bat lortuko dugu ausazko leku batera doa zirkulua. Cool mota da. Itxura izan nuen sentitzen dut honetan pixka bat egiteko. To get hasten ari gara zerbait interesgarria hemen. Dezagun orain bultzatuta datu hau egiteko. Ez dago daturik hemen. Dezagun aldatu. 

Act II, Bultzatuta Documents-- Hargatik itzultzeko hemen. Eta utzi lortzeko besterik en circle2 kentzeko, besterik ez dugu gehituz eta kenduz ari delako da. Beraz, ez dugu benetan behar da. Asko gehiago clever izan behar dugu hemen. Demagun, daukagun Nolabaiteko datu batzuk. Une utzi One esan, Formulario honetako datuak izan genuen. Array bat izan dugu, besterik ez zenbaki-sorta bat. Zazpi zenbakiak ditugu hemen, edozein dela ere zenbatekoa irudikatzeko horiek pertsonen banku-kontu, nola hasi askoz, pisatzen dute auskalo zer. 

Hauek zenbakiak dira, eta gu Gure zirkulu erabili nahi zenbaki horiek nolabait adierazteko. Gure lotzeko nahi dugu Zenbaki horiek zirkuluak. Beraz, zer egiten dugun. Demagun, nahi dugun bat Zenbaki bakoitzean dagoen zirkulua. Zaharrean egin izan dugu Gauza doing-- ginen zirkulu append eta circle2 eta circle3. Honek, ordea aterako eskutik, eta logika errepikatuz asko. 

Hargatik gehiago horrekin clever. Var zirkulua erabiliz ordez svg.append besterik ginen erabiliz, erabiltzea goaz bloke txiki hau hemen. Ez dut sakoneko joan nahi zer sartu zati horiek guztiak egin. Eta gaia aurreratu bat mota da. Eta nahi dut. 

Baina funtsezko gauza recognize-- eta Ikusiko duzu, oso maiz D3 kodean. Oinarrizko testu-bloke hau zirkuluak asko sortzen datu elementu daude gisa array hau hemen ere. Beraz, hau sortzen askotan bezala zirkuluak ez bezala elementuak dira. Honez digu zazpi zirkulu sortzeko. Eta benetan, oso funtsezko gauza bat egiten du. Hargatik exekutatu en duten. Dezagun kendu gure beste zirkulua. Let duzu besterik ez egin parte out eta hau exekutatu berriro. 

Bertan dugu. Beraz, gure zirkulu hemen da asko ilunagoa, garelako zazpi zirkulu dute, bata bestearen gainean. Zazpi zirkulu, inork sortu besterik ez dugu datu elementu horietako bakoitzaren bakoitzeko. Baina bada hori gertatu funtsezko gauza bat da snippet hau hementxe batera. 

Datu hori zen loturik dago. Beraz bakar bat behin datu elementu horiek, 10, 45, 105, loturik izan zirkulu jakin bati. Beraz, horiek sortu ez bakarrik zirkuluak mordo bat baina bi gauza horiek lotzen elkarrekin. 

Eta etorkizunean, sortu dugulako D3 funtzio honekin zirkulu horiek, zuk zirkulu bat ematen badizut, ahal duzun ematen dit berarekin lotutako datuak. Beraz D3 eskatu ahal izango dugu. Hey, D3, zirkulu hori daukat. Zer da datu hori zirkulu ditu? Eta D3 kontatzen zigunez, 10 edo 45 edo 105. 

Gauza horiek lotuak dira. Hori oso, oso funtsezko kontzeptu bat da. Dezagun hartan. 

Beraz, modu beraz, eskatu genuen D3-- hau honetarako garrantzirik, baina besterik ez fidatzen me gainean. Hau da, D3 nola eskatu dugu. Hey, D3, emadazu lehenengoa zirkulu aurkitu ahal izango dituzu. Give me lehen zirkulu aurkitu dezakezu. Eta gero D3 eskatu izan dugu, zer da duten datuekin, hau bezalako, 10. 

Beraz, galdetu besterik ez dugu D3, aurkituko me Lehen zirkulu aurkitu dezakezu. Zein da bere datuak? 10, da, hain zuzen, gure Lehenengo datuak elementu. Galdetu izan dugu, beno, D3, gauden gure hirugarren zirkulua. 105. Zergatik da hau benetan garrantzitsua? 

Beraz, hementxe, aipatu dut funtzioak erabili izan dugula. Eta hori izan zen aipatu dut Gauza oso indartsua. Beraz, ez bakarrik daiteke gure funtzio egin gauzak bezalako konputazio batzuk egin dira, adibidez, ausazko zenbaki bat itzultzeko, ezin halaber oinarritutako datuen gauza egin. Hau da bultzatutako datuak dokumentuak zer esan. Horixe D3 nabarmentzen. 

Beraz, hau x postition-- ordez of besterik gabe, esaten zirkulu guztiak, lortuko x 200 posizioan, dugu funtzio bat eman daiteke. Eta hemen, kalkulu batzuk egin ahal izango dugu. eta d hemen datuak leku batean dago. Beraz, denbora asko dugu zirkulu bat, funtsean, D3 zazpi zirkulu horiek sortuko du. Eta gero bakoitzean dagoen 

zirkulua, nik joan hey joan,, circle1 zer zure x jarrera. Aurretik, izan ginen Beti 200 erantzunez. Baina orain, denbora D3 behin eskatu dio Gurekin zer da zure x posizioa, Honez digu emateko daukagun joan zirkulu hori, beraz, datuak behar dugu. Honez digu datuak eman eta esan, zer erakusketa izan nahi duzu, oinarritutako datuak horretan. 

Dezagun itzuli besterik ez benetako datuak. Beraz, hau exekutatzen badugu, honek ematen Gurekin datuak dokumentuak bultzatuta. Zirkulu horiek oinarritzen dira harremana position-- in bases datuen funtzio bezala ari dira. 

Beraz, lehen zirkulu baterako, D3 biribilean jartzen. Eta gero D3 eskatzen digu, zer egin erakusketa izan nahi duzu. Eta esan besterik ez dugu, datuak, edozein delarik ere. Egin erakusketa 10. 

Orduan galdetzen du, zer egin nahi duzu exposition, bigarren zirkulu izango da. Eta, erantzun dugu 45. Eta guk, jakina, ahal konputazio batzuk egin hemen. Aurkitu zirkulu horiek I Mota dira squished sortu. 

Beraz biderkatu 3, datu biderkatu 3. Gure zirkulu just got zabaldu out. Gure balio hirukoiztu egin da. 

Zirkulua ertzean benetan da, beraz dezagun agian motatako konpentsatzeko. Demagun, 20 murriztea. Hemen duzu joan. 

Honek datuak bistaratzea da. Oso oinarrizko bat da, baina hau ikuspegi batzuk gure datu ematen digu. Kontatzen digu, adibidez, guk elementu kluster txiki bat dute. Eta ernatze handi bat dugu hemen. Honek informazio batzuk ematen digu banaketari buruz. 

Bagenu, adibidez, aldatu 150 hemen eta freskatu datuak, Gure bistaratzea aldatzen denean. Dokumentu honek datuak bultzatuta. 

Jakina Beraz, elementu horiek guztiak, atributu horiek guztiak, hemen, Funtzio bat erabili ahal izango dugu, ez bakarrik zenbakiak, eta ez bakarrik x eta y posizioak. Beraz, funtzio bat erabili ahal izango dugu kolorea da. Beraz, gauza bera egin dugu. Emango dugu funtzio bat. 

Eta demagun, izan dugu Gure funtzioa ere baldintzazkoak. Funtzio honek izan daiteke ehun luze lerroak. Gauza oso, oso konplikatua egin ahal izango da. 

Hargatik jarri adierazpen izanez gero hemen. Demagun, gure datu da gutxiago bada 50 baino atalase batzuk interesa Oraindik dugu arrazoi batzuk ere. Dezagun berdea. Bestela, dezagun gorria. Nola da hori? Nice. 

Beraz, gure datuak bistaratzea hasita Informazio gehiago interesgarria helarazi kanal askotan. Beraz, gaur egun ezagutzen dugun pixka bat banaketari buruz. Eta badakigu ez dagoela nolabaiteko moztu 50a interesatzen zaiguna at. Badakigu ez dagoela, datuak bi puntu daude Muga hori azpian, eta horietako gehienak gainetik. 

Azken urratsa bezala Beraz, datu hau hemen, Oso arraroa da hori bezalakoa ikusteko. Hargatik mugitu besterik ez dira aldagai bati garbitzailea dira, hau bezalako delako. Eta gero, aldagai hori erabili dugu hemen. Zehatza gauza bera da. Bit garbiago bat besterik ez da. 

Hurrengo sortu, Act III, Scales-- Beraz, arazo bat eskuinera hemen, aldatu dugu gure 200 balioa honetako datuak hori aldatzeko badugu 400 edo zerbait, eta freskatzeko, ondoren, balio hau besterik joan pantailaz kanpo ezartzea. Beraz, hementxe gure logika how egiten dugu aldiz 3 eta 20, zabaldu eta gero desplazamendu pixka bat benetan clunky da. 

Zer esan nahi dute zenbaki horiek? Zu besterik hard ez kodetuak dituzte. Eta ari oso datuei lotuta. Datu bultzatuta dokumentu bat nahi dugu. Dokumentu oso malgua nahi dugu, Emandako datu hori, hura egokitzen da eta irudikatzen ditu. 

Zer funtsean behar dugu, dugu 10 zenbaki sorta hau. 45, 105. Eta hori mapatzeko out kalera nahi dugu zabalera, zabalera osoa hemen. Beraz sorta daukagu Zenbakiak 0tik 100era doa. Eta campus dut hau desagertu egin behar dugu 20 eta 700 dira, kasu honetan. 

Nolako dagoela mapan nahi dugu. Hori eskalatzeko sortu nahi dugu, eta orduan offset pixka bat. Bihurtzen da D3 ditu horiek. Honez eskalan izeneko. Hargatik da erabili. 

Modu noa works-- dagoela mota hau eta gero azaldu. Hau eskala bat da. Zer egingo da, egindako mapa egingo da to 20 600. orrian 1etik 200 baloreak. Dela egiaztatu ahal izango dugu. Hemen ikusi ahal izango dugu. 

Beraz dut elikatzeko bada 1-- une bat. Give me bigarren bat. I gaizki idatzi behar da. Bertan joan zaitezke. Horri buruz sentitzen dut. 

Beraz, zer eskala bat egingo da, balio bat hartuko du eta, ondoren, bihurtu dela, zabaltzeko out, beraz, gama osoa duzu galdetzen ari betetzen. Beraz, kasu honetan, bat eman badugu, Dela mapatzeko out 20 aldera joan. Eta utzi egiten diogu bada 200, da duten Mapan 600 joan. Eta nonbait artean, lortuko dugu 100 bada, da nonbait izango da 20 eta 600 artean. 

Eta, jakina, gaur egun, hau da, zer kodifikatu gogor horiek kentzeko behar dugu dugula gauzak bertan. Beraz, zer egin nahi dugun da datu hori gaude hartu eman, banako datu horiek elementu, eta pasa lehenengo eskalatzeko. Beraz eskala eskalatzean da. 

Well-- Oh, error apur bat behar dugu hemen. Datuak falta ari gara. Bertan joan zaitezke. Eta hori zabaltzen da out. 

Hori ematen digu bera Emaitza aurretik izan genuen, baina horiek izan beharrean gogor kodetuta mugak. Eta baldin tamaina gure mihise aldaketak, adibidez, baino gehiago hau izan nahi badugu 400 pixel eta egindako squishes da, berau izan dezakegu over-- zabaltzeko aukera izango dugu, edo guk ezker marjina hori murriztu daiteke zerbait gutxiago edo 20 baino gehiago. Zenbaki hauek, hauek gogor kodetuta Zenbaki orain zentzurik gurekin. 

Eta askoz gehiago egin genezake Gauza interesgarri baita. Beraz lineala izan beharrean eskala, baliteke eskalan Saioa hasi nahi dugu. Eta horrek emango digu log eskalan. 

Beraz, gaur egun, gure eskala, ordez besterik sorta hori egindako zabalduz, gauzak sofistikatuagoa egiten ari da. Sorta honetan gogor izan beharrean kodetuta, eta horren ordez 600 duten beharrean, agian besterik zabalera erabili nahi dugu, beraz 20tik zabalera ken 40, 2 aldiz, beste aldean marjina. Eta horrek askoz gehiago zentzurik egiten norbaiti agian nork begiratu kodea. 

Interesgarria, eskalak zaitez Oso, oso sofistikatua baita. Gauza interesgarri asko egin dute. Beraz eskalak ez du zertan funtziona ahal besterik zenbakiekin. Egin dezagun kolore eskalan. 

Beraz, gure gama jolasten liteke gure domeinu 1 200 da. Hori da sarrera gauza da. Baina agian mapatzeko nahi dugu gorria berdea, adibidez. Eta orain, 1 pasatzen badugu, berdea lortzeko goaz. Utzi egiten diogu bada 200, gorria lortu dugu. Eta gainditzeko dugun zerbait bada tartean, Dela nahasketa batzuk izango, nonbait gradientearen on berdea eta gorria artean. 

Eta beharrik ordez clunky logika mota honetan hemen batera dugu bertan baldintzapeko, izan dugu zerbait a horien arteko eskala lineala. Beraz eskala erabili genuen besterik ez dugu sortu, zein kolore deitzen dugu. Eta litzaidake utzi egiten diogu D, Gure datu elementu da. Eta ez dugu joan. Kolore-eskala bat daukagu. 

Beraz, hau mapping da. Beraz, orain arte ezker erabat berdea da. Eskuineko erabat gorria da. Eta arteko guztia d funtzio bat da. Interesgarri bat daukagu Bistaratzeak hemen. Baina gure datu aspergarria mota zen. Ea zer egin genezake Utzi Datu interesgarri gehiago izan genuen. 

Act IV, Working With Lehenengo gauza Data-- egiteko egin nahi dugu gure bistaratzea interesgarriagoa da, datuak beste nonbait mugitzeko. Oso clunky izan behar Datu hemen gogor kodetuta. Eta, oro har, eskatu egingo dugu Norbait datuak beste. Egingo, agian, Gobernuak eskatuz dugu errolda Bureau, zer da zure datu da eta, ondoren, grafika edo galdetuz hirugarrenen datu batzuk entitate batzuk eta, ondoren, bat eraikitzen bistaratzea horretan. 

Beraz, lehenengo gauza egin nahi dugu da mugitzen diren beste nonbait. Beraz, ez dut bat sortu nahi du fitxategi data.json hemen izeneko. JSON formatu estandarra da. Ez daukazu ezagutzen asko gai izateko. Eta ari gara kopiatu joan Datu gutxi dugu hor, itsatsi ez hitzez hitz, joan Gure bistaratzea kodea itzuli hemen, eta erabili funtzio hau hemen. Ez daukazu xehetasunak ezagutzeko. Baina, zer da hau egingo da, fitxategi hori aurkitu ahal izango da, eskuratu du, eta itzultzeko gurekin. Beraz, hau ez da, doan eta data.json fitxategia atera. Eta gero, kode guztiek hori da koska Inside funtsean, Kodea guztiak ditugu han izango exekutatu bakarrik datuak lortuko dugu atzera. Eta gero, hori exekutatu joan datuen ditugu kodea. Great, hemengo a bistaratzea kontsulta kodea batzuk nonbait bestela, ohi da nondik datu batzuk kontsulten da nonbait, normalean Bistaratzeak nola funtzionatzen. 

Baina atzera joan datuen nahi dut. Beraz, datu funtsean D3-- D3 in Datu gauzen zerrenda bat da kontsumitzen. D3 espero du, datuak besterik ez zerrenda bat izan gauza, gauza array bat. Ez du axola zer gauza horiek dira, beraz, betiere horietako array bat bezala. 

Beraz, hemen, adibidez, ezin izan dugu Jakina koma mugikorreko balio dute. Negatiboak izan dugu. D3 ez du axola, hain luze gauzak zerrenda bat gisa. 

Gauza bezala interesgarria dugu ezin dute, gainera, ezin dugu horrelako kate-zerrenda bat dute. Beraz, hauek dira Crimson titularrak Duela egun batzuk jaso dut. Eta, agian interesgarri batzuk aurkitu ahal izango duzu titularrak a horiei buruz gauza. 

Beraz, berriro ere, gauzen zerrenda bat da. D3 ez zaintzeko. Horiek gertatuko kate bat izan behar du. Gure datuak aldatu dugu. 

Dezagun itzuli gure bistaratzea da. Orain, gure bistaratzea espero du sarrera zenbakiak izan. Beraz, behar joan aldaketa batzuk egiteko. Beraz, adibidez, lehenik eta behin, agian, zirkulu horiek jartzea batera nahi dugu titular luzerak, du titular karaktere kopurua. 

Beraz, zer egin is-- egingo dugun bakoitzean gure funtzioa da kate bat deitu, aurkituko dugu luzera da Eta gero pasatzen duten eskala. Kolorea, itzuliko naiz altzairu urdin dagoela. Eta ez dugu joan. Bisualizazio bat daukagu of Crimson titularrak. 

Gure eskala pixka off bat da. Demagun luzeena horren titular da 100 karaktere luze, beraz, gehiago hartzen duen out apur bat. Eta bistaratzea bat behar dugu. Beraz titularrak gehienak badirudi nahiko hurbil daude elkarrekin, pertsonaia line dagokionez. Baina inork ez benetan nabarmentzen da. 

Tresna batzuk eraiki ahal dugu gehiago dagoela arakatzeko. Baina hau lantzen ari nintzen, izan nintzen Bitxia ala ez, datu multzo honetan, puntuz titularrak haietan luzeagoa izango litzateke. Bere gain hartzen dute nuke. 

Hargatik begiratu. Dezagun erabili kolorea kanal aurretik egin genuen bezala, batzuk ala kodetzeko ez puntuz edo ez. Beraz, berriro erabili baldintzatu bat egingo dugu. Ez daukazu jakitea horren xehetasunak, baina hau da, nola egiaztatu dugu pertsonaia jakin baten kate JavaScript, berriro ere, ez da garrantzitsua. 

Baina ez badugu ez da aurkitu colon, berdea itzuli dugu. Eta ez badugu, gorria itzuli dugu. Beraz, berriro ere, titularrak dute bi puntu gorria izango da. Hau da hau zer esan nahi du polita. 

Beraz, badirudi nire Hipotesi gehitzen denean. Ez da bi bakarrik. Sei datuak puntu bakarra daukagu eta bi bakarrik izan puntuz. Baina pixka bat gehiago badirudi beheko muturrean, hain zuzen ere. Bi punturen batekin Azalean diruditen oro har izan laburragoa, gure datuak, gutxienez interesgarria set--. 

Demagun itzuliko en horretara altzairu urdin eta gero ikusiko zer are batera egin ahal izango dugu Datu interesgarri gehiago. Beraz, berriro ere, aipatu ditudan D3-en datuak gauzak zerrenda bat da. Mota asko zenbakiak ikusi dugu. Kateak ikusi dugu. Baina gauzak objektu ere izan daiteke. 

Gauza konplikatua izan daitezke Gauza asko artean, besteak beste. Argiago To dagoela esatea, Kasu gehienetan, dugu Datu puntu guztietan bezala eraiki nahi balio bakar bat baino gehiago zaila. Zuk bat imajinatu litzaidake bada ikasleek buruzko datu-basea, ez dago ikasle bat izan liteke izena, ikaslearen ID bat, eta gauza asko lotutako erregistro jakin batekin, ez soilik kate bat edo zenbaki bat. Hargatik begiratu hartan. 

Honek ezarri datu horietako bat da. Hau lurrikarak buruz ezarri datu bat da. Beraz, dena hemen gure zerrenda edo array on gauza gauza asko bera dauka. Beraz, datu puntu guztietan bat du magnitude eta koordinatzeko. Eta koordinatzen beraiek Bi gauza hauek. 

Beraz, egunero da gaur egun askoz gehiago konplexua eta askoz ere gehiago interesgarri eta dauka askoz gehiago Informazio interesgarria. Ea hori kanpo eraiki izan dugu dezagun. Hemen itzuli zenean, berriz ere, erabiliz Gure histograma zirkulu bisualizazio eraiki dugu, ikus dezagun bat eraikiko dugu bada magnitude banaketa bistaratzea Gure datu-sorta batean. 

Beraz, hemen, kontzeptua bera da. Baina orain, d gauza gehiago dauka. d datuak elementu asko dauka. Beraz, atzera d lortuko dugu. D3 d ematen digu. Eta magnitude aurkitzeko arabera erantzungo dizugu d eta, ondoren, pasatzen eskala diruditen. 

Eta gero, aldatu behar dugu gure eskalan, noski. Beraz magnitude besterik ez, Askoz 10 baino gehiago joan. Egia esan, ez da inoiz 10 magnitude lurrikara bat. Baina hori da gure goi-mota end, gure goiko espektro. 

Dezagun freskatzeko. Nice, bistaratzea bat behar dugu. Interesgarria da, beraz, note-- ra Datu bi puntu daude dagoela ia zehazki bakoitzaren gainean beste, magnitude dagokionez. Hau ikusten duzu opakotasuna erabiltzen ari gara arabera. 

Datu geografikoak daukagu ​​orain. Latitude eta longitude daukagu. Agian zerbait bat egin genezake Asko gehiago horrekin interesgarria. Let batzuk gehiago aurkitu en ikusteko modu interesgarri hau zailagoa datuen sarbidea dugu. 

Act V, Mapping-- funtsean, horiek jartzea mapa batean nahi dugu. Esan nahi dut, hau da, non honetan egingo da. Buruzko informazioa kodetu nahi dugu lurrikararen irakurketak hauen jarrera, baita beren magnitude, orain dugula delako. Nola kontsumitzen ulertzen dugu Datu zailagoa da. 

Egin dugu lehenengo gauza da Mapa batean, hondoko mapa bat sortzeko. To bidez joan naiz hau oso azkar. Hau delikatua kodea da. It beste horietako bat da errezeta ez duzu benetan guztiz ulertzeko erabiltzea zuretzat izan. Baina hau da kodea. Kode hau hementxe mapa bat sortzen du. 

Ez dugu xehetasunez joango gara. Baina azaletik, zer egiten da, us.json fitxategi hau, kontsulta eta horrek bezalako fitxategi bat da inork baino lehenago izan genuen. It konplexuagoa, jakina da. Baina kasu honetan, dena, Datu puntu guztietan egoera honetan dagoen eta zerrenda bat du latitude eta longitude definitzen duten poligono, inprimaki hori, egoera horretan. 

Beraz D3 zer egingo antzekoa da aurretik egiten genituen. Hori eskatzeko aukera izango da eta lotu duten elementu bat. Eta ez dago funtzio bat dela elementu hori mapa egingo out, oinarritutako latitude eta longitude orrian. Horretan gehiago irakurri ahal izango duzu. Eta hori gomendatzen dut. 

Badira agertzen diren estekak Kode honen amaieran argitaratua. Eta kode komentatzen da. Daude gehiagorako estekak honetan. Begiratu nahi izanez gero, gomendatzen dut. Baina, zer axola dugun buruz proiekzio funtzio hori. Nahi duten bidez joan nahi dut. 

Lehenik eta behin, utzi niri erakusteko duzu, bai, mapa bat behar dugu. Maps cool dira. Hargatik begiratu honetan ekoizpen-funtzioa. 

Proiekzioa oso da eskalan bezala, berriro eskalak. Beraz, zer ekoizpenerako proiekzio funtzio honetan ez da, longitude gainditu ahal izan genuen eta kasu honetan latitudes--, balio horiek hemen Eraikinaren lat-Longs egokian ari gara eserita proiekzioa, orain. Eta proiekzioa bihurtuko du x eta y pixel balioak sartu. 

Beraz, zer proiekzio egiten ari da Oso gure eskala antzekoa da. Gure latitudeetan ari da eta longitude duten mundu osoan bat adierazten eta gutxitu eta hori Kalkulatzen nahi dugun plazara behera, Nik dugun zor baitie. Kasu honetan, ez gara balio horiek pasatuz. Eta emanez digu, bai, hori Pantailan 640 pixel esan nahi du. Pantaila osoa hau 700 pixel da zabal, beraz, hemen buruz egiten gaitu, eta 154 pixel behera, eta horrek Nuke estimazioa da, nahiko askoz hemen. 

Beraz, horiek lat-Longs hartuz bertan Zerbait mundu osoan ordezkatzen eta squishing eta inguruan mugitzen Gurekin x eta y pixel balioak emateko, hori da lehenengo gauza da mapping kode hau egin. Eta gero, gainerako kodea datuak kontsumitzen eta, ondoren, horiek lat-Longs mapak Zerbait zure pantailan kalera. 

Baina ari gara proiekzio hau erabili joan funtzioak, bihurtzen da delako lat-Longs Longs ditugu, baita. Atzera begira, gure datu berean, behar dugu latitude eta longitude koordenatuak Behaketa egilea da. Hargatik proiekzioa erabili. 

Beraz, gure exposition begira, Gure exposition-- nahi dugu latitude eta longitude bat behar dugu. Baina pixel balioak nahi dugu. Eta bihurtzen da, zehazki daukagu proiekzio zer want-- dugu. Ginen oso gustuko eskala erabiliz hementxe, ari gara orain proiekzioa erabili joan eta pasa koordinatzen. Beraz, lehenengo gauza beraz, egiten ari garen gara lortzean d, zein banakako datu bat da Banakako lurrikara baten elementu irakurketa. Lehenengo gauza egin dugu da koordenatuak lortzeko. Guztiak eskubidea, koordenatuak behar dugu. 

Bigarren gauza egiten dugu pasatzen duten proiekzioa orrian. Proiekzioa koordenatu horiek bihurtzen pixel balioak, x eta y sartu. Eta gero, azken gauza ditugu egin besterik ez da x lortu nahi, eta kasu honetan lehenengoa da. Da bi gauza lehenengoa diren proiekzio by itzuli. 

Gauza bera egin beharko dugu y da. Baina horren ordez, itzuliko dugu Bigarren elementua, y. Talde freskatzeko prest. Ooh, pertsonaia gehigarria hemen polita, izan dugu Datu bultzatuta dokumentu bat hori da, JSON objektuen fitxategi hau ezkutatzen, mapa bat egiteko, eta aldatuz aldean egozten datuen it proiektatzeko mapa batean. Hau da, benetan interesgarria. Hau da cool. 

Dezagun da Notch bat. Esan nahi dut, bi pieza daukagu Datu puntu guztietan batzuekin informazioa. Esan nahi dut, hiru. Koordenadak daukagu, bertan x eta y da. Eta magnitude daukagu. 

Magnitude kodetzeko nolabait behar dugu. Kanal asko daukagu. Kolore erabili ahal izango ditugu. Radius erabili ahal izango ditugu. Opakutasun erabili izan dugu. Gauza asko erabili izan dugu kodean. Atributu horiek eta beste asko Edozein gehiago ez diren ez dago zerrendan, hautazkoa delako, ezin izan dugu Datu hau kodetzeko erabili, trazua eta gauza horiek guztiak aipatu dut. 

Egin erradioak dezagun. Uste dut erradioa intuitiboena da. Beraz, berriro ere, ordezkatu egingo dugun hard-kodetuak 40 eta egiteko kalkulu batzuk. Gure eskalan gogokoena berriro erabiliko dugu. Eta Oraindik d iragan dugu. Baina ez d magnitude nahi dugulako d. d bakarrik datuak puntua da. Gainditu dugu magnitude eskalatzeko. 

Duten Dezagun saiatu berriro. Ooh, ez du lan. Zergatik ez du lan? 

Beraz, gogoratu zer eskala egiten du. Dezagun eskala berriro. Eskalatu mapak 1etik 10era 22 600 izateko, gehiago edo gutxiago. 600 izugarria da. Horregatik ari honek lortzean dugu. 

Beraz, gure eskala aldatu nahi dugu zerbait gehiago arrazoizkoa da. Demagun, 0, nahi dugu eta 60. 60 handia da, baina 10 lurrikarak izugarri arraroak dira. Izan ere, inoiz ez dute gertatu. 

Beraz, hau izango da zer da, hartuko da duten 1etik 10era doa gure magnitude eta mapa gainean zabaltzeko egindako izateko. Eta mapa gainean 0 eta 60. Dezagun freskatzeko. 

Nice, bistaratzea bat behar dugu. Hau handia da. Hau benetako datuak dira. Nabarituko duzu, nire jostailu txiki batean Adibidez, lurrikara handienak eskuineko Gurekin gainean da. Baina hori da. Data bultzatuta bistaratzea daukagu duten datuak kontsumitzen eta benetan ematen digu Informazio interesgarria. Bai, dezagun gehitu batzuk bertara interaktibitatea. Hori izan zen aipatu dut D3 indar handia dutelako. 

Beraz, hemen, elementu guztietan, ez gara atributu sorta bat deskribatzeko. Baina, era berean, deskribatu ahal izango dugu zer nahi dugun den elkarreragina elementuekin gertatuko. Adibidez, esatean, zer gertatzen sagua dugun baino gehiago denean. Eta oso antzekoa da, duten funtzio bat hartuko, Oso antzekoa egozten aurretik izan genuen, non zerbait egiten dugu izateko elementu denean haren gainetik pasatzean dugu. 

Beraz, lehenengo gauza egin behar dugu Egin elementu hori hautatu da, Funtsean aurkitzeko, nabigatzailean. eta, ondoren, ezin izan dugu da atributu bat. Beraz, zer egiten ari naiz hemen, denean pasatzean dugu Zerbait baino gehiago, elementu hori lortu dugu eta, ondoren, bere opakutasuna ezartzeko itzuli 1, erabat opakoa da. Ea zer itxura dezagun. 

Bat dugu dirudielako extra puntu eta koma hemen. Beraz, hemen baino gehiago pasatzean badugu, osoa lortzen da. Baina orain, jakina, egonaldiak osoa, garelako zer gertatzen den deskribatzeko dute denean gure kurtsorea kendu. Beraz, egin zehazki horretan utzi mouseout, gisa aurka sagua gainetik pasatzean. 

Eta berrezarri egingo dugu zer izan aurretik 0.5 ditugu. Eta, orain, denbora dugu behin pasatzean, zirkulu osoa bat lortuko dugu. Zer ikusten laguntzen digu ditugu funtsean hautatzen ari gara. 

Eta orain dezagun hau benetan handia. Dezagun hau Datu errealetan. Hargatik eskatu ahal Bere datuak buruz USGS. Beraz, AEBetako Geologia Zerbitzuak lurrikarak buruzko datuak ditu. API publiko bat da, gai izan behar dute JSON formatuan kontsumitu behar da. Beraz, utzi egin dela. 

Hau Beraz, kode pixka bat da hori USGS API konektatzen. Eta han prozesatzeko pixka bat gainean dago. Hau ez da garrantzitsua, baina sinplifikatu datu formatu sinple bat, bat bezala aurretik izan genuen. Beraz, gure dei kentzeko I ra Gure fitxategi data.json faltsuak. Eta horren ordez, deitzen naiz USGS funtsean. 

Dezagun freskatu, polita. Hau da benetako, benetako datuak dira Aste honetan lurrikarak from. Hau da, benetan interesgarria. Hau ez da harritzekoa guretzat, baina badaude on lurrikarak asko Mendebaldeko kostaldea Kalifornian. Baina oso interesgarria izan zen pentsatu nuen ez dagoela lurrikarak hainbeste izan ziren Alaska, eta, antza denez, Hemen Midwest en. Esan nahi dut, interesgarria, eta onak ditugu. Hori ondorioa da. 

Baina, funtsean, hau da D3 zer egiten digu laguntzen. Datu hartzeko laguntzen digu, bind DOM elementu da, eta elementu horiek aldatu datuen funtzio bezala, atributuak, guztiak horiek elementuak atributu asko, guztiak izan kanal baliagarria informazioa emateko. 

D3 da oso indartsu bat liburutegia eta amazingly ondo exekutatu. Hau gauza indartsu batzuk. Datuak bistaratzea da tresna oso indartsua Jende sakona transmititzeko dela bere core lortzen Insights laguntzen, ulertzen haietan modu sakon eta intuitibo honetan, Datu lanak nola eta nola Datu gure bizitza aldatzen.