본문 바로가기
728x90
반응형

html143

[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] 자바스크립트로 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.
[Html & CSS] 백그라운드(background-color) 투명하게 만드는 방법 !! [Html & CSS] 백그라운드(background-color) 투명하게 만드는 방법 !! 아래와 같이 주시면 백그라운드가 투명하게 됩니다 :) background-color:transparent; 2024. 1. 2.
[JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 5 !! (게임오버 사진추가 기능) [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 5 !! (게임오버 사진추가 기능) 안녕하세요 미사일 피하기 게임 5탄입니다. 이번에는 게임오버화면을 이미지 파일로 추가하는 기능을 넣어봤습니다 ㅎ 아래 변경 사항이고, 예제코드 바로 사용하시면 됩니다 :) 예제코드 재시작 쉬움 보통 어려움 재시작 쉬움 보통 어려움 이전글 2023.12.27 - [Coding/JavaScript] - [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 4 !! (배경화면 추가 및 게임오버 화면 추가) 2023.12.16 - [Coding/JavaScript] - [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 3 !! (내 비행기 케릭터 추가하기) 2023... 2023. 12. 31.
[JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 4 !! (배경화면 추가 및 게임오버 화면 추가) [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 4 !! (배경화면 추가 및 게임오버 화면 추가) 안녕하세요 미사일 피하기 게임 4탄입니다. 이번에는 배경 사진을 넣는 것과 게임오버화면 추가하였습니다. ㅎ 아래 변경 사항이고, 예제코드 바로 사용하시면 됩니다 :) 예제코드 재시작 쉬움 보통 어려움 재시작 쉬움 보통 어려움 이전글 2023.12.16 - [Coding/JavaScript] - [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 3 !! (내 비행기 케릭터 추가하기) 2023.12.12 - [Coding/JavaScript] - [JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 2 !! (재시작 버튼 및 난이도 조절) 2023... 2023. 12. 27.
728x90
반응형