Coder JS
-
Canvas 차트 그리기 2 - BarCanvas 2021. 10. 1. 19:42
1. html 문서에 Canvas Element 추가. (https://damlady.tistory.com/entry/켄버스-차트-그리기-1-라인-차트 동일) 2. 차트 정보 정의 // 차트 정보 정의. const gridCount = 5; const gridArea = {x:50, y:50, h:250, w:400}; const chartArea = {x:70, y:70, h:230, w:360}; 3. Grid 그리기 (https://damlady.tistory.com/entry/켄버스-차트-그리기-1-라인-차트 동일) 4. 최대값, perPixel 값 구하기 const max = data.reduce((prev,curr) => Math.max(prev,curr)); const perPixel = c..
-
Canvas 차트 그리기 1 - LineCanvas 2021. 10. 1. 19:39
1. html 문서에 Canvas Element 추가. 2. 차트 정보 정의 const gridCount = 5; const gridArea = {x:50, y:50, h:250, w:400}; const chartArea = {x:70, y:70, h:200, w:360}; 3. Grid 그리기 const canvas = document.getElementById('chart'); const ctx = canvas.getContext('2d'); ctx.fillStyle = "#CCC" const gapY = gridArea.h / gridCount; for(let i = 0 ; i Math.max(prev,curr)); const min = data.reduce((prev,curr) => Math.m..
-
javascript 알고리즘 이진 검색 - 자막 검색알고리즘 : Algorithm 2020. 8. 12. 21:44
한 영화 영상과 자막이 있다. 영상은 약 2시간 정도. 자막의 개수는 3000~6000 개 정도이다. 자막의 Data 는 JOSN으로 이뤄 저 있다. [ {"startTime": "2.724", "endTime": "6.069", "text": "이건 제가 어떻게 죽었는지에 대한 이야기입니다.\n"}, {"startTime": "7.862", "endTime": "9.690", "text": "걱정 마세요. 이건 실은 엄청 재미있는 이야기예요.\n" },... ] 영상이 재생 시간에 따라 자막의 text를 출력해보자. 자막 Data 는 시간 순서로 되어 있다. 검색 횟수를 줄이기 위해. 자막 그룹화한다. 나눈 그룹의 첫 번째 녀석만 시간 값을 비교해서 그룹을 찾은 후 찾은 그룹에서 다시 검색을 수행한다...
-
소용돌이알고리즘 : Algorithm 2020. 8. 12. 21:30
문제 출처 : https://www.acmicpc.net/problem/1022 크기가 무한인 정사각형 모눈종이가 있다. 모눈종이의 각 정사각형은 행과 열의 쌍으로 표현할 수 있다. 이 모눈종이 전체를 양의 정수의 소용돌이 모양으로 채울 것이다. 일단 숫자 1을 0행 0열에 쓴다. 그러고 나서 0행 1열에 숫자 2를 쓴다. 거기서부터 소용돌이는 반시계 방향으로 시작된다. 다음 숫자는 다음과 같이 채우면 된다. 위와 같은 이미지처럼 숫자를 채운다고 볼 수 있다. 가로 좌표를 X, 세로 좌표를 Y 라 했을 때 x, y 값이 주어 진다면 해당하는 값이 출력되는 함수를 만들어 보기로 하자! 예를 들어 x=4, y=-2 라고 하면, 값은 55 가 출력되어야 한다. 모눈종이 숫자의 패턴을 알아보자! 사각형 넓이 구..
-
Angular 란 뭘까?Angular 2019. 11. 19. 16:38
앵귤러(Angular) 란? - 참고 : https://angular.kr/ Angular 가이드 Angular 가이드 angular.kr - 컴포넌트 기반 개발(CBD, Component Based Development) 프레임워크 - 템플릿은 뷰(View) - 클래스는 컨트롤러(Controller)와 뷰모델(ViewModel)의 일부를 담당 - 변화 감지(Change detection) 메커니즘 - 데이터 바인딩(Data binding)을 통해 템플릿과 컴포넌트 클래스를 긴밀히 연결하고 동기화를 유지 - 데이타 흐름과 컴포넌트 관계 도식
-
FlashDevlop 와 ScaleformActionscript 3.0/tip 2012. 11. 24. 17:36
flash 도 사용하고 flashdevlop 도 사용하고 거기다 컴파일을 sclaeform 으로 해야 하는 워크 프레임..... flashdevlop F5 누름 바로 sclaeform 으로 컴파일 시키는 방법.!!!! Tool -> ProgrameSetting -> FlashViewer External Plyer Path ==> 프로그램 폴더 \Autodesk\Scaleform\GFx SDK 4.1\Bin\x64\Msvc10\GFxPlayer\GFxPlayer_D3D11_Release_Static.exe 이케 지정 후. 툴바 부분에 releas-> Debug 로 번경. 그후 F5 누름... END---
-
[AIR] 로컬 IP 주소Actionscript 3.0/source 2012. 6. 20. 15:25
엄청 간단하다.. 엄청..... 아래 코드 그대로 복사해서 쓰는 .. 끝~~~~import flash.net.InterfaceAddress;import flash.net.NetworkInterface;var netInterfaces:Vector. = NetworkInfo.networkInfo.findInterfaces();var addresses:Vector. = netInterfaces[0].addresses;var ipAddress = addresses[0].address;trace (ipAddress )