유니티 3D와 2D의 차이점이 무엇인지 궁금해서


각각의 프로젝트를 따로따로 생성해본 뒤, 캡쳐를 해서 비교해봤다.


생성 직후,


유니티 3D에는 빛(Directional Light)이 초기에 생성되어 있었지만, 2D에는 카메라 1개만 생성되어 있었다.


또한, 메인카메라(MainCamera) 모드에도 차이가 있었다.


유니티를 2D로 프로젝트 생성시, MainCamera 초기 화면


유니티를 3D로 프로젝트 생성시, MainCamera 초기 화면



Projection


- orthographic : 카메라가 퍼스펙티브에 상관없이 객체를 균일(uniform)하게 렌더링한다.

- perspective  : 카메라는 퍼스펙티브를 그대로 놔둔 채로 객체를 렌더링한다.



2D를 만들 것인데 3D 프로젝트를 만들었다면,,


Clear Flags 를 Solid Color로 바꿔주고, Projection만 바꿔준다면 2D 환경으로 변환할 수 있다. 

Posted by sungho88
,

Express.js로 홈페이지를 제작중이다.


HTML으로 테이블을 작성했는데 검색 기능을 추가하고 싶었다.


복잡해서 쉽게 멋진 예제를 검색하던 중,


Jquery를 이용해서 쉽게 검색할 수 있는 라이브러리를 찾았다.


Demo & Download


위 링크를 이용하여 데모 실행과 다운로드 모두 할 수 있다.


다운로드 받은 뒤, 탐색기를 이용하여 해당 디렉토리로 이동한다.


그리고 본인의 Express.js 프로젝트에 


/public/javascripts/ 에 html-table-search.js을 집어넣는다.


그 다음 layout.jade에서 



[layout.jade] 


doctype html

html

  head

    title= title

    link(rel='stylesheet', href='/stylesheets/style.css') 

    script(src='http://code.jquery.com/jquery-latest.min.js')

    script(src='/javascripts/html-table-search.js') 


  body

    block content


와 같이 선언한다. 이것은 HTML에서 head안에 <meta>와 <script> 태그를 사용하던 것과 동일하다.


참고로, layout.jade의 body 밑에 block content 대신 index.jade가 들어간다.


어쨋든, 그 다음 


[index.jade]에서


extends layout

block content

    script.
        $(document).ready(function () {
           $('table.search-table').tableSearch({
                // searchText:'Search Table',
                searchPlaceHolder:'Search...'
            });
        });

jade에서 자바스크립트를 사용하기 위해서는 script.라고 붙여주어야 한다.


그 밑에 Jquery문법을 써주면 input태그를 써주지 않아도 나온다.


물론 search-table은 table의 class명이다


(CSS에서 클래스는 점(.) 이고 id는 #이다)


즉, 

table.search-table
thead
tr ....

이 Table을 호출하는 것이다.

이렇게 되면 테이블 위에 INput Field가 생성된다.



이것의 디자인은 html-table-search.js에서 수정할 수 있다.







Posted by sungho88
,

제이쿼리를 사용하기 위해서, 설치를 해보자.


프로그램이 아니기 때문에 설치라고 하는것보다 자바스크립트 파일(.js)에서 사용하기 위한 세팅이라고 하는게 낫겠다.


먼저, Jquery를 설치하는 방법은 두 가지가 존재한다.



1. 직접 다운로드를 받아 js폴더 또는 임의의 폴더에 넣어 코드에서 해당 경로를 호출하여 사용한다.


- 다운받는 방식은 또다시 Compressed 된 것과 Uncompressed 된 것으로.가지로 나뉜다. 



나뉜다. 


2. CDN 방식을 사용하여 인터넷이 되는 환경에서 네트워크를 통해 다운로드 하지 않아도 불러와 사용할 수 있다.


- CDN = Contents Delivery Network의 약자


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


이와 같이 버전을 명시해서 사용할 수도 있지만,


<script src="http://code.jquery.com/jquery-latest.min.js"></script>


이와 같이 latest를 사용해서 가장 최신의 Jquery 배포 버전을 불러올 수도 있다.


이 문장을 HTML 내 <head> 태그 안에 집어넣으면, Jquery를 사용할 수 있게 된다.


(참고)

http://www.walterz.net/2017/11/08/cdn-%ED%99%9C%EC%9A%A9-jquery-%EC%82%AC%EC%9A%A9-%EB%B0%A9%EB%B2%95/

Posted by sungho88
,