爆速でGECKO BOARDらしき何かを作る。 #jsオジサン

1bacc16e3879ad4f5f1c923c60dc32f5?s=47 Takayuki Imai
September 16, 2014

爆速でGECKO BOARDらしき何かを作る。 #jsオジサン

爆速でGECKO BOARDらしき何かを作ります。

1bacc16e3879ad4f5f1c923c60dc32f5?s=128

Takayuki Imai

September 16, 2014
Tweet

Transcript

  1. ര଎Ͱ(&$,0#0"3%Β͖͠Կ͔Λ࡞Δɻ ! 5BLBZVLJ*NBJ !+4͓͡͞Μ

  2. ࣗݾ঺հ

  3. ࠓҪو೭ ΠϚΠλΧϢΩʣ UXJUUFS!JNBJNJBNJ 8BOUFEMZͷ8FCΤϯδχΞɻ
 Ҏલ͸1)1FSɺֶੜͷࠒ͸ܶஂͯ͠·ͨ͠ɻ ! ! ! ৄ͍͠ϓϩϑΟʔϧ ˠIUUQTXXXXBOUFEMZDPNVTFST

  4. ϓϩϑΟʔϧฤू

  5. χϡʔεϑΟʔυ

  6. -5

  7. ΫϦΤΠςΟϏςΟͰ͸͡Ίɺ γϏΞͳ਺ࣈͰ൑அ͢Δ http://www.lifehacker.jp/ 2014/01/140107startups_wantedly.html Wantedlyͷ։ൃ͸..

  8. (&$,0#0"3%࢖ͬͯ·͢ɻ

  9. ࡞ͬͯΈ͍ͨ JS͓͡͞Μతࢹ఺

  10. JMMVTUSBUPSͰ ΠϥϨ͓͡͞Μ͔ͳʁ JS͓͡͞Μతࢹ఺

  11. ര଎Ͱ׬੒ʂʂʂ

  12. ര଎ʂʂ ඇσβΠφʔͰ΋Ͱ͖ͨʂʂ ײಈͷϑΟφʔϨʂʂ

  13. ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ

  14. ಈ͔ͳ͍Αʂʂ

  15. %KTͰಈ͔͢ JS͓͡͞ΜͩͬͨΑ!

  16. ·ͣɺillustratorʹ͋Γ͕ͱ͏Λɻ ϨΠϠʔύωϧͰೖྗͨ͠ ΦϒδΣΫτ໊͕ɺ ! ! ! ! ! ! svgͱͯ͠ॻ͖ͩͨ࣌͠ͷ

    ཁૉͷidʹͳΔɻ
  17. EͰಈ͔ͤΔʂʂ ελΠϧ͸svgʹinlineͰهड़͞Ε͍ͯΔͷͰɺ γϯϓϧʹॻ͚Δɻ d3.select("#score").text(number); d3.select("#line").attr("d", d3line(dataset));

  18. σϞ

  19. ΋ͬͱಈ͔͢ʂʂ

  20. UISFFKTͰಈ͔͢ ଓ JS͓͡͞ΜͩΑ!

  21. $44%3FOEFSFSKT three.jsͷ֦ுϥΠϒϥϦɻDOMΛCSS3transformͰૢ࡞Ͱ͖Δɻ ެࣜͷαϯϓϧ͕ૉఢɻ http://threejs.org/examples/css3d_periodictable.html scene = new THREE.Scene(); object =

    new THREE.CSS3DObject(document.getElementById('hoge')); scene.add(object); renderer = new THREE.CSS3DRenderer(); ... !
  22. σϞ

  23. ·ͱΊ

  24. ࣗ෼Ͱ࡞Ε͹ɺ޷͖ͳϥΠϒϥϦ΋࢖͑ͯʜ ! Մೳੑ͸ແݶେʂʂ ௒ָ͍͠ʂʂ ΦϦδφϦςΟ͋;ΕΔμογϡϘʔτʂʂ ຖ೔ͷ࢓ࣄ͕໘ന͘ͳΔʂʂ ! ͱɺࢥ͏ͷ͚ͩͲͰ΋ɺ

  25. ແବແବແବແବແ ବແବແବແବແବ ແବແବແବແବແ ବແବແବແବແବ ແବແବແବແବແ ବແବແବແବແବ ແବʂʂ ͔΋͠Εͳ͍..

  26. (&$,0#0"3%Ͱ΋$6450.8*%(&5͕࡞ΕΔɻ 9.-Λ1PMMJOHͯ͠΋ΒͬͨΓ +BWBTDSJQU +40/Ͱ1VTIͨ͠Γ Χοίྑ͍chartϥΠϒϥϦ΋࢖͑Δ ָ͘͠JS͕ॻ͚ΔΑ͏ʹ ϕετͳબ୒Λʂ

  27. એ఻

  28. LIGɺαΠόʔΤʔδΣϯτɺάουύονɺschooɺWantedly..ͳͲͳͲ https://www.wantedly.com/campaign/real_wantedly 2014೥9݄22೔(݄)ɹ18:00ʙ22:00

  29. 8BOUFEMZΛࢧ͑ͯ͘ΕΔ εʔύʔΤϯδχΞืूதʂ IUUQTXXXXBOUFEMZDPNQSPKFDUT

  30. ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