본문 바로가기

Javascript139

중복없는 난수 배열를 만드는 함수 중복없는 난수 배열을 만드는 함수는 어렵지 않을거 같지만 생각해서 바로 짜려고 하면 시간이 조금 걸린다.일단 배열에 숫자를 순서대로 넣어주고 후에 그 숫자를 랜덤으로 섞는 방식을 쓴다. 프로그램을 짜는도중 사용한 일이 있어서 찾아봤더니 누군가 함수 짜 놓은것을 제공하고 있었다.아래는 그 링크이다. https://m.blog.naver.com/PostView.nhn?blogId=javaking75&logNo=140163486807&proxyReferer=https%3A%2F%2Fwww.google.co.kr%2F 2017. 11. 28.
node.js에서 promise 함수를 동기화로 만들기 js에서 promise 함수는 일반적으로 비동기 함수다.하지만 최근 node.js에서 promise 함수를 동기로 써줄일이 생겼다.처음엔 promise 함수를 실제 함수로 변형해 보려고 했지만 그 구조를 정확히 몰랐기에 반환값이 자꾸만 이상하게 날라왔다..결국 npm 모듈을 찾아보았더니 해당 sync-promise라는 동기화 모듈이 존재했다.(흠.. 빨리 찾을껄 1시간 반을 날려먹었다..) 여튼 아래 링크에 쓰는 방법이 잘 나와 있으니 참고하길 바랍니다. https://www.npmjs.com/package/sync-promise 2017. 11. 21.
node opencv에서 toBuffer 함수가 먹히지 않을때 opencv의 이미지 매트릭스 객체에서 픽셀의 값을 뽑아낼때 쓰이는 함수가 toBuffer 함수이다.그런데 해당 함수를 쓸 경우 오류가 나서 그 원인을 찾아보았다.해답은 아래의 링크에서 찾았다. https://github.com/peterbraden/node-opencv/issues/483 visual studio의 버전이 2015라면 vc14 버전인 opencv를 깔아야 해당함수가 동작한다는 것이다. (사용하기 꽤 까다롭다..)여튼 해당 opencv 버전으로 교체해주고 다시 opencv 모듈을 지웠다 깐후에 실행해보니 함수가 잘 동작하는 것을 볼 수 있었다. 2017. 11. 9.
node-opencv를 깔기위해 필요한 과정들 최근 node.js에서 제공하는 opencv 모듈을 사용할 일이 생겼다.그래서 설치를 진행했는데, 계속해서 오류가 발생했다...구글링하여 원인을 열심히 찾아봤지만, 해결책은 나오지 않았다. 최종적으로 개발자에게 질문하였고, 개발자가 오류가 난 부분의 코드수정하여 업데이트 해줌으로 문제를 핵결할 수 있었다.(참고로 나는 윈도우 환경이었고, 문제가 발생한 곳은 c언어 파일이었다.)결론적으로 4일동안 헤멨다. 역시 만든사람한테 물어보는게 빠르다 ㅋ.. 오류는 해결되었다고 치고 기본적으로 node-opencv를 설치하는 순서에 대해 말해보려 한다.기본적으로 깃헙에 그 스텝을 잘 기술해 놓았다. 아래가 설치 스텝이다. 1. Download and install OpenCV (Be sure to use a 2.4 .. 2017. 11. 8.
p5.js에서 node.js와 이미지 픽셀 데이터를 받아서 이미지를 화면에 뿌려줄때 주의할 점 요즘에 p5.js에서 node.js와 이미지 데이터 통신을 실험하고 있다.먼저 p5.js 에서 post 통신으로 이미지 데이터를 주면 node.js에서 이미지데이터 필터링 작업을 한다음 다시 넘겨주는 식이다.그리고 p5.js에선 받아온 데이터를 화면에 뿌려주게 된다. 위의 작업을 위해서 p5.js의 setup 함수 안에서 ajax를 함수를 써보았고 잘 동작하는 것을 보았다.하지만 setup 함수 자체가 p5.js 만을 위해 만들어진 터라 데이터를 받은 후에 이전의 p5.js 함수와 제대로 연계가 안된다는 점을 발견하였다. 콕 찝어서 말하면 p5.js 안의 loadPixels, updatePixels 함수였는데,먼저 loadPixels 함수를 써서 p5.js로 이미지 픽셀 데이터를 보내고, 통신 이후에 받.. 2017. 11. 3.
문자열을 숫자 배열로 쉽게 바꾸기 가끔 ajax 통신을 하면 데이터 양이 너무 커서 스트링으로 변환해서 보낼때가 있다.서버에서는 받아온 데이터를 다시 배열로 바꾸어줘야 하는데 그때 주로 사용하는 함수가 split()이다. 하지만 split으로 했을시 패턴에 맞게 잘라진 값들이 숫자가 아닌 문자열로 들어가게된다.원래부터 문자열 배열이었으면 문제 없지만 숫자가 문자열로 들어가면 골치가 아프다.이때 split 함수뒤에 .map(Number)만 써주면 자동으로 문자가 숫자로 바뀌어 배열로 들어가게 된다. 자세한 설명은 아래의 링크를 참조하면 된다. https://stackoverflow.com/questions/15677869/how-to-convert-a-string-of-numbers-to-an-array-of-numbers 2017. 11. 2.
p5.js에서 복수개의 canvas함수를 그리는 법 최근 p5.js를 공부하면서 복수개의 캔버스를 그리는 법에 대해 생각해 보았다.처음에는 쉬울거라 생각했는데, 그 방법이 잘 안 나왔고,찾았어도 복잡한 경우가 많았다. 결국 이틀만에 해결방법을 찾았다.다행이도 p5.js는 이러한 상황에 대처할 수 있는 함수를 제공해주고 있었다.바로 그 함수는 createGraphics() 이다. 해당함수에 대한 자세한 설명은 아래의 링크에 나와있다. https://p5js.org/reference/#/p5/createGraphics 그리고 마지막에 image() 함수를 빼먹지 말아야 한다.솔직히 이 함수를 왜 쓰는지 모르겠지만 없애니 렌더링이 되지 않았다. 2017. 10. 24.
jquery에서 each 함수의 break문 흔히 jquery를 쓰다보면 each 함수를 많이 쓰는데,본 함수에서 break문을 써도 함수를 빠져나오지 못하는것을 볼 수 있다.결론적으로 해당함수는 break가 아닌 return false를 써 주어야 한다. 자세한 설명은 아래의 링크를 참조하면 된다. http://dhplanner.blogspot.kr/2009/06/jquery-each-%EB%A9%94%EC%86%8C%EB%93%9C-%EC%82%AC%EC%9A%A9%EC%8B%9C-break-continue-%EC%82%AC%EC%9A%A9.html 2017. 10. 19.
p5.js에서의 push, pop 함수 p5.js를 보면 push, pop 함수가 있다.본 함수들은 canvas의 context.save, context.restore의 기능을 따온건데,canvas의 translate, rotate의 상태변화를 저장해 주는 역할을 한다.즉, 두 함수 사이에다 translate, rotate 함수를 쓰면,두 함수 밖에 있는 drawing 객체에는 적용되지 않고, 오직 두 함수 사이에 drawing 객체들만 적용되는 것이다. push, pop 함수는 p5.js에서 애니메이션을 구현할때 생각보다 많이 쓰인다.자세한 설명은 아래의 링크를 참고하면 된다. https://www.youtube.com/watch?v=o9sgjuh-CBM 2017. 10. 12.

티스토리툴바