자바 스크립트로 눈금 그리기

Question

본질적으로, 나는 Conways Game of Life와 똑같은 것은 아니지만 본질적으로 일종의 진화 시뮬레이터에 대한 내 머리 속에이 아이디어를 가졌지 만, 그들이 일치하는 부분은 둘 다 정사각형 격자를 기반으로합니다.

개인적으로는 UI를 빠르게 생성 할 수 있기 때문에 HTML + Javascript +로 작업하는 것이 좋으며, 계산 상 무거운 작업을하지 않으면 브라우저에서 JS가 괜찮은 플랫폼입니다.

지금 당장 해결해야 할 문제는 그리드 그리기 및 업데이트입니다. 나는 뭔가를 놓친 것일 수도 있지만, 80x40 그리드에 대해 이렇게 쉬운 계산적으로 가벼운 방법이없는 것 같습니다. 쉬운 방법은 비어 있지 않은 사각형의 절대 위치와 특정 배경색으로 div를 생성하는 것입니다. 그러나 그것은 60-70 가지 이상의 색 사각형보다 더 느려질 수 있습니다.

상황에 따라 다른 언어로 전환 할 의향이 있지만, HTML + JS로 쉽게 할 수있는 방법을 놓치지 않는다는 것을 알고 싶습니다.

답변을 포함해야하기 중 하나

a) 제곱은 HTML + JS

b)에 컬러 및 "이동")를 변경하고 80x40 격자 (그리 업데이트하는 합리적인 방법 합리적으로 빨리 할 수있는 또 다른 언어. 나는 DirectDraw 또는 그와 비슷한 것을 배우기 위해 며칠을 보내지 않아도되는 것을 선호한다.

Answer 1

그리드를 HTML 테이블로 만들지 않겠습니까? 결국이게 니가 원하는거야?

각 셀에 계산 된 ID를 부여하고 업데이트 할 수있는 몇 가지 javascript 함수를 만듭니다. Shoudlnt 전혀 문제가되지 않습니다.

당신은 HTML 5에서 새로운 캔버스 태그를 볼 수 있습니다.

Answer 2

작은 그리드 (< 100x100)의 경우 테이블을 사용하고 각 셀에 빠른 액세스를위한 ID를 지정하십시오.

큰 격자의 경우 캔버스 개체를 사용하거나 Java 또는 Flash 애플릿을 포함하는 것을 고려해야합니다.

Answer 3

<canvas>이 작업을 수행하는 올바른 방법 인 것 같습니다. Raphael과 같은 라이브러리는 플랫폼 간 문제를 피하는 데 도움이됩니다. 다른 옵션은 Processing.js이지만 IE에서는 작동하지 않습니다.