OpenGL 기초 요약 1: 기본 타입, 색상 변경, 점, 선, 사각형, 다각형

출처: http://soen.kr/lecture/library/opengl/opengl-4.htm 1. 기본 타입 2. 함수 형식 glVertex3i(1,2,3); int arv[]={1,2,3}; glVertex3iv(arv); 3차원상의 좌표는 x, y, z 세가지 값으로 표현하는 것이 원칙적이되 분수 표현을 위해 w로 분모를 지정할 수 있다. 또 평면상의 정점인 경우는 z 좌표를 생략하고 x, y만 밝힐 수도 있다. w가 생략되면 1로 간주되며 z를 생략하면 0으로 간주한다. 더보기…

자바스크립트: 캔버스(Canvas) 에서 픽셀 단위로 다루기

모질라 재단 ‘픽셀 다루기’ 링크 data 속성은 원시 픽셀 데이터를 보기 위해 액세스할 수 있는 Uint8ClindedArray를 반환합니다. 각 픽셀은 네 개의 1바이트 값(적색, 녹색, 파란색, 알파, 순서대로 “RGBA” 형식)으로 표현됩니다. 각 색상 구성요소는 0 ~ 255 사이의 정수로 표시됩니다. 각 구성요소는 배열 내에서 연속적인 색 바이트 값이 할당되며, 최상단 좌측 더보기…

자바스크립트: 색상 이름을 rgb 코드로 바꾸기.

예를 들어 "red"라고 입력하면 red의 rgb에 해당하는 [255, 0, 0]의 색상 정보를 반환하는 프로그램을 만들어 보겠습니다. 일반 색상명으로 입력했는데 나중에 투명도를 적용하기 위해 rgba 등으로 바꾸고 싶을 때 사용하면 좋을 것 같네요. function getRGB(colorStr) { let el = document.createElement(“div”); el.style[“background-color”] = colorStr; document.body.appendChild(el); let style = window.getComputedStyle(el); let color = 더보기…

자바(Java)에 프로세싱(Processing) 라이브러리 Minim을 설치하는 방법 + 예제: 주파수 그래프가 있는 오디오 플레이어

노래 파일을 불러와 500 구간으로 쪼갠 뒤 각각 구간의 평균 주파수를 리스트에 삽입해 사운드클라우드의 플레이어 비슷한 효과를 내는 예제입니다. 이 기능을 사용하려면 Minim이라는 Processing기반의 라이브러리가 필요합니다. (참고: Processing: 미디어아트 프로그래밍 언어 기초)   Minim을 사용해 음악 파일의 주파수를 분석  주파수 분석은 고속 푸리에 변환(FFT) 방식.  Minim은 음악 재생, 분석과 관련하여 다양한 기능을 더보기…

유닉스/리눅스 기초 명령어 (dir, cd, pwd, tar, sh, mv, ps)

dir: 디렉토리/파일 목록 표시 cd .. : 이전 디렉토리로 이동 (cd 다음에 [공백] .. 이므로 주의. 공백 없는 cd..는 작동하지 않음. 윈도우 cmd와의 차이점이므로 주의.) pwd: 현재 어디에 있는지 전체 경로로 표시 mv [이동 대상 파일] [이동할 디렉토리]: 파일 이동 mv [원래 파일/디렉토리명] [바꿀 파일/디렉토리명]: 파일 이름 변경(??) tar tvf [tar 더보기…

JMeter: 서버 부하 테스트 프로그램 (기초 사용법)

다운로드: https://jmeter.apache.org/download_jmeter.cgi (자바 8 이상 필요합니다) 윈도우 기준으로 압축을 푼 후 bin/ApacheJMeter.jar (또는 jmeter.bat) 실행합니다. 로그인 등의 과정이 없는 단순한 트래픽 테스트를 위해 예제 사이트로 blazedemo.com을 사용합니다.     Number of Threads(users): 사용자 수 Ramp-up Periods(초): 사용자 수가 모이는(만들어지는) 시간을 설정합니다. 유저 수가 100인데 Ramp-up Period가 10이라면 10초동안 100명의 사용자를 만들어내는 더보기…

Node.js: Ace (Syntax Highlighter) 설치하기 (Webpack 4 기준)

참고 사이트 https://github.com/ajaxorg/ace/blob/master/demo/webpack/demo.js#L12 https://ace.c9.io/#nav=embedding   npm 설치하기 npm i ace-builds –save-dev npm install @types/ace –save-dev npm i file-loader –save-dev   메인 js 파일 작성 require(‘./dist/test.css’) // CSS 로딩 방법 import ace from ‘ace-builds/src-noconflict/ace’ import “ace-builds/webpack-resolver”; // npm i file-loader –save-dev var editor = ace.edit(“editor”); editor.setTheme(“ace/theme/monokai”); editor.session.setMode(“ace/mode/javascript”);   템플릿 HTML 작성 더보기…

자바스크립트: JSFiddle 간략하게 흉내내기 (페이지의 소스를 편집 후 스스로 반영)

JSFiddle(https://jsfiddle.net/) 이라는 사이트가 있는데 웹 브라우저 내에서 HTML, JS 코드를 입력하면 즉석에서 결과를 보여주고 공유할 수 있는 사이트입니다. document 객체와 document.write 기능을 이용해서 비슷하게 흉내내볼 수 있습니다. 라이브러리 등의 예제 페이지에서 최초에 작성된 소스를 먼저 보여주고 편집도 가능하게 하고 싶을 때 사용하면 되겠습니다. This file contains bidirectional Unicode text that 더보기…

Java, Spring Boot 예제: 이미지를 클라이언트로부터 받아 파워포인트로 만들기

작업순서는 다음과 같습니다. 사용자(클라이언트, 크롬 등 웹브라우저 이용하는 사람)는 이미지파일을 브라우저에서 업로드한다. 서버에서 그 이미지를 받아서 파워포인트 파일에 삽입한다. 만들어진 파워포인트 파일을 다시 사용자한테 반환한다. 사용자는 다운로드 받을 수 있다.   파워포인트는 org.apache.poi 라는 라이브러리를 사용해 만들 수 있으며 depency는 다음과 같습니다. <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi</artifactId> <version>3.17</version> </dependency> <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi-ooxml</artifactId> <version>3.17</version> 더보기…

Node.js: Webpack 4 추가 설정 (CSS, HTML, dev-server) 빌드 및 배포

Node.js: 설치, 코드 실행 (Windows 기준) Node.js: Webpack 설치하기 (Webpack 4 버전 기준) 1. 아래 명령어들을 터미널에 입력합니다. npm install –save-dev html-webpack-plugin npm install –save-dev css-loader npm install –save-dev style-loader npm install –save-dev webpack-dev-server   2. webpack.config.js 파일을 다음과 같이 작성합니다. // webpack.config.js var HtmlWebpackPlugin = require(‘html-webpack-plugin’); var path = 더보기…