わかりやすいグラフを作ろう

ng-kyoto Angular Meetup #8 での LT発表資料です。
https://ng-kyoto.connpass.com/event/100685/

Transcript

1. Θ͔Γ΍͍͢άϥϑΛ࡞Ζ͏ OHLZPUP
   "OHVMBS
   .FFUVQ
   
   c
   0DU
   
   
2. ஫ҙɿ"OHVMBS
   ͷ࿩͸Ұ੾ग़͖ͯ·ͤΜ
3. ਆอ
   Յल !KNCMPH ͡Μ΅ɹΑ͠ͻͰ
6. Θ͔Γ΍͍͢άϥϑΛ࡞Δͷ͸ɺҙ֎ͱ೉͍͠
7. σʔλ άϥϑ Τϯίʔυ ޮՌతͳΤϯίʔσΟϯάͷςΫχοΫΛ
   ஌͓ͬͯ͘͜ͱ͕େ੾
8. Θ͔Γ΍͍͢άϥϑΛ࡞੒͢ΔͨΊͷखॱ  ԿΛ఻͍͑ͨͷ͔໌֬ʹ͢Δ
    ఻ΘΓ΍͍͢දݱΛબͿ
    ݟӫ͑ΛσβΠϯ͢Δ
9. Θ͔Γ΍͍͢άϥϑΛ࡞੒͢ΔͨΊͷखॱ  ԿΛ఻͍͑ͨͷ͔໌֬ʹ͢Δ
    ఻ΘΓ΍͍͢දݱΛબͿ
    ݟӫ͑ΛσβΠϯ͢Δ
10. Α͋͘Δέʔε ۤ࿑ͯ͠৘ใΛಡΈऔΒͳ͚Ε͹ͳΒͳ͍άϥϑ ఻͍͑ͨ͜ͱʹϑΥʔΧεͰ͖͍ͯͳ͍ɻ
    ݴ͍͍ͨ͜ͱ͕఻Θ͍ͬͯͳ͍ɻ
11. ఻͍͑ͨʮϝοηʔδʯΛ͔ͭͭʹߜΓࠐΉɻ ͜ΕΛΘ͔Γ΍͘͢఻͑Δ͜ͱʹϑΥʔΧε͢Δ 1PXFS1PJOU
    Λ։͘લʹ
12. Θ͔Γ΍͍͢άϥϑΛ࡞੒͢ΔͨΊͷखॱ  ԿΛ఻͍͑ͨͷ͔໌֬ʹ͢Δ
     ఻ΘΓ΍͍͢දݱΛબͿ
     ݟӫ͑ΛσβΠϯ͢Δ
14. ࢖͏ͷ͸ආ͚͍ͨάϥϑ ԁάϥϑ %άϥϑ ࣠άϥϑ ಡΈʹ͍͘
    ͕ࠩݟ෼͚ͮΒ͍ ಡΈʹ͍͘
    ͕ࠩݟ෼͚ͮΒ͍ ࠨӈʹॎ͕࣠͋Δͱ
    ಡΈʹ͘͘
    ͕͔͔࣌ؒΔ
15. ࢖ͬͯ҆৺ͳجຊͷάϥϑ ఺άϥϑ ๮άϥϑ ઢάϥϑ ࢄ෍ਤ ॎ๮άϥϑ
    ԣ๮άϥϑ
    ੵΈ্͛๮άϥϑ ંΕઢάϥϑ
    εϩʔϓάϥϑ
16. Θ͔Γ΍͍͢άϥϑΛ࡞੒͢ΔͨΊͷखॱ  ԿΛ఻͍͑ͨͷ͔໌֬ʹ͢Δ
     ఻ΘΓ΍͍͢දݱΛબͿ
     ݟӫ͑ΛσβΠϯ͢Δ
17.  ෆඞཁͳཁૉΛऔΓͷͧ͘
     ૬खͷ஫ҙΛແҙࣝతʹͻ͖͚ͭΔ ৺͕͚Δ΂͖ͭͷϙΠϯτ
18. ਅͬനͳը໘ʹཁૉΛͭ௥Ճ͢Δ͝ͱʹɺ
 ೝ஌తෛՙ͸૿͍͑ͯ͘ɻ
    ඞཁ࠷খݶ·ͰɺཁૉΛऔΓͷ͍͍ͧͯ͘ɻ  ෆඞཁͳཁૉΛऔΓͷͧ͘
21. ૬ख͕ʮೝࣝ͢Δલʯʹݟ͍ͤͨ΋ͷΛݟͤΔ
    ࢹઢͷಈ͖Λҙࣝͯ͠ཁૉΛ഑ஔ͢Δ  ૬खͷ஫ҙΛແҙࣝతʹͻ͖͚ͭΔ
22. 
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
     ʮʯͷ਺Λ਺͍͑ͯͩ͘͞
