Optimize Collision Detection with Octree

Transcript

1. 1
   Optimize Collision Detection
   with Octree
   Presented by Akihiro Oyamada (@yomotsu)
   Frontend Engineer at PixelGrid, Inc.
   Oct 7, 2014
   

   View Slide

2. View Slide

3. View Slide

4. View Slide

5. View Slide

6. View Slide

7. 7
   Collision Detection
   vs 524 Tris
   

   View Slide

8. 8
   vs only about 30 Tris

   by partitioning
   

   View Slide

9. ෼ׂۭͨؒ͠͸
   .PSUPOPSEFSʹैͬͯฒ΂Δ
   9
   

   View Slide

10. View Slide

11. View Slide

12. View Slide

13. View Slide

14. View Slide

15. 15
    // maxDepth4のoctreeのツリー構成例
    !
    octree.nodes = [
    [node], //level 1 (node*1個)
    [node,node...] //level 2 (node*8個)
    [node,node...] //level 3 (node*64個)
    [node,node...] //level 4 (node*512個)
    ]
    

    View Slide

16. 16
    // node単体の構成例
    !
    OctreeNode = function ( params ) {
    !
    this.tree //
    this.depth //
    this.mortonNumber //
    this.min //
    this.max //
    this.trianglePool //
    !
    }
    

    View Slide

17. 17
    -FWFMͷͷࢠϊʔυΛٻΊΔʹ͸ʜ
    

    View Slide

18. 18
    var i;
    !
    var parentMotonNum = 1;
    !
    for ( i = 0; i < 8; i ++ ) {
    !
    console.log( ( parentMotonNum << 3 ) + i );
    !
    }
    !
    // 8, 9, 10, 11, 12, 14, 15
    

    View Slide

19. 19
    -FWFMͷͷ਌ϊʔυΛٻΊΔʹ͸ʜ
    

    View Slide

20. 20
    var childMotonNum = 10;
    console.log( childMotonNum >> 3 );
    !
    // 1
    

    View Slide

21. ϏοτγϑτͰ

    ٻΊΒΕΔ
    21
    

    View Slide

22. ϊʔυʹ஍ܗͷ

    τϥΠΞϯάϧΛొ࿥͢Δ
    22
    

    View Slide

23. ""##WT5SJBOHMF
    ϊʔυ͸""##
    
    23
    

    View Slide

24. View Slide

25. View Slide

26. NBY%FQUIΛʹͨ͠Β

    $ISPNF͕ࢭ·ͬͨ

    ?
    ?
    ?
    ʜ ?
    ݸͷϊʔυ͕Ͱ͖Δ
    26
    

    View Slide

27. ܁Γฦ͠ͷ਺ΛݮΒ͢͜ͱ͕Ͱ͖
    ͨ
    27
    

    View Slide

28. %Ͱ͸͋Δ͚ΕͲɺ

    ஍ܗ͸ฏ໘ʹ͍ۙͷͰɺ

    2VBEUSFF %
    Ͱ΋͍͍͔΋
    .PSUPO/VNͱϏοτγϑτ
    
    28
    

    View Slide

29. • THREE.RayΛ΍Ίͯɺಠࣗͷ

    Segment-Triangleަࠩςετʹஔ͖׵͑
    • ίϝϯτΛେྔʹೖΕͨ(೔ຊޠ͚ͩͲ)
    29
    ଞʹ΍ͬͨ͜ͱ
    

    View Slide

30. 30
    gl.finish();
    @yomotsu
    

    View Slide