3D polyhedra 캔버스 태그 또는 SVG를 사용하는 JavaScript 라이브러리가 있습니까? Platonic solids의 렌더링을 만들고 싶다고 가정 해 봅시다. 어떻게하면 가장 좋은 방법일까요? FWIW, Safari 및 Chrome과 같은 WebKit 기반 웹 브라우저에만 관심이 있습니다.JavaScript를 사용하여 3D 다면체 모델
3D triangles을 렌더링하는 방법에 대한 멋진 데모를 보았습니다.하지만 폴리 에지를 임의의면으로 확장하는 방법은 무엇입니까?
이 도서관에서보세요 : SVG-VML-3D이
그것은 SVG를 사용하고 MSIE 다시 VML에 떨어진다. 그들은 플라톤 솔리드가있는 데모가 있습니다. 나는 웹킷 브라우저를 편리하게 사용하지는 않지만 거기에서도 잘 작동 할 것이라고 가정한다.
대부분의 3D 라이브러리는 삼각형을 일반화합니다. 3면 이상이있는 다각형을 원하면 삼각형으로 세분하고 삼각형을 그립니다. 플라톤 솔리드에만 관심이 있다면, 각면의 정점을 평균하여 각면의 삼각형을 쉽게 구할 수 있고, 그 다음에 그 중심과 두 개의 인접한면을 사용하면 꽤 쉬울 것입니다. 얼굴의 꼭지점은 삼각 화를 제공합니다.
진실을 말하자면, 나는 "임의의"수 (최대 100 개 이상)의 다면체를 모델링하고 싶습니다. 저는 3D를 처음 접했기 때문에 제가 말할 수있는 lib가 있기를 바랬습니다. 17면을 가진 다면체를주세요. :-) –
나는 그런 것을 본적이 없다. 그러나 단지 5 개의 플라톤 고형물이 있습니다. 임의의 다면체에 대해서, 당신은 플라톤 솔리드만큼 좋은 것을 얻지 못할 것입니다. 한 구체에 특정 수의 점을 던져서 그들이 안정화 될 때까지 서로 밀어 붙일 수 있습니다. – Nosredna
짝수 인 경우에 만족합니다. 요점은, 나는 많은면을 가진 다면체를 사용자가 요청하고 싶다. SVG 솔루션은 상당히 견고합니다. –
질문에 대한 직접적인 대답은 아니지만 WebKit만을 언급하면서 나는 최근에 Webkit에 추가 된 새로운 3D CSS Transform 지원을 지적했다고 생각했습니다. 이렇게하면 자바 스크립트를 사용하지 않고도 원하는 것을 할 수 있습니다. 3D 다각형의 예를 보지 못했지만 거기에 큐브 등의 예가 있습니다 (예 : here).
좀 더 복잡한 데모 here에는 직사각형의 고리가 있습니다. 당신이 할 수있는 일에 대한 진정한 취향 (애니메이션 용 자바 스크립트를 사용하고 있지만)은 Snow Stack 데모를 참조하십시오.
그게 흥미 롭군요. 나는 최근 2D 변환으로 많은 것을 실험 해왔다. (http://segdeha.com/experiments/css-transitions/). 임의의면을 가진 다면체를 만드는 데 어떻게 적용될 수 있습니까? –
@Andrew : 패스, 나는 아직 이걸 가지고 아무 것도 구현하지 못했습니다. 최근에 들어 봤습니다. 사각형으로 시작하여 삼각형으로 변형해야 할 수도 있습니다 (원시 변환 행렬에 액세스 할 수있는 것처럼 보입니다). – DaveR
나는이 아이디어를 좋아한다. 구현하는 데 아주 가볍고 (아마도 모든 CSS). 위의 SVG 솔루션이 성가신 경우,이를 추적하고 블로그를 작성합니다. –
이것은 티켓 일 수 있습니다. 고마워, 앤드류! –