구차니의 잡동사니 모음

명확한 원인과 해결방법은 아직 못 찾음

mac과 centos에서 node.js를 통해 mysql 접속시 장시간 지난후

이런 에러가 발생을 하는데 mysql 쪽 세션 timeout 이 원인으로 추정됨

[링크 : https://stackoverflow.com/.../node-js-mysql-protocol-enqueue-after-fatal-error]

[링크 : https://stackoverflow.com/...mac-and-have-an-error-occurred-when-deploying-on-centos]

+

일정 주기로 쓸모없는 쿼리문 보내도록 해주는 미봉책

[링크 : http://nashorn.tistory.com/entry/Nodejs-서버-운영시-발생하는-오류-대응]

jquery를 이용한 애니메이션 설정

[링크 : https://www.w3schools.com/jquery/jquery_animate.asp]

마우스 오버시 줌 애니메이션(트랜지션 시간 설정)

[링크 : https://www.w3schools.com/howto/howto_css_zoom_hover.asp]

jquery로 css를 변경하는 방법

[링크 : https://www.w3schools.com/jquery/jquery_css.asp]

[링크 : https://www.tutorialspoint.com/How-to-change-the-background-image-using-jQuery]

+

2018.10.11

[링크 : https://stackoverflow.com/questions/554273/changing-the-image-source-using-jquery]

직접 그리는 법을 찾아 보려고 하니

drilldown이라는 키워드가 보인다. 머하는 녀석인진 아직 파악 못함

[링크 : https://pshivale.github.io/psd3/]

[링크 : https://github.com/pshivale/psd3/blob/gh-pages/psd3.js]

drilldown

[링크 : https://stackoverflow.com/questions/23153403/drilldown-multiple-levels-highchart]

[링크 : http://bl.ocks.org/alessioalex/6448911]

잘 안되네... (예제만은 잘됨.. 내꺼에는 안됨.. ㅠㅠ)

일단 핵심은 :before라는 슈도 태그 인듯..

(근데 난 d3로 svg 그리는데 zindex랑 꼬여서 영 안됨..)

[링크 : https://www.sitepoint.com/css3-transform-background-image/]

[링크 : https://stackoverflow.com/questions/24842026/rotate-background-image-of-div-90-degrees-using-jquery]

/static 아래에서는 /public으로 연결해서 자유롭게 파일을 직접 액세스 하도록 해주는 기능

[링크 : http://expressjs.com/en/starter/static-files.html]

[링크 : http://expressjs.com/ko/starter/static-files.html]

[링크 : http://infodbbase.tistory.com/40]

[링크 : https://opentutorials.org/course/2136/11857]

화면상에 보이는 실제 크기

document.getElementById('video-canvas').scrollWidth

document.getElementById('video-canvas').scrollHeight

캔버스 자체의 실제 크기

document.getElementById('video-canvas').width

document.getElementById('video-canvas').height

jsmpeg을 통해서 동영상을 틀어 주면 동영상의 실제 크기는 width, height로 나오고

scrollWidth, scrollHeight는 canvas 태그에 의해서 설정된 width, height 값이 나오게 된다.

+

jquery에서 셀렉터로 하면 width를 못 받아온다. 왜그럴까..

canvas를 이용해서 waveform을 그려주는 녀석인.. 듯?

아무튼 파형 확대/축소도 가능하고

이퀄라이저도 포함되는 녀석이라 한번 써볼만 할 듯

[링크 : https://wavesurfer-js.org]

본목적(?)은 canvas로 그려진 jsmpeg을 캡쳐 하는건데

canvas 가 2d 컨텍스트라면 아래의 toDataURL()을 통해서 간단하게

image/png MIME 타입으로 받을수 있다.

[링크 : https://weworkweplay.com/play/saving-html5-canvas-as-image/]

다만 기본 값이 GL 가속이라 disableGL을 true로 해주면 canvas가 2d로 설정되기에 캡쳐가 가능한데

문제는.. gl이나 gl-experiment로 설정해도 못받아 오는건 매한가지란거...

[링크 : https://github.com/phoboslab/jsmpeg]