23. ҙࣝతʹݟΑ͏ͱ͠ͳͯ͘΋ɺ
    ʮʯ͕ࣗવͱ໨ʹඈͼࠐΜͰ͖·ͤΜͰ͔ͨ͠ʁ 
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
24. ແҙࣝతࢹ֮৘ใ
    QSFBUUFOUJWF
    BUUSJCVUFT c ޲͖ ܗ ઢͷ௕͞ ઢͷ෯ αΠζ ࿷ۂ ௥Ճ ғΈ ৭ ೱ͞ Ґஔ ಈ͖
25. ਓ͸ ʮ;ܕʯʹ ࢹઢΛ ಈ͔͢
26. 5IF
    UJUMF
    JT
    JNQPSUBOU 5IF
    OPUF
    UFYU
    JT
    OPU
    TP
    JNQPSUBOU
27. ࣮ફྫ
28.  ԿΛ఻͍͑ͨͷ͔໌֬ʹ͢Δ
29. ԿΛ఻͑Δ͔ աڈ೥ؒͷେࡕࢢͷؾ৅σʔλΛ෼ੳͨ݁͠Ռɺ
    ೥͕࠷΋೤ଳ໷ͷଟ͍೥ͩͬͨ͜ͱ͕Θ͔ͬͨɻ
    ಛʹ೥ͱൺֱ͢Δͱഒͷ͕ࠩ͋ͬͨɻ
    ͜ͷ఺Λ఻͑Δɻ ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೤ଳ໷ͷ೔਺
30.  ఻ΘΓ΍͍͢දݱΛબͿ
31. දΛ࢖͏ͷ΋͋Γ ೤ଳ໷ͷ೔਺ ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೥  ೥  ͜ͷఔ౓ͷσʔλͰ͋Ε͹ѱ͘ͳ͍ɻ
 
 ʮແҙࣝతࢹ֮৘ใʯΛར༻͢Ε͹ɺ
    Θ͔Γ΍͘͢఻͑ΒΕΔɻ
    ͨͩ͠ɺ΄͔ͷ೥ͱͲΕ͙Β͍ͷ͕ࠩ
    ͋ͬͨͷ͔͸ɺදΛʮಡΉʯඞཁ͕͋Γ
    ͕͔͔࣌ؒΔɻ
32. ંΕઢάϥϑʹͯ͠ΈΔ ೥ؒͷมԽͷ܏޲Λ఻͍͑ͨͷͰ͋Ε͹
    ͪΐ͏Ͳ͍͍ɻ
    ͨͩ͠ɺͲΕ͕࠷΋େ͖͘ɺ
 ͲΕ͕࠷΋খ͍͞ͷ͔ͱ͍͏͜ͱʹ
    ϑΥʔΧε͍ͤͨ͞৔߹ʹ͸
    ͋·Γ޲͍͍ͯͳ͍ɻ      ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥
33. ॎ๮άϥϑʹͯ͠ΈΔ      ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ͲΕ͕࠷΋େ͖͘ɺͲΕ͕࠷΋খ͍͔͞ɺ
    ೝࣝ͠΍͍͢͠ɺ೥͝ͱͷࠩ΋
 ͻͱ໨Ͱ෼͔Δɻ
34. ԣ๮άϥϑʹͯ͠ΈΔ ॎ๮άϥϑͱಉ༷ɺͪ͜Β΋Θ͔Γ΍͍͢ɻ
    ͞Βʹʮ;ܕʯͷࢹઢͷಈ͖Λߟ͑Δͱɺ
    ·ͣϥϕϧʢ೥ʣΛݟͯɺͦΕ͔ΒσʔλΛ
    ݟΔͷͰɺॎ๮άϥϑΑΓ΋ಡΈ΍͍͢ɻ
    ʢॎ๮άϥϑͷ৔߹͸ɺ্Լʹ໨Λಈ͔ͯ͠
    σʔλͱϥϕϧΛݟൺ΂Δඞཁ͕͋Δɻʣ
    ࠓճ͸͜ΕΛ࠾༻ɻ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥     
35.  ݟӫ͑ΛσβΠϯ͢Δ
36. ෆඞཁͳཁૉΛऔΓͷ͍͍ͧͯ͘
37. աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥     
38. աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥      ৭Λͳ͘͢ʢάϨʔεέʔϧʹ͢Δʣ
39. աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥      ғΈઢͱܩઢΛফ͢
40. աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ 9࣠ͷϥϕϧΛফ͢
41. ૬खͷ஫ҙΛແҙࣝతʹͻ͖͚ͭΔ
42. ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ λΠτϧΛࠨ্ʹஔ͍ͯڧௐ͢Δ աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺
43. ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ʮ৭ʯͰ஫ҙΛҾ͖͚ͭΔ աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺
44. ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೔ ೔ ݟͯ΄͍͠೥ʹ͚ͩ೔਺Λදࣔ͢Δ աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺
45. աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥      मਖ਼લ
46. मਖ਼ޙ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೥ ೔ ೔ աڈ೥ؒͷେࡕࢢͷ೤ଳ໷ͷ೔਺
47. ·ͱΊ
48. ʮσʔλΛͨͩݟͤΔ͚ͩʯͰऴΘΒͳ͍άϥϑΛ࡞Ζ͏