-
[jQuery] jQuery.extend() 함수 사용법, 예제 (객체 합치기)
jQuery.extend() 함수는 객체를 확장하거나 병합하는 데 사용됩니다. 하나 이상의 객체를 결합하여 새로운 객체를 생성하거나 기존 객체를 수정할 수 있습니다. 주로 설정 옵션을 병합하거나 두 개의 객체를 합칠 때 유용합니다. 사용법 jQuery.extend(target, object1, object2, object3, ...); target: 목표 객체로, 이 객체는 다른 객체의 속성을 포함하고 확장할 대상입니다. object1, object2, object3, ...: 확장할 객체들을 지정합니다. 이러한 객체들의 속성은 목표 객체에 추가됩니다. 소스코드 및 설명 1. 기본 객체 병합 (첫번째 예제) -jQuery.extend()를 사용하여 obj1에 obj2를 병합하고, 두 객체의 속성을 병합합..
개발이야기/jQuery
2023. 11. 3.
-
[자바스크립트] Google Charts(구글 차트) 사용법, 예제, 차트 그리기
아래 소스코드는 Google Charts를 사용하여 여러 가지 차트를 그려 보았습니다. 소스코드 -drawCharts 함수: Google Charts 라이브러리가 로드된 후 호출되며, 각각의 차트를 그리는 역할을 합니다. 함수 내에서 다양한 차트 데이터와 옵션을 설정하고 해당 차트를 그립니다. -차트 1~7번: 각각의 차트에 대한 데이터와 옵션을 설정하고, 그리기 위한 요소를 생성합니다. 차트 유형은 세로 막대그래프, 파이 차트, 라인 차트, 가로 막대그래프, 영역 차트, 스택 된 세로 막대그래프, 산점도 그래프입니다. -페이지 레이아웃: 각각의 차트를 그릴 요소를 페이지에 추가합니다. 각 요소에는 고유한 ID가 할당되며, CSS를 사용하여 이러한 요소를 페이지에 나란히 나타냅니다.
개발이야기/자바스크립트
2023. 10. 31.
-
[자바스크립트] C3.js chart 사용법, 예제, 차트 그리기 (막대, 선, 원, 도넛, 파이 그래프)
아래 소스코드는 C3.js 라이브러리를 사용해서 차트를 그려 보았습니다. C3.js 차트는 직관적인 API를 통해 쉽게 사용 가능하며, 다양한 차트 유형을 제공하고 오픈 소스로 무료로 사용할 수 있습니다. C3.js를 사용하기 위해서는 세 개의 CDN 링크를 HTML 페이지에 추가해야 합니다. C3.js 라이브러리, C3.js 스타일시트, 마지막으로 C3.js를 사용하려면 D3.js도 함께 로드해야 합니다. 예제 차트 막대 그래프 선 그래프 원 그래프 영역 그래프 가로 막대 그래프 산포 그래프 도넛 그래프 누적 막대 그래프 스텝 차트 분산 스플라인 그래프 파이 차트 C3 차트는 스크립트에서 각 차트에 대한 데이터 정의와 차트 생성을 수행하고 있습니다. 1. 데이터 설정 -barChartData, line..
개발이야기/자바스크립트
2023. 10. 27.
💲 추천 글