본문 바로가기
728x90
반응형

JavaScript119

[JavaScript] chart.js 사용 중 그래프 사이즈 및 크기 조정하는 방법 !! [JavaScript] chart.js 사용 중 그래프 사이즈 및 크기 조정하는 방법 !! canvas 에 원하는 width 값과 height 값을 주고 차트 옵션에 responsive: false 를 추가해 주시면 끝 ! ​ 2024. 2. 19.
[JavaScript] 자바스크립트로 실시간으로 그리는 그래프 만드는 방법 !! (chart.js 사용) [JavaScript] 자바스크립트로 실시간으로 그리는 그래프 만드는 방법 !! (chart.js 사용) 안녕하세요. chart.js 의 차트를 활용하여 실시간으로 그래프가 움직여지게 만들어 보았습니다. 공식사이트를 아래 링크 참조 :) 결과 chart.js 공식사이트 https://www.chartjs.org/ Chart.js Simple yet flexible JavaScript charting library for the modern web www.chartjs.org 2024. 2. 18.
[JavaScript] 자바스크립트 특정 문자를 찾아 지우는 방법 !! (원하는 범위에서 문자 지우기) [JavaScript] 자바스크립트 특정 문자를 찾아 지우는 방법 !! (원하는 범위에서 문자 지우기) JavaScript에서 문자열 내의 특정 문자('_'와 같은)를 찾아 그 문자와 그 뒤의 모든 문자를 제거하려면 String.indexOf() 메서드를 사용하여 해당 문자의 위치를 찾은 다음, String.substring() 메서드를 사용하여 해당 위치까지의 문자열을 추출할 수 있습니다. 만약 해당 문자가 문자열에 없는 경우 원래 문자열을 그대로 반환합니다. 예제코드 function removeAfterUnderscore(str) { const index = str.indexOf('_'); if (index !== -1) { // '_'가 문자열에 있는 경우 return str.substring(0,.. 2024. 2. 17.
[JavaScript] 자바스크립트 특정 범위의 랜덤 정수 생성하는 방법 !! (원하는 범위 숫자 랜덤하게) [JavaScript] 자바스크립트 특정 범위의 랜덤 정수 생성하는 방법 !! (원하는 범위 숫자 랜덤하게) 특정 범위의 랜덤 정수 생성하기 (최소값)과 (최대값)을 포함하는 범위에서 랜덤 정수를 생성하려면 다음 공식을 사용할 수 있습니다: Math.floor(Math.random() * (최대값 - 최소값 + 1)) + 최소값; 예제) 1에서 10 사이의 랜덤 정수 생성 const min = 1; const max = 10; const randomInt = Math.floor(Math.random() * (max - min + 1)) + min; console.log(randomInt); 2024. 2. 16.
[JavaScript] 자바스크립트로 sessionStorage 데이터 저장 및 사용, 삭제 하는 방법 !! [JavaScript] 자바스크립트로 sessionStorage 데이터 저장 및 사용, 삭제 하는 방법 !! sessionStorage는 현재 브라우저 탭이나 창이 닫힐 때까지 데이터가 유지되는 저장소입니다 ! 세션스토리지 사용 예시 // 데이터 저장하기 ('sessionKey'라는 키에 'sessionValue'라는 값을 저장합니다.) sessionStorage.setItem('sessionKey', 'sessionValue'); // 데이터 사용하기 ('sessionKey'라는 키로 저장된 값을 불러옵니다.) var sessionValue = sessionStorage.getItem('sessionKey'); console.log(sessionValue); // 'sessionValue' 출력 // .. 2024. 1. 27.
[JavaScript] 자바스크립트를 활용하여 localStorage 에 데이터 넣고 지우는 방법 !! [JavaScript] 자바스크립트를 활용하여 localStorage 에 데이터 넣고 지우는 방법 !! 브라우저에서 localStorage는 웹 브라우저를 닫아도 데이터가 유지되는 저장소입니다 ! 상황에 따라 데이터를 저장하고 가져와서 잘 활용하면 리소스를 많이 아낄 수 있습니다 :) 아래는 사용 예시 입니다 !! localstorage에 데이터 저장하기 // 'myKey'라는 키에 'myValue'라는 값을 저장합니다. localStorage.setItem('myKey', 'myValue'); localstorage에 데이터 가져오기 // 'myKey'라는 키로 저장된 값을 불러옵니다. var value = localStorage.getItem('myKey'); console.log(value); //.. 2024. 1. 22.
[JavaScript] 자바스크립트를 활용하여 html을 pdf로 다운 받는 방법 !! [JavaScript] 자바스크립트를 활용하여 html을 pdf로 다운 받는 방법 !! HTML 페이지를 PDF로 변환하기 위해 JavaScript에서는 일반적으로 jsPDF 라이브러리와 함께 html2canvas 라이브러리를 사용합니다. 이 두 라이브러리를 활용하면 웹 페이지의 특정 부분이나 전체를 캡처하여 PDF 문서로 만들 수 있습니다 !! 아래는 HTML 페이지의 내용을 PDF로 변환하는 JavaScript 코드 예시입니다 :) 예제코드 User ID: User Name: PDF로 다운로드 2024. 1. 11.
[JavaScript] 자바스크립트로 wav 파일 실행하는 방법 !! [JavaScript] 자바스크립트로 wav 파일 실행하는 방법 !! (audio 태그) javascript 를 활용하여 wav파일 실행하는 방법 입니다 ! 예제코드 Your browser does not support the audio element. Play Audio Pause Audio 2024. 1. 4.
[JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 5 !! (게임오버 사진추가 기능) [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 5 !! (게임오버 사진추가 기능) 안녕하세요 미사일 피하기 게임 5탄입니다. 이번에는 게임오버화면을 이미지 파일로 추가하는 기능을 넣어봤습니다 ㅎ 아래 변경 사항이고, 예제코드 바로 사용하시면 됩니다 :) 예제코드 재시작 쉬움 보통 어려움 재시작 쉬움 보통 어려움 이전글 2023.12.27 - [Coding/JavaScript] - [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 4 !! (배경화면 추가 및 게임오버 화면 추가) 2023.12.16 - [Coding/JavaScript] - [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 3 !! (내 비행기 케릭터 추가하기) 2023... 2023. 12. 31.
728x90
반응형