[Jwe mizik] DAVID Chouinard: Mwen David Chouinard, e sa se D3. Byenveni. Nou pral aprann sou D3 jodi a. D3 se yon fondasyon JavaScript pou bati yon bon jan kalite segondè vizuèl entèaktif pou entènèt la. Bagay sa yo tankou sa ki nou ap wè nan tounen nan m ', nou ap ale nan aprann fè moun bagay sa yo, kalite Basics yo nan li. Men, li k ap pase yo dwe fre. Se pou yo jwenn te kòmanse fè bèl foto. Nou te gen plis Demonstrasyon de kandida ki disponib. Se pou yo fè li. Lwa I, Dom manipulation-- nou ap ale yo kòmanse touswit fè bagay sa yo fre. Premye a tout, sou bò gòch la, nou gen kòd. Sou bò dwat la, nou gen rezilta a nan Kòd nou an. Se pou yo ale nan li. Se pou yo fè yon sèk. Ki jan fè sa son? svg.append circle-- nou jis te fè yon sèk. Ou pa kwè m ', dwa? Li nan pa la. Se konsa, sa nou te fè isit la se, SVG se grafik vektè évolutive. Sa a se yon fason a nou di navigatè a fè grafik vektè nan navigatè a. Ki sa nou jis te fè kounye a se ajoute yon sèk nan browse. Pwomès la se ke sèk la mande pou yon ti jan nan atribi debaz anvan nou ka aktyèlman wè li. Nou bezwen di li pozisyon x li yo, pozisyon y li yo, reyon li yo. Nou pa t 'di li nenpòt nan sa, se konsa nou pa ap wè li kounye a. Men, kite a di li bagay. Se konsa, premye a tout moun, ou te gen bay sèk nou an yon non. Se konsa, kite a rele l 'sèk. Sèk nou an gen yon non kounye a. Li kite yo ba li yon atribi kèk. Kouman sou cx ta santre x, se konsa sant la nan pozisyon an x. Se pou nou di, 200 pou 200 piksèl. Se pou yo bay li yon y nan 200 piksèl kòm byen. Ak yon r, yon reyon, nan sou 40 piksèl. Koulye a, kite a wè. Mwen pa ka eple. Gen ou ale. Nou gen yon sèk nan pozisyon 200 piksèl, 200 piksèl, reyon 40 piksèl. Kalite fre, dwa? Nou gen yon sèk. Yeah. Se konsa, pa gen okenn bezwen yo swiv ansanm. Tout egzanp sa yo, nan tout kòd la m ap fè jodi a yo pral bay sou entènèt la nan fen a nan fòm lan nan egzanp entèaktif ak baraj nan chak aksyon, ak sou sa. Se pou yo fè plis bagay. Sa a ti sèk nwa se reyèlman lèd. Mwen regrèt pou sa erè mesaj la a. Gen nou ale. Se pou yo bay li yon koulè. Ki jan nan sa? Mwen renmen asye ble. Oke, sèk nou an chanje koulè. Sa a gwo. Se pou yo fè l 'semi-transparan too-- semi-transparan. Se konsa, sa yo, se atribi nou ap defini sou sèk la. Premye bagay nou te fè se nou mete yon sèk sou paj la. Lè sa a, nou ap defini yon pakèt moun sou atribi. Gen kèk nan sa yo gen obligasyon, tankou CX, CY, ak reyon. Ak lòt moun yo si ou vle. Gen yon anpil plis atribi. Genyen yon anpil nan yo. Pou egzanp, nou te kapab gen yon konjesyon serebral kòm byen, yon konjesyon serebral nan wouj. Men, kite a retire sa. Nou ap tounen nan yon sèk, yon sèk ble. Se konsa, kite a fè plis ti sèk. Ki jan nan sa? Se pou yo fè yon lòt sèk. Sa a se enteresan, dwa? Se konsa, di mwen jis Kopi-Kopye ki sa nou te deja. Se pou nou rele li circle2. Li kite yo fè egzak la menm bagay ak ba li atribi, yo bay yon pozisyon x nan 300. Yay, nou gen de ti sèk kounye a. Ak nan kou, nou te kapab aktyalizasyon valè sa yo. Mwen te kapab mete l 'nan 400, epi kounye a li deplase. E depi li nan anmèdan, se pou yo retire li, se konsa circle2.remove. Li nan ale kounye a. Se konsa, sa n ap fè ak se jis trè, very-- sa a se sanble anpil ak sa ou ta ka fè nan jQuery, pou egzanp. Nou jis ap manipile Dom a, sa yo rele. Ou ta ka te tande mo sa a anvan. Nou ap kreye bagay, mete atribi figi sou bagay, retire bagay. Koulye a, isit la nan kote li vin enteresan. Se konsa, pita nan kòd la, nou te kapab toujou al gade nan sèk la orijinal isit la. Se konsa, kite a Reyajiste atribi li nan CX. Se pou nou di, pozisyon li nan x 400. Men, mwen pral fè tranzisyon ki, se konsa li evidan. Gen nou ale. Se konsa, nou te ajoute yon sèk. Nou mete kèk atribi. Nou te ajoute yon lòt sèk, retire li. Lè sa a, nou ap chanje sèk la orijinal la. Men, isit la nan kote li vin yon anpil plis enteresan. Se pa sèlman nou ka mete atribi kòm jis valè, nou ka di, hey, ti sèk, ale nan pozisyon 200. Nou kapab tou mete yo kòm fonksyon. Se konsa, olye pou yo bay 400 isit la, nou ka fè kèk kalkil sou vole a pou ki sa nou vle ke atribi yo dwe. Se konsa, sa a se ki jan ou ta eksprime sa. Nou di, olye pou yo 400, kite m ' ba ou yon fonksyon olye. Ak isit la, andedan sa a fonksyon, nou ka fè okenn kalkil fou. Nou te ka pran tan an ak gade nan kèk lòt bagay ak dynamique deside pou sèk la sa ki valè nou vle. Kouman sou nou jis bay li yon x pozisyon o aza? Se konsa, sa a, se sa. Se konsa, sa ki di se, pou chak x, kouri fonksyon sa a. Ak sa ki nou ap fè se kalkile kèk bagay, yon fwa o aza lajè a epi retounen sa. Se konsa, chak fwa nou kouri sa, nou jwenn yon sèk ki ale nan yon kote ki o aza. Li nan kalite fre. Mwen santi mwen tankou mwen te kapab gade nan sa a pou yon ti kras. Nou ap kòmanse pou li ale nan yon bagay ki enteresan isit la. Se pou yo fè sa a done kondwi kounye a. Gen nan pa gen done isit la. Se pou nou chanje sa. Lwa II, Done Kondwi Documents-- Se konsa, kite a retounen nan isit la. Li kite yo jis debarase m de circle2, paske nou ap jis ajoute epi retire li. Se konsa, nou pa reyèlman bezwen li. Nou bezwen gen yon anpil plis entelijan isit la. Se pou nou di, nou gen kèk done nan kèk sòt. Youn moment-- kite la di, nou te gen done nan fòm sa a. Nou te gen yon etalaj, jis yon pakèt moun sou nimewo. Nou gen sèt nimewo isit la, kèlkeswa sa sa yo kantite lajan represent-- nan kont labank moun nan, ki jan lajan yo peze, Bondye ki konnen sa ki. Sa yo se nimewo yo, epi nou vle sèvi ak ti sèk nou an ki reprezante moun ki nimewo yon jan kanmenm. Nou vle mare nou an ti sèk nan nimewo sa yo. Se konsa, sa nou fè. Se pou nou di, nou vle yon sèk pou chak nimewo. Nou ta ka fè fin vye granmoun nan bagay nou te doing-- ajoutra sèk ak circle2 ak circle3. Men, sa a vin soti nan men, ak gen nan yon anpil nan repete lojik. Se konsa, kite a jwenn plis entelijan ak sa. Olye pou yo lè l sèvi avèk ti sèk ki var svg.append ke nou te jis lè l sèvi avèk, nou ap ale nan sèvi ak blòk sa a ti kras isit la. Mwen pa ta vle ale nan pwofondè- nan sa ki tout pati sa yo fè. Lè li nan kalite yon sijè avanse. Apre sa, mwen swete mwen te kapab. Men, bagay la kle nan recognize-- ak ou pral wè se yon bagay ki souvan nan D3 kòd. Blòk sa a nan debaz tèks kreye ti sèk kòm anpil kòm gen done eleman nan sa a etalaj dwa isit la. Se konsa, sa a kreye kòm anpil ti sèk kòm gen eleman. Li nan ale nan kreye nou sèt ti sèk. Epi li fè yon bagay reyèlman, reyèlman kle. Se konsa, kite a kouri sa. Se pou nou retire lòt sèk nou an. Se pou nou jis kòmantè sa a pati deyò epi yo kouri sa a ankò. Gen nou ale. Se konsa, ti sèk nou an isit la se yon pi fonse anpil, paske nou gen sèt ti sèk, yon sèl sou tèt lòt la. Nou jis kreye sèt ti sèk, yon sèl chak pou chak nan sa yo eleman done. Men, gen nan yon bagay kle ki te rive ak brib sa a dwa isit la. Li nan ki done yo te mare. Se konsa, chak yon sèl nan sa yo eleman done, 10, 45, 105, te mare nan yon sèk an patikilye. Se konsa, sa yo pa sèlman kreye yon pakèt moun sou ti sèk men mare de bagay sa yo ansanm. Ak nan tan kap vini an, paske nou te kreye moun ti sèk ak fonksyon D3 sa a, si mwen ba ou yon sèk, ou kapab ban m 'done yo asosye ak li. Se konsa, nou ka mande D3. Hey, D3, mwen gen sa a ti sèk. Ki sa ki nan done yo ki sèk la genyen? Epi D3 ta di nou 10 oswa 45 oswa 105. Tout bagay sa yo ap mare. Sa a se yon konsèp trè, trè fondamantal. Se pou yo gade nan sa. Se konsa, fason nou ta mande D3-- konsa sa a se petinan pou sa a, men jis kwè m 'sou li. Sa a se ki jan nou mande D3. Hey, D3, ban m 'premye a sèk ki ou ka jwenn. Ban m 'premye sèk la ou ka jwenn. Lè sa a, nou te ka mande D3, sa ki nan done yo sou sa, tankou sa a, 10. Se konsa, nou jis mande D3, jwenn m ' premye sèk la ou ka jwenn. Ki sa ki nan done li yo? 10, ki se vre nou an premye eleman done. Nou kapab mande li, hey, D3, jwenn nou twazyèm sèk nou an. 105. Poukisa se sa a vrèman enpòtan? Se konsa, dwa isit la, mwen mansyone ke nou te kapab itilize fonksyon. Apre sa, mwen mansyone sa ki te yon bagay trè pwisan. Se konsa, pa sèlman ka fonksyon nou an fè bagay sa yo tankou fè kèk kalkil, pou egzanp, retounen yon nimewo o aza, li ka tou fè bagay sa yo ki baze sou done yo. Sa a se sa done kondwi dokiman vle di. Sa a ki sa D3 kanpe pou. Se konsa, sa x postition-- olye nan jis di, tout ti sèk yo, jwenn x pozisyon 200, nou te kapab bay li yon fonksyon. Ak isit la, nou ka fè kèk kalkil. ak d isit la kanpe an plas pou done yo. Se konsa, chak fwa nou gen yon sèk, fondamantalman, D3 pral kreye sèt ti sèk sa yo. Lè sa a, pou chak sèk, li pral ale, hey, circle1 sa ki nan pozisyon x ou. Précédemment, nou te toujou reponn 200. Men koulye a,, chak fwa D3 mande nou sa ki nan pozisyon x ou, li nan pral bay nou ki nou gen ki sèk, konsa nou gen done yo. Li nan ale nan ba nou done a ak di, sa ou vle ekspozisyon an yo dwe, baze sou ki done. Se pou nou jis retounen done yo reyèl. Se konsa, si nou kouri sa a, sa a bay nou done kondwi dokiman yo. Ti sèk sa yo baze nan relasyon position-- yo ap baz kòm yon fonksyon nan done yo. Se konsa, pou premye sèk la, D3 mete yon sèk. Lè sa a, D3 mande nou, sa ki fè ou vle ekspozisyon an yo dwe. Apre sa, nou jis di, kèlkeswa sa done a se. Fè ekspozisyon an 10. Lè sa a, li mande, ki sa ou vle nan ekspozisyon yo dwe pou dezyèm sèk la. Apre sa, nou reponn, 45. Apre sa, nou, nan kou, kapab fè kèk kalkil isit la. Mwen jwenn ke ti sèk moun yo se kalite squished yo. Se konsa, anpil anpil pitit li pa 3, miltipliye done pa 3. Sèk nou fèk sot elaji deyò. Te valè nou triple. Sèk la se vrèman sou kwen an, kidonk kite a petèt kalite konpanse li. Se pou nou di, pa 20. Isit la ou ale. Sa a se yon vizyalizasyon done. Li se yon yon sèl trè debaz, men sa a ba nou kèk insight nan done nou an. Li di nou ke, pou egzanp, nou gen yon ti kras gwoup nan eleman. Epi nou gen yon gwo outlier isit la. Sa a ba nou kèk enfòmasyon sou distribisyon an. Si nou te, pou egzanp, chanje done yo nan 150 isit la ak rafrechir, se vizyalizasyon nou an chanje. Dokiman sa a se done kondwi. Se konsa, nan kou, tout eleman sa yo, tout atribi sa yo isit la, nou ka sèvi ak yon fonksyon, pa jis nimewo yo, pa sèlman x ak y pozisyon. Se konsa, nou ka sèvi ak yon fonksyon pou koulè an. Se konsa, nou pral fè menm bagay la. Nou pral bay li yon fonksyon. Li kite yo di, nou te kapab gen kondisyonal nan fonksyon nou an. Fonksyon sa a kapab santèn nan liy ki long. Li ka fè bagay sa yo trè, trè konplike. Se konsa, kite a mete yon si deklarasyon isit la. Se pou nou di, si done nou an ki pi piti a pase 50, ki nan kèk papòt ke nou ap enterese nan pou kèk rezon. Se pou yo fè l 'vèt. Sinon, se pou yo fè l 'wouj. Ki jan nan sa? Nice. Se konsa, nou vizyalizasyon done se kòmanse transmèt enfòmasyon plis enteresan sou anpil chanèl. Se konsa, kounye a nou konnen yon ti jan sou distribisyon an. E nou konnen ke gen nan kèk sòt de koupe nan 50 ke nou ap enterese nan. Nou konnen ke gen de pwen done anba a ki papòt ak pi fò nan yo pi wo a. Se konsa, kòm yon etap final la, done sa a isit la, li nan bagay ki trè ra yo wè sa a tankou sa. Se konsa, kite yo jis deplase li soti nan yon varyab paske se sa cleaner, tankou sa a. Lè sa a, nou itilize varyab sa isit la. Li nan menm bagay la egzak. Se jis nan yon cleaner ti jan. Next moute, Lwa III a, Scales-- Se konsa, yon pwoblèm dwa isit la se, si nou chanje nou an done nan sa a 200 value-- si nou chanje li nan 400 oswa yon bagay ak rafrechi, Lè sa a, sa a valè jis te ale offscreen. Se konsa, lojik nou an dwa isit la nan ki jan nou fè fwa yo 3 ak 20, yo gaye li soti ak Lè sa a, konpanse li yon ti jan se reyèlman clunky. Ki sa ki moun ki nimewo vle di? Yo ap jis difisil kode la. Apre sa, yo ap anpil mare nan done yo. Nou vle yon dokiman done kondwi. Nou vle yon dokiman trè fleksib, ke yo bay done, adapte nan li ak reprezante li. Ki sa nou fondamantalman bezwen se, nou gen sa a ranje nan nimewo 10. 45, 105. E nou vle nan kat jeyografik ki soti sou lajè a, lajè a plen isit la. Se konsa, nou gen seri a nan nimewo pral ki ant 0 a 100. Epi nou gen sa a mwen kanpis ale soti nan 20 a 700, nan ka sa a. Nou kalite vle kat ki sou. Nou vle echèl ki leve, li Lè sa a, konpanse li yon ti kras. Li sanble ke gen D3 sa yo. Yo rele li yon echèl. Se konsa, kite a sèvi ak li. Fason la ki fonctionne-mwen pral tape sa a leve, li Lè sa a, eksplike li. Sa a se yon echèl. Ki sa ki li pral fè se, li pral kat soti valè nan 1 rive nan 200 sou 20 a 600. Nou ka tcheke sa. Nou ka wè ke isit la. Se konsa, si mwen manje l '1-- yon sèl moman. Ban m 'yon dezyèm fwa. Mwen dwe te mistyped li. Gen ou ale. Mwen regrèt sou sa. Se konsa, sa yon echèl pral fè se, li pral pran yon valè ak Lè sa a konvèti ke, elaji ki soti, se konsa li plen seri a plen w ap mande pou. Se konsa, nan ka sa a, si nou bay li yon sèl, li a pral kat ki soti sou 20. Men, si nou bay li 200, li nan ale nan kat jeyografik ki sou a 600. Ak yon kote nan ant, si nou jwenn 100, li nan pral fè yon kote nan ant 20 ak 600. Ak nan kou, kounye a sa a se sa nou bezwen yo retire sa yo kode difisil bagay sa yo nou gen dwa a. Se konsa, sa nou vle fè se pran done yo ke nou ap yo bay yo, ke done endividyèl eleman, epi yo pase li selon echèl la an premye. Se konsa, echèl pral echèl li. Tou Se Oh, nou gen yon ti kras erè isit la. Nou ap manke done. Gen ou ale. Epi sa ogmante li soti. Sa ban nou menm bagay la tou rezilta nou te gen anvan, men olye pou yo gen moun difisil kode kontrent. Men, si gwosè a nan nou an chanjman twal, pou egzanp, si nou vle gen plis pase sa a 400 piksèl epi li squishes soti, nou ka genyen li over-- nou ka elaji li, oswa nou ka diminye Marge kite sa a yon bagay mwens oswa plis pase 20. Nimewo sa yo, sa yo difisil kode nimewo kounye a fè sans yo ban nou. Apre sa, nou ta ka fè yon anpil plis bagay sa yo enteresan kòm byen. Se konsa, olye pou yo gen yon lineyè echèl, nou ta ka vle ale yon echèl. Epi sa pral ban nou yon echèl log. Se konsa, kounye echèl nou an, olye pou yo jis agrandi soti ke ranje, li nan fè bagay pi plis sofistike. Olye pou yo gen sa a ranje difisil kode, ak olye pou yo gen ki 600, nou ta ka vle jis itilize lajè a, se konsa soti nan 20 a lajè a mwens 40, 2 fwa Marge a sou lòt bò a. Lè sa a fè yon anpil plis sans nan yon moun ki ta ka gade nan kòd la. Enteresan, balans yo jwenn trè, trè sofistike kòm byen. Yo fè yon bann bagay sa enteresan. Se konsa, balans pa nesesèman gen yo opere sèlman ak nimewo. Se pou yo fè yon echèl koulè. Se konsa, ranje nou te kapab be-- domèn nou an, se 1 a 200. Sa a bagay la opinyon. Men, nou ta ka vle kat soti nan vèt yo wouj, pou egzanp. Epi, koulye a, si nou pase l 1, nou ap ale nan jwenn vèt. Si nou ba li 200, nou pral jwenn wouj. Men, si nou pase l yon bagay nan ant, li pral gen kèk melanj de sa, yon kote sou gradyan an ant vèt ak wouj. Ak olye pou yo gen sa a kalite clunky lojik nou gen isit la ak nan kondisyonèl dwa a, nou te ka gen yon bagay yon echèl lineyè ant moun. Se konsa, nou ta sèvi ak echèl la nou jis kreye, ki nou rele koulè. Apre sa, nou ta ba li D, ki se nou eleman done. Apre sa, nou ale. Nou gen yon echèl koulè. Se konsa, sa a se kat. Se konsa, kite a byen lwen se konplètman vèt. Dwa a byen lwen se konplètman wouj. Ak tout bagay nan ant se yon fonksyon nan d. Nou gen yon enteresan vizuèl isit la. Men, done nou an te kalite raz. Ann wè sa ki nou te ka fè si nou te gen done plis enteresan. Lwa IV, k ap travay avèk Data-- premye bagay la nou pral vle fè yo fè nou an vizyalizasyon plis enteresan se pou avanse pou done yo yon lòt kote. Li trè clunky gen done yo difisil kode isit la. Epi jeneralman, nou pral mande yon moun lòt bagay pou done yo. Nou pral petèt mande gouvènman an, Census Bureau la, sa ki nan done ou ak Lè sa a trase ki oswa mande kèk antite twazyèm-pati pou kèk done ak Lè sa a bati yon vizyalizasyon sou sa. Se konsa, premye bagay la nou vle fè se deplase ke yo yon lòt kote. Se konsa, mwen ale nan kreye yon ranpli isit la yo rele data.json. JSON se fòma a done. Ou pa bezwen konnen anpil sou sa. Epi nou ap ale nan kopi a ti kras done nou gen la, kole li nan la motamo, ale tounen nan Kòd vizyalizasyon nou an isit la, epi sèvi ak sa a fonksyon dwa isit la. Ou pa bezwen konnen detay yo. Men, sa ki sa a ap fè se, li pral jwenn ke dosye, al pran l ', epi retounen li ba nou. Se konsa, sa sa a fè se, li ale epi pou yo jwenn dosye a data.json. Lè sa a, tout kòd la ki nan dantle Anndan esansyèlman, tout kòd la nou gen there-- pral kouri sèlman lè nou jwenn done yo tounen. Lè sa a, li pral kouri ki Kòd ak done a nou gen. Great, nou gen yon vizyalizasyon ki queries pou kèk kòd yon kote lòt moun, ki se nòmalman kote li queries kèk done ki sòti nan yon lòt kote, ki se nòmalman ki jan vizuèl travay. Men, mwen vle ale tounen nan done yo. Se konsa, done yo fondamantalman nan D3-- D3 manje done ki nan yon lis de bagay sa. D3 espere done yo jis pou yon lis de bagay sa yo, yon etalaj de bagay sa yo. Li pa enpòtan sa bagay sa yo yo, se konsa lontan ke li nan yon etalaj nan yo. Se konsa, isit la, pou egzanp, nou te ka nan kou te valè pwen k ap flote. Nou te kapab gen negatif. D3 pa pran swen, se konsa long kòm li nan yon lis bagay. Bagay sa yo kòm enteresan nou te kapab gen, nou te kapab tou gen yon lis nan strings tankou sa. Se konsa, tit yo Crimson sa yo, se Mwen ranmase yon kèk jou de sa. E petèt ou ka jwenn kèk enteresan bagay sa yo sou sa yo yon tit. Se konsa, ankò, sa a se yon lis de bagay sa yo. D3 pa pran swen. Sa yo rive yo dwe yon fisèl. Nou te chanje done nou an. Se pou yo tounen vin jwenn vizyalizasyon nou an. Koulye a, vizyalizasyon nou an espere D 'nan yo dwe nimewo. Se konsa, nou ap ale nan gen fè yon chanjman kèk. Se konsa, pou egzanp, premye nan tout, petèt nou vle mete ti sèk sa yo ansanm pa longè a nan tit la, nan kantite karaktè nan tit la. Se konsa, sa nou pral fè is-- chak fwa nou an se fonksyon rele ak yon fisèl, nou pral jwenn li nan longè ak Lè sa a, konsa, sou yon echèl. Koulè a, mwen pral retounen ke yo asye ble. Apre sa, nou ale. Nou gen yon vizyalizasyon tit nan Crimson. Echèl nou an se yon ti jan an. Se pou nou asime ke pi long la gran tit se 100 karaktè long, se konsa span ki soti yon ti jan. Epi nou gen yon vizyalizasyon. Se konsa, li sanble ke pi gwo tit yo trè fèmen ansanm, an tèm de liy karaktè. Men, yon sèl gen reyèlman vle di soti. Nou te kapab bati kèk zouti yo eksplore ki plis. Men, lè mwen te ap travay sou sa a, mwen te kirye si wi ou non, nan sa a seri done, tit ak yon kolon nan yo ta dwe pi long lan. Mwen sipoze yo ta. Se konsa, kite a jwenn deyò. Se pou nou sèvi ak koulè a chanèl tankou nou te fè anvan, programme kèk sou si gen nan yon kolon oswa ki pa gen. Se konsa, nou pral sèvi ak yon kondisyonèl ankò. Ou pa bezwen konnen detay yo nan sa a, men sa a se ki jan nou tcheke yon fisèl pou yon karaktè patikilye nan JavaScript, ankò, se pa ki enpòtan. Men, si nou pa jwenn yon kolon, nou pral retounen vèt. Men, si nou fè sa, nou pral retounen wouj. Se konsa, ankò, tit ki te yon kolon yo pral wouj. Sa a se ki sa sa a means-- bèl. Se konsa, li sanble ke mwen se ipotèz te fwape. Genyen sèlman de. Nou sèlman gen sis pwen done ak sèlman de te gen kolon. Men, li sanble yon ti jan plis sou fen a pi ba, an reyalite. Tit ak kolon sanble jeneralman pi kout, omwen nan done nou an set-- enteresan. Ann retounen ke yo asye ble ak Lè sa a, wè ki sa nou ka fè ak menm done plis enteresan. Se konsa, ankò, mwen mansyone ke done nan D3 se yon lis de bagay sa yo. Nou te wè nimewo nan kalite anpil. Nou te wè strings. Men, bagay sa yo kapab tou gen pou objè yo. Yo ka bagay konplike ki gen ladan yo yon anpil nan bagay sa yo. Pou di ke pi klè, nan pifò ka yo, nou vle bati chak pwen done kòm pi konplike pase jis yon sèl valè. Si w ta imajine yon baz done sou elèv yo, ka gen yon elèv non, yon ID elèv, ak yon anpil nan bagay sa yo ki asosye ak yon dosye patikilye, pa jis yon fisèl oswa yon nimewo. Se konsa, kite pou yo gade nan sa. Sa a se youn done sa yo mete. Sa a se yon done mete sou tranblemanntè. Se konsa, tout bagay isit la sou lis nou an oswa etalaj de bagay sa yo gen anpil bagay tèt li. Se konsa, chak pwen done genyen yon grandè ak yon koòdone. Epi kowòdone tèt yo gen de bagay sa yo. Se konsa, chak jou se kounye a yon anpil plis konplike ak yon anpil plis enteresan epi li gen pi plis enfòmasyon enteresan. Ann gade pou wè nou te ka bati soti nan sa. Retounen tounen nan isit la, ankò, lè l sèvi avèk vizyalizasyon sèk istogram nou an nou te bati a, kite a wè si nou ka bati yon vizyalizasyon nan distribisyon grandè nan nou an seri done. Se konsa, isit la, li nan konsèp la menm. Men koulye a,, d gen plis bagay sa yo. d gen anpil eleman done. Se konsa, nou jwenn ta tounen. D3 ba nou d. Epi nou reponn pa jwenn grandè a nan d ak Lè sa a pase ke yo echèl. Lè sa a, nou bezwen chanje echèl nou an, nan kou. Se konsa, tou senpleman pa fè sa anpler ale pi plis pase 10. Aktyèlman, gen pa janm te gen yon tranbleman tè 10 grandè. Men, sa a kalite siperyè nou an fen, spectre anwo nou an. Se pou yo rafrechi. Nice, nou gen yon vizyalizasyon. Li nan enteresan yo note-- konsa ki te gen de pwen done ki yo se prèske egzakteman sou tèt chak lòt, an tèm de grandè. Ou wè sa a pa stupidity nan nou ap lè l sèvi avèk. Nou gen done jeyografik kounye a. Nou gen latitid ak lonjitid. Petèt nou te ka fè yon bagay yon anpil plis enteresan ak sa. Se pou nou jwenn kèk plis enteresan fason yo visualized sa a pi konplike done nou gen aksè a. Lwa V, Mapping-- fondamantalman, nou vle mete sa yo sou yon kat jeyografik. Mwen vle di, sa a se kote sa a ki pral. Nou vle programme enfòmasyon sou la pozisyon nan lekti tranbleman tè sa yo, kòm byen grandè yo, paske nou gen ke kounye a. Nou konprann ki jan yo konsome done plis konplike. Premye bagay nou pral fè se kreye yon kat jeyografik, yon kat jeyografik background. Mwen pral yo ale nan sa a trè vit. Sa a se kòd difisil. Li nan yon lòt youn nan moun ki resèt ou pa fè sa vrèman gen konprann konplètman pou ou pou w itilize. Men, sa a se kòd. Kòd sa a dwa isit la kreye yon kat jeyografik. Nou pa ap ale nan ale nan detay. Men, surfaces, ki sa li fè se, li queries sa a ranpli us.json, ki se yon dosye done tankou yon sèl la nou te gen anvan. Li nan pi konplèks, nan kou. Men, nan ka sa a, tout bagay, chak pwen done se eta sa a e li gen yon lis latitid ak lonjitid ki defini poligòn lan, ki fòm, eta sa a. Se konsa, sa D3 pral fè se menm jan nan sa nou te fè anvan. Li pral mande pou ak mare ke yo yon eleman. Apre sa, nan yon fonksyon ki pral kat ki eleman soti, baze sou latitid ak lonjitid. Ou ka li plis sou sa. Apre sa, mwen rekòmande pou li. Gen lyen nan la nan fen sa a kòd afiche. Epi se kòd la kòmante. Nan gen lyen pou plis sou sa. Mwen rekòmande ou gade li. Men, sa ki nou pran swen sou se fonksyon pwojeksyon sa a. Mwen vle ale nan sa. Premye a tout, kite m 'montre ou ke, repons lan se wi, nou gen yon kat jeyografik. Maps se fre. Se konsa, kite pou yo gade nan sa a fonksyon pwodiksyon an. Pwojeksyon se anpil tankou yon echèl, balans ankò. Se konsa, sa pwodiksyon pou fonksyon pwojeksyon sa a se, nou te ka pase l lonjitid ak latitudes-- nan ka sa a, valè sa yo isit la yo se nan lat-fin fou nan bilding lan nou ap chita nan dwa now-- pwojeksyon. Ak pwojeksyon pral konvèti ki nan x ak y valè pixel. Se konsa, sa ap fè pwojeksyon se sanble anpil ak echèl nou an. Li nan pran latitid nou an ak lonjitid ki reprezante yon glòb antye ak réduction ak dimensionnement ki desann nan kare a ke nou vle, ke nou te bay li. Nan ka sa a, nou ap pase valè sa yo. Epi li ban nou, byen, ki sou ekran ou a vle di 640 piksèl. Ekran sa a antye se 700 piksèl lajè, se konsa ki fè nou sou isit la, ak 154 piksèl desann, ki mwen ta estimasyon se bèl anpil isit la. Se konsa, pran moun lat-fin fou, ki reprezante yon bagay sou glòb la tout antye ak squishing ak deplase ke alantou ba nou x ak valè y pixel, sa a se bagay la premye sa a, se fè nan sa a kòd kat. Lè sa a, rès la nan la Kòd manje done yo ak Lè sa a kat moun lat-fin fou sou yon bagay sou ekran an. Men, nou ap ale nan sèvi ak pwojeksyon sa a fonksyon, paske li vire soti nou gen lat-fin fou fin fou kòm byen. Kap retounen nan done nou an, nou gen latitid ak kowòdone lonjitid pou chak obsèvasyon. Se konsa, kite a sèvi ak pwojeksyon. Se konsa, gade nan ekspozisyon nou an, nou vle exposition-- nou an nou gen yon latitid ak lonjitid yon. Men, nou vle valè pixel. Epi li vire soti, nou gen egzakteman ki sa nou want-- pwojeksyon. Anpil tankou nou te lè l sèvi avèk echèl dwa isit la, nou ap kounye a ale nan sèvi ak pwojeksyon epi yo pase li kowòdone. Se konsa, premye bagay la nou ap doing-- pou nou ap ap resevwa d, ki se yon done endividyèl eleman nan yon tranbleman tè moun lekti. Premye bagay nou fè se jwenn kowòdone a. Tout dwa, nou gen kowòdone a. Bagay la dezyèm nou fè se konsa, sou pwojeksyon. Pwojeksyon konvèti moun kowòdone nan valè pixel, x ak y. Lè sa a, bagay la pase nou vle fè se jis jwenn x la, ki ka sa a se yon sèl la an premye. Li nan premye an nan de bagay sa yo ke yo tounen pa pwojeksyon. Nou pral fè menm bagay la pou y. Men, olye de sa, nou pral retounen eleman, dezyèm lan, y la. Jwenn tou pare yo rafrechi. Ooh, pèsonaj siplemantè isit lan-- bèl, nou gen yon done kondwi dokiman sa a, se sere sa a ranpli JSON nan objè, fè yon kat jeyografik, ak chanje a atribi nan relasyon ak yon done yo ak pwojè l 'sou yon kat jeyografik. Sa a se vrèman enteresan. Sa a se fre. Se pou nou pran l 'kanpe yon Notch. Mwen vle di, nou gen de moso nan enfòmasyon ak chak pwen done. Mwen vle di, twa. Nou gen kowòdone a, ki se yon x ak y. Epi nou gen grandè a. Nou bezwen programme grandè yon jan kanmenm. Nou gen yon anpil nan chanèl. Nou ka sèvi ak koulè. Nou ka sèvi ak reyon. Nou te ka sèvi ak stupidity. Nou te ka sèvi ak anpil bagay sa yo nan kòd. Nenpòt nan atribi sa yo ak anpil plis ki pa yo ki nan lis la, paske yo ap si ou vle, nou te kapab itilize yo programme done sa a, konjesyon serebral la ak tout bagay sa yo mwen te mansyone. Se pou yo fè reyon. Mwen panse ke reyon ki pi entwisyon an. Se konsa, ankò, nou pral ranplase ki difisil-kode 40 ak fè kèk kalkil. Nou pral sèvi ak echèl pi renmen nou an ankò. Epi nou ap sot pase d. Men, pa ta paske nou vle grandè a nan d. d se jis pwen an done. Nou pral pase grandè a sou yon echèl. Ann eseye sa ankò. Ooh, li pa travay. Poukisa pou l 'pa travay? Se konsa, sonje sa echèl fè. Se pou yo gade nan echèl ankò. Echèl kat nan 1 rive nan 10 sou a 22 600, plis oswa mwens. 600 se gwo. Sa a se poukisa nou ap vin sa a. Se konsa, nou vle chanje echèl nou an yon bagay ki pi rezonab. Se pou nou di, nou vle 0 a 60. 60 se gwo, men 10 tranblemanntè yo èkstrèmeman ra. An reyalite, yo pa janm te rive. Se konsa, sa sa a pral fè se, li pral pran grandè nou an ki ale nan 1 rive nan 10 ak kat l 'sou yo elaji li soti. Ak kat jeyografik l 'sou a 0 a 60. Se pou yo rafrechi. Nice, nou gen yon vizyalizasyon. Sa a se gwo. Sa a se done vrè. Ou pral remake, nan jwèt ti kras mwen egzanp, tranbleman tè a pi gwo se dwa sou tèt nou. Men, sa a li. Nou gen yon dat kondwi vizyalizasyon ki manje done yo epi li ba nou reyèlman enfòmasyon enteresan. Yeah, kite a ajoute kèk interactivité nan li. Mwen mansyone sa ki te fòs la fò nan D3. Se konsa, isit la, pou chak eleman, nou ap dekri yon pakèt moun sou atribi. Men, nou ka dekri tou sa nou vle rive ak eleman interactivité. Pou egzanp, nou te ka dekri sa ki pase lè nou sourit sou. Ak trè menm jan ke, ki pral pran yon fonksyon, trè menm jan ak nan atribi figi nou te gen anvan, kote nou fè yon bagay yo nan eleman lè nou hover sou li. Se konsa, premye bagay nou bezwen fè se chwazi ki eleman, jwenn li fondamantalman, nan navigatè a. ak Lè sa a nou te ka mete yon atribi nan li. Se konsa, sa m ap fè isit la se, lè nou hover sou yon bagay, nou pral jwenn ki eleman ak Lè sa a mete stupidity li yo tounen nan 1, konplètman opak. Ann gade pou wè ki sa sa sanble. Li parèt nou gen yon siplemantè virgules isit la. Se konsa, si nou hover sou isit la, li vin plen. Men, kounye a, nan kou, li rete plen, paske nou gen a dekri sa k ap pase lè retire kurseur nou an. Se konsa, kite a fè egzakteman sa sou mouseout, kòm opoze a mouzove. Epitou, n ap Reyajiste li nan ki sa nou te gen fè anvan 0.5. Epi, koulye a, chak nou tan hover, nou jwenn yon sèk plen. Li ede nou wè ki sa nou nou ap chwazi esansyèlman. Epi, koulye a kite a fè sa a vrèman gwo. Se pou yo konekte sa a nan done reyèl. Se konsa, kite a mande kapab USGS sou done yo. Se konsa, Jeyolojik Sondaj la US gen done sou tranblemanntè. Yo gen yon API piblik sa a, se kapab yo pral fini nan fòma JSON. Se konsa, kite a fè sa. Se konsa, sa a se yon ti jan nan kòd ki konekte nan API la USGS. Apre sa, nan yon ti jan nan pwosesis sou li. Sa a se pa ki enpòtan men senplifye li nan yon fòma done ki senp tankou yonn nan nou te gen anvan. Se konsa, mwen debarase m de apèl nou yo data.json fo nou an nan dosye. Ak olye pou, m ap rele USGS la esansyèlman. Se pou yo rafrechi, bèl. Sa a se aktyèl, done lavi reyèl, soti nan semèn sa a pou tranblemanntè. Sa a se vrèman enteresan. Sa a se pa etone pou nou, men gen yon anpil nan tranblemanntè sou la West Coast nan California. Men, mwen te panse li te trè enteresan ke te gen anpil tranblemanntè nan Alaska, ak aparamman, isit la nan Midwès la. Mwen vle di, ki enteresan, epi nou ap bon. Sa a konklizyon an. Men, fondamantalman, sa a se sa ki D3 ede nou fè. Li ede nou pran done, mare li nan eleman nan Dom a, epi yo gen eleman sa yo chanje kòm yon fonksyon nan done yo, gen moun ki atribi yo, tout atribi anpil nan eleman yo, tout kapab itil pou chanèl tansmèt enfòmasyon. D3 se yon ekstrèmman pwisan bibliyotèk ak étonant byen kouri. Sa a se kèk bagay ki pwisan. Done vizyalizasyon se yon ekstrèmman pwisan zouti pou pas nan moun gwo twou san fon Sur ki vin nan nwayo yo epi li ede yo konprann, nan sa a pwofon ak entwisyon fason, ki jan done travay ak ki jan done chanje lavi nou.