묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
저 아바타 프로그램을 구현한다고했다가...답변을 받았는데요.
2002.04.16 19:55
--질문
아바타 프로그램을 구현하려고하는데....
도무지 감이 안잡히네요.....
누가 도움좀 주세요
간단한 도움말이라도 좋으니 리플달아주세요
공개소스는 찾아보려해도 없네요..
관련사이트도 좋으니 링크해주세요~
부탁드립니다~
--답변
Legend (2002-04-15 01:00:44)
웅.. 답변 쓰던거 다 날라 갔네요.. 에공.. 길게 쓰면 로그 아웃되버리네..
짧게 말씀드리면 아바타 구현은 자바스크립트로 하고 아바타 데이터는 데이터 베이스를 이용합니다
레이어는 z-index를 순차적으로 늘린 것을 아이템 종류만큼 만듭니다.
레이어들은 모드 절대위치 좌표로 만든다음에 하나의 상대좌표 레이어에 모두 넣습니다. 그래야 고정되겟지요.
다음에 각 레이어에는 보이지 않는 투명 이미지를 넣어둡니다. 다음에 파일이름은 레이어에 들어 있는 레이어에 들어있는 이미지의 name과 조합으로 만듭니다.
<img name=hair src="투명이미지"> 이미지들은 hair01.gif, hair02.gif, hair03.gif.. 등으로 만들지요.
나머지 아이템도 동일한 방법으로 만듭니다. 다음 이런 아이템을 적당한 데이터 베이스에 저장해 두지요.
a회원이 있다면 아바타 필드에 hair03;head02;eyes08;.. 이런식으로 저장을 해둡니다.
앞의 4자까지 이미지이름으로 사용한다고 생각합니다.
나중에 불러와서는 ;표시로 나누어 자바스크립트에 배열로 넘겨주면 되겟지요..
var item= new Array("hair03", "head02", "eyes08"...) 이런식으로요..
다음 준비된 레이어안의 이미지에 이미지를 넣으면 되겠지요.
for(i=0; i<item.length; i++)
document.images[item[i].substring(0,4)].src=item[i]+".gif"
요렇게 하면 각각 지정된 이미지에 종류별로 이미지가 넣어지겠지요. 대충 핵심 구현내용은 이렇네요.
아바타를 구현하려면 레이어를 많이 사용하기 때문에 자바스크립트로 클라이언트에서 처리하여야 쉽습니다.
php는 아이템 하나 바꿀때마다 페이지를 리로드해야하며 그 데이터들 역시 계속 다음 페이지로 넘겨줘야
하는데 php만으로 구현하기는 불가능할 겁니다. 주는 자바스크립트로 하고 그냥 데이터베이스에 저장하는 정도만 php로 하면 좋을 겁니다.
이런 답변을 받았습니다......
우선 답변해주신 Legend님께 감사드려요....
그런데 제가 자바스크립트는 백지상태라;;
혹시 저기에 쓰이는 자바스크립트를 아시는분은 좀 알려주셨으면해서요....
아님 관련사이트라도... 부탁드립니다.
아바타 프로그램을 구현하려고하는데....
도무지 감이 안잡히네요.....
누가 도움좀 주세요
간단한 도움말이라도 좋으니 리플달아주세요
공개소스는 찾아보려해도 없네요..
관련사이트도 좋으니 링크해주세요~
부탁드립니다~
--답변
Legend (2002-04-15 01:00:44)
웅.. 답변 쓰던거 다 날라 갔네요.. 에공.. 길게 쓰면 로그 아웃되버리네..
짧게 말씀드리면 아바타 구현은 자바스크립트로 하고 아바타 데이터는 데이터 베이스를 이용합니다
레이어는 z-index를 순차적으로 늘린 것을 아이템 종류만큼 만듭니다.
레이어들은 모드 절대위치 좌표로 만든다음에 하나의 상대좌표 레이어에 모두 넣습니다. 그래야 고정되겟지요.
다음에 각 레이어에는 보이지 않는 투명 이미지를 넣어둡니다. 다음에 파일이름은 레이어에 들어 있는 레이어에 들어있는 이미지의 name과 조합으로 만듭니다.
<img name=hair src="투명이미지"> 이미지들은 hair01.gif, hair02.gif, hair03.gif.. 등으로 만들지요.
나머지 아이템도 동일한 방법으로 만듭니다. 다음 이런 아이템을 적당한 데이터 베이스에 저장해 두지요.
a회원이 있다면 아바타 필드에 hair03;head02;eyes08;.. 이런식으로 저장을 해둡니다.
앞의 4자까지 이미지이름으로 사용한다고 생각합니다.
나중에 불러와서는 ;표시로 나누어 자바스크립트에 배열로 넘겨주면 되겟지요..
var item= new Array("hair03", "head02", "eyes08"...) 이런식으로요..
다음 준비된 레이어안의 이미지에 이미지를 넣으면 되겠지요.
for(i=0; i<item.length; i++)
document.images[item[i].substring(0,4)].src=item[i]+".gif"
요렇게 하면 각각 지정된 이미지에 종류별로 이미지가 넣어지겠지요. 대충 핵심 구현내용은 이렇네요.
아바타를 구현하려면 레이어를 많이 사용하기 때문에 자바스크립트로 클라이언트에서 처리하여야 쉽습니다.
php는 아이템 하나 바꿀때마다 페이지를 리로드해야하며 그 데이터들 역시 계속 다음 페이지로 넘겨줘야
하는데 php만으로 구현하기는 불가능할 겁니다. 주는 자바스크립트로 하고 그냥 데이터베이스에 저장하는 정도만 php로 하면 좋을 겁니다.
이런 답변을 받았습니다......
우선 답변해주신 Legend님께 감사드려요....
그런데 제가 자바스크립트는 백지상태라;;
혹시 저기에 쓰이는 자바스크립트를 아시는분은 좀 알려주셨으면해서요....
아님 관련사이트라도... 부탁드립니다.
댓글 3
-
Legend
2002.04.16 23:56
-
이호한
2002.04.17 00:54
아바타 서비스하는 포탈에 가서 view source해서 분석해보시는게 제일 좋을겁니다. -
pupstar
2002.04.17 13:00
지금 제가 개인적으로 제로보드와 연동 아바타 프로그램을 제작중에 있습니다.
길게는 한달 정도 걸릴것 같구요...
개발이 완료되면 홈페이지 오픈과 함께 여기에도 올려놓을께요...
^^;
(일반 상용 사이트의 아바타는 모두 Jscript로 처리, 서버스크립트는 거의 사용안함)
PHP로만으로도 불가능하진 않지만. 코딩양이 자바의 비해 엄청나게 많아지고
또 서버 부담도 많이 주지요.
그리고.. 아래코드가 아바타 프로그램의 핵심인데. ^^;
아래 코드만으로도 아바타 표시 문제는 해결된 거나 마찬가집니다.
var item= new Array("hair03", "head02", "eyes08")
for(i=0; i<item.length; i++)
document.images[item[i].substring(0,4)].src=item[i]+".gif"