Designer Manual Web-N Server.0 ( 게시설정 ) N-Designer Ver. :.0.0 RC 제작 : 07. 3. 0 개정 : 07. 0. 0 e-mail:lbhsb@naver.com 네트란 http://www.netran.co.kr
목차. WEBN 프로그램설명... 3. 게시... 4.. 시뮬레이션게시... 4... 시뮬레이션게시절차... 5.. PLC 연결게시... 3... I/O 드라이버설정... 3... PLC 종류... 6... 폴링시간간격... 6...3. 타입설정... 6...4. 호스트... 6...5. 모드... 7...6. PLC 포트번호... 7...7. 베이스번호... 7...8. 슬롯번호... 7...9. PLC 태그설정... 7...0. I/O 드라이버삭제... 8... ip 설정... 9..3. 아이디, 비밀번호등록....3. 스마트폰앱게시... 8.3.. 스마트폰앱메뉴구성... 8.3.. 스마트폰앱게시절차... 9
. WebN 프로그램설명 WebN 프로그램이란 N-Designer 에서작화한작업을게시후 N-Show 프로그램이나웹브라우저 ( 구글크롬 ), 스마트폰에서감시제어를할수있는프로그램입니다. 게시를하기위해서는사용자컴퓨터의내부 ip 나고정 ip 를 N-Designer 프로그램에서설정하고웹브라우저에서작화한작업을게시후확인하기위해서는사용자아이디, 비밀번호를 N-Designer 에서등록해야합니다. N-Designer 프로그램메뉴에서연결되는 PLC 정보를입력하고연결되는사용자 PC 의내부 ip 나고정 ip 를 PLC 에서설정합니다. PC N-SHOW 프로그램 N-Designer (PLC ip 정보입력 ) 게시 웹브라우저, 폰 TCP, SERIAL 통신 ( 아이디, 비밀번호인증 ) PLC <WebN 프로그램구성도 > * 게시 : N-Designer 에서작화한작업정보를 N-Show 프로그램, 브라우저에보내주는과정 * N-Show 프로그램 : N-Designer 에서작화한작업의감시제어를할수있는프로그램 3
. 게시 게시는 N-Designer 에서작화한작업을 PLC 에연결하지않고시뮬레이션으로감시, 제어하는 [ 시뮬레이션게시 ] 와 PLC 에연결하여웹브라우저에서감시제어하는 [PLC 연결게시 ] 가있습니다. 시뮬레이션게시는사용자컴퓨터로컬 ip 로게시하기때문에통신설정이간단하고 PLC 연결게시는내부 ip 또는고정 ip 설정및웹브라우저인증아이디, 비밀번호를등록해야하기때문에시뮬레이션게시보다는설정이복잡합니다... 시뮬레이션게시 N-Designer 프로그램에서사각형과버튼을생성하고버튼 (Digital Toggle 설정 ) 을클릭할때마다사각형 색상이 ON 시 Red, OFF 시 Silver 로변경되는애니메이션동작상태를시물레이션게시로감시제어를확인할 수있습니다. 4
... 시뮬레이션게시절차 ) [ 프로젝트탭 태그메뉴 ] 를클릭하면태그편집기창이나타납니다. 상단메뉴에서프로젝트탭을클릭합니다. [ 태그아이콘 ] 을클릭합니다. 5
) 태그편집기좌측설정창에서디지털을클릭하고 [ 추가아이콘 ] 을클릭하면목록에디지털태그가 추가됩니다. 3 디지털태그 4 좌측설정창에서디지털을클릭합니다. [ 추가아이콘 ] 을클릭합니다. 3 목록에디지털태그가생성됩니다. 4 확인버튼을클릭하고태그편집기를종료합니다. 6
3) 사각형을더블클릭하면애니메이션설정창이나타납니다. 더블클릭 4) 애니메이션설정창에서사각형색채우기색변경애니메이션을설정합니다. 3 4 애니메이션탭을클릭합니다. 채우기색변경애니메이션을선택합니다. 3 찾아보기를클릭하여태그편집기에서생성한태그를선택합니다. 7
4 ON 시 Red, OFF 시 Silver 로설정합니다. 5) 버튼을더블클릭하면사용자입력설정창이나타납니다. 6) 사용자입력설정창에서버튼설정을합니다. 3 4 5 사용자입력탭을클릭합니다. 8
디지털버튼을체크합니다. 3 [ 태그선택아이콘 ] 을클릭하여태그편집기에서생성한태그를선택합니다. 4 버튼종류를 DigitalToggle 로설정합니다. 5 확인버튼을클릭합니다. 7) 저장아이콘을클릭하여설정한정보를저장하고게시아이콘을클릭하여게시를진행합니다. [ 저장아이콘 ] 을클릭합니다. [ 게시아이콘 ] 을클릭합니다. 9
8) 게시설정창이나타나며호스트에사용자 PC 의내부 ip 를입력하고포트는고정값입니다. 호스트 ip 7.0.0. 을입력합니다. 다음버튼을클릭합니다. 9) 게시설정창의데이터메뉴에서 N-Designer 에서설정한데이터정보를 N-Show 프로그램으로 보내줍니다. 다음버튼을클릭합니다. 0
0) 게시경로를지정합니다. (publish 폴더경로로지정 ) 3 publish 폴더경로를지정합니다. 기존게시했던파일정보를삭제합니다. 3 다음버튼을클릭합니다. ) 게시설정창에서설정한정보를확인할수있습니다. 설정한정보를확인할수있습니다. 게시버튼을클릭합니다.
) 게시가완료되면닫기버튼을클릭합니다. 3) 바탕화면에서 [N-Show 아이콘 ] 을클릭하면 N-Desiger 에서작화한작업이 N-Show 프로그램화면에 나타납니다. 4) N-Show 프로그램화면에서버튼을클릭하면 ON 시 Red, OFF 시 Silver 로사각형의채우기색상이변경 되는것을확인할수있습니다. 버튼 ON 시 버튼 OFF 시
.. PLC 연결게시 PLC 연결게시는 N-Designer 프로그램에서작화작업후 [ 태그편집기설정창에서 I/O 드라이버설정 ], [ip 설정 ], [ 사용자편집기에서웹브라우저인증아이디, 비밀번호를생성 ] 하면웹브라우저에서감시, 제어를할 수있습니다.... I/O 드라이버설정 ) N-Designer 프로그램상단메뉴에서 [ 프로젝트탭 태그아이콘 ] 을클릭하면태그편집기설정창이나타납니다. 프로젝트는 http://www.netran.co.kr 홈페이지공유자료에서 example_project.zip (LS XGB PLC 연결예제파일 ) 을다운로드하여 N-Designer 프로그램에서열어보기를합니다. 상단메뉴에서프로젝트탭을클릭합니다. [ 태그아이콘 ] 을클릭합니다. 3
) 태그편집기설정창에서 [ 편집아이콘 ] 을클릭하면 I/O 드라이버설정창이나타납니다. 설정창에서연결되는 PLC 의 I/O 드라이버정보를설정할수있습니다. 상단메뉴에서프로젝트탭을클릭합니다. [ 태그아이콘 ] 을클릭합니다. 4
3) I/O 드라이버설정창에서 PLC 종류를선택및설정을할수있습니다. (LS XGB PLC 기준설정 ) 3 4 5 6 7 8 9 0 PLC 종류 PLC 가데이터를폴링하는시간간격 3 타입설정 (Tcp, Serial) 4 호스트 : PLC ip 입력 5 모드 : PLC 종류선택 6 PLC 포트번호 ( 연결된 LS PLC 포트번호 : 004) 7 베이스번호 ( 베이스가 대라베이스번호 0 으로설정 ) 8 슬롯번호 ( 베이스의 4 번째슬롯에연결하여슬롯번호 3 으로설정 ) 9 PLC 태그설정 0 I/O 드라이버삭제 5
... PLC 종류 PLC 의종류를 Ls, Cimon, Modbus, Dde, Other 로선택하여설정할수있습니다.... 폴링시간간격 PLC 가폴링하는시간간격을설정할수있습니다....3. 타입설정 타입을 Tcp, Serial 로설정할수있습니다. Tcp Tcp 설정은호스트에서 PLC ip, 포트번호를입력하고모드를선택하고 Tcp 통신으로설정할베이스, 슬롯 번호를입력합니다. Serial Serial 설정은통신포트를설정하고시리얼통신설정디폴트값 9600, 8,, N 으로설정합니다. 통신포트는연결시장치관리자에서연결되는통신포트번호로설정을합니다....4. 호스트 PLC ip 를입력하여설정합니다. 6
...5. 모드 I/O 드라이버를 Ls, 타입을 Tcp 로설정하면모드를 LSIS-XGT, LSIS-GLOFA, MASTER-K 중선택하여설정할 수있습니다....6. PLC 포트번호 설정한 PLC 의포트번호를입력하면됩니다....7. 베이스번호 베이스는슬롯들이구성되어있어 PLC 모듈을슬롯에부착하여연결할수있습니다. 첫번째베이스와 I/O 드라이버와연결하면베이스번호는 0, 두번째베이스와연결되면베이스번호는 로설정하며베이스대수가증가하면 0,,,3,4 의순서로베이스번호가증가합니다....8. 슬롯번호 베이스에구성된슬롯좌측부터 0,,,3,4 의순서로슬롯번호가증가합니다....9. PLC 태그설정 I/O 드라이버설정창에서편집메뉴를클릭하여설정한 PLC 의주소를설정하고설정한주소에태그를 연결할수있습니다. 7
[ 추가아이콘 ] 을클릭하여디바이스아이콘설정, 변수타입, 주소를설정할수있고설정한주소에 태그를연결할수있습니다. 3 4 5 6 7 디바이스영역설정 변수타입 3 베이스번호 4 슬롯번호 5 시작주소설정 6 주소개수설정 7 주소와연결되는태그개수 드래그앤드롭...0. I/O 드라이버삭제 PLC 에설정한정보를 [ 삭제아이콘 ] 을클릭하여삭제할수있습니다. 8
... ip 설정 N-Designer 에서작화한프로젝트를게시하여웹브라우저에서감시제어를하려면좌측프로젝트설정 창에서속성메뉴를더블클릭하여 ip 를설정합니다. ) 속성메뉴를더블클릭하면프로젝트설정창이나타납니다. 3 좌측에프로젝트탐색기창이나타납니다. 프로젝트탐색기창에서속성메뉴를더블클릭합니다. 3 속성메뉴를더블클릭하면프로젝트설정창이나타납니다. 9
) 프로젝트설정창에서연결메뉴를클릭하고데이터서버와파일서버에내부 ip 또는고정 ip 를입력 합니다. 3 연결메뉴를클릭합니다. 데이터서버호스트 ip 에 WebN 프로그램이실행되는서버의 ip 를입력합니다. Web-N 프로그램이외부의서버에서실행될경우외부서버 IP 를입력합니다. 3 파일서버호스트 ip 에 N-Designer 페이지가게시되는서버의 IP 를입력합니다. WebN 프로그램이실행되는 PC 와 N-Designer 페이지가게시되는 PC 가동일하면사용자컴퓨터공유기에 연결되어있는 ip 를입력하시면됩니다. 이더넷상태창에서자세히보기버튼을클릭하면 ip 설정정보가나타납니다. 0
..3. 아이디, 비밀번호등록 N-Deisgner 에서작화된작업을웹브라우저에서감시제어를하려면아이디, 비밀번호를등록해야합니다. ) [ 프로젝트탭 사용자아이콘 ] 을클릭하여사용자편집기창에서아이디와비밀번호를생성할수 있습니다. 프로젝트탭을클릭합니다. [ 사용자아이콘 ] 을클릭합니다.
) 사용자편집기창에서 [ 추가아이콘 ] 을클릭하면사용자정보를입력할수있는설정창이 나타납니다. 3) 사용자정보설정창에서사용자이름, 닉네임, 아이디, 비밀번호를입력하고확인버튼을클릭하면 설정이완료됩니다. 사용자정보를입력합니다. 확인버튼을클릭합니다.
4) 아이디와비밀번호가등록되고활성화, 사용에체크합니다. 5) 구글크롬브라우저를클릭하여실행합니다. 6) 구글크롬주소창에사용자컴퓨터에설정된 ip 를입력합니다. 3
7) 주소창에 ip 를입력하면로그인화면이나타나고사용자정보설정창에서생성한아이디와비밀번호를 입력합니다. 아이디와비밀번호를입력합니다. 사용자아이디버튼을클릭하면감시제어화면이나타납니다. 4
8) 구글크롬브라우저화면에서 DO 버튼을클릭하면 LS XGB PLC 와웹브라우저에서동일하게 ON, OFF LED 가 변경되며 LS PLC 의 DI 값이 0, 로값이변경되면웹브라우저화면의 DI 상태도동일하게상태가변경됩니다. Page- 을클릭하면온도축력화면으로이동됩니다 5
9) page- 화면에서는 LS-XGB PLC 에온도센서를연결하여온도를설정하면웹브라우저화면에온도값이 출력됩니다. page- 를클릭하여다음페이지로이동하면실시간리얼타임그래프를확인할수있습니다. 6
0) page- 화면에서는우측슬라이드버튼을상하로이동하여 LS-XGB PLC 의 AI 값을실시간그래프로확인 할수있습니다. 7
.3. 스마트폰앱게시.3.. 스마트폰앱메뉴구성 스마트폰화면에서좌측상단의 [ 메뉴아이콘 ] 을클릭하여메뉴구성을확인할수있습니다. 6 3 4 5 아이디 언어설정 3 푸쉬아이디설정 ( 현재미사용 ) 4 ip 설정 5 앱연결상태 8
.3.. 스마트폰앱게시절차 webn 프로그램을공유기의내부아이피로설정하여스마트폰으로앱게시를하려면 webn 프로그램과연결된공유기의 wifi 와스마트폰을연결하여야앱게시를진행할수있습니다. webn 프로그램을고정아이피로설정하면스마트폰에서별도의연결설정없이앱게시를진행할수있습니다. 또한 webn 프로그램이설치된 PC 의 windows 방화벽을사용안함으로설정하여야정상적으로앱게시를 진행할수있습니다. 9
) 스마트폰에서앱게시를하려면안드로이드앱스토어에서앱을다운로드하여설치합니다. ) 앱스토어검색창에 netran 을입력하여앱을검색하면 webn 프로그램앱이나타납니다. webn 프로그램앱에서설치버튼을클릭합니다. 30
3) 설치후스마트폰화면에생성된 webn 아이콘을클릭합니다. 4) 설치후 push ID 설정화면이나타나면 Not Use 를클릭합니다. 3
5) ip 설정화면으로이동하려면 Modify 버튼을클릭합니다. 3
6) ip 설정화면에서 Host 를고정아이피또는내부아이피를입력하고 Confirm 버튼을클릭합니다. Port 와 Path 는고정값이입력되어있습니다. 33
7) 로그인화면에서아이디와비밀번호를입력하고 Login 버튼을클릭하면게시화면이나타납니다. 34
8) 웹브라우저와동일하게스마트폰에서도감시제어를할수있습니다. 스마트폰화면을가로보기로설정을하면아이콘을더확대하여감시제어를할수있습니다. 35