3

three.js에서 나는 기본적인 '영웅 만들기'프로그램을 만들었습니다. Elder Scrolls가 머리, 몸체 등을 스와핑하여 완전한 캐릭터를 만드는 것과 비슷합니다. 나는 다른 사용자가 같은 영웅을 편집하게함으로써 더 대화식으로 만들고 싶습니다. 각 사용자는 서버에서 동일한 JSON 파일을 읽습니다.Three.js와 MVC

내 코드를 더 잘 구조화하려면 MVC 패턴을 사용하고 싶지만 적용 방법에 대해 혼란스러워합니다. 내 모든 이벤트 리스너가 컨트롤러가 될 것이라고 생각하지만 뷰는 내 three.js render()이고 모델은 기본 JSON뿐입니다. 특히이 그래픽 도메인에 MVC를 적용하는 것이 큰 문제입니다. 이것이 매우 나쁜 형태 인 경우, 다른 패턴/구조에 대한 제안이 있습니까?

+0

당신을 위해 뭔가를 찾았습니까? – Noz

+0

불행히도, 아니오. 결국에는 코드를 조직화 된 모듈로 구성했습니다. 어쨌든 몇 가지 자유 시간을 가지면 webgl mvc 프레임 워크가 재미있는 프로젝트 일 수 있습니다 :) – jthompson

답변

0

MVC와 브리지 패턴을 조합하여 사용할 수 있습니다.

이 조합에서는보기를 추상화하고 브리지 패턴을 사용하여보기를 여러 가지 다른 형식으로 만들 수 있습니다.

다음 링크는 당신을 도울 수 있습니다 http://www.oodesign.com/bridge-pattern.html

0

쉽게 이해하기 위해, 당신이 고려할 수 :

var modelObject = {}; 
var viewObject = {}; 
var controllerObject = {}; 

modelObject.str = "Welcome"; 

viewObject.showStr = function(modelObject) { 
    console.log(modelObject.str); 
} 

controllerObject.handler = function() { 
    viewObject.showStr(modelObject); 
} 

이제 등 onclick 동안 handler 또는 이벤트로 함수를 호출 할 수 있습니다,

일반적으로 모델은 데이터/데이터 소스의 추상화입니다.

1

보기 층은해야

  • 는 렌더링 논리를
  • 프로세스 사용자 입력을 담은
  • 와 동기화하여 three.js를를 막고있는 물체를 (전략 패턴을 사용하여) 컨트롤러 레이어에게 전달 모델

컨트롤러 레이어해야 :

  • 사용자 입력을 처리하고 모델을 업데이트하십시오.

모델이 주요 항목입니다. 그들은 3 개의 .js 관련된 기능을 가져서는 안됩니다.

MVC와 Three.js를 결합하는 방법을 설명하는 블로그 게시물 (http://hecodes.com/2016/07/using-mvc-pattern-for-building-complex-three-js-applications/)을 작성했습니다.

도움이 될 수도 있습니다.