개요

Noodl에서 외부 라이브러리를 읽고 사용해 보았습니다.
이번에는 Chart.js를 읽고 그래프를 표시했습니다.
그 비망록입니다.

이 메커니즘을 사용하여 Chart.js의 구성 요소를 만들려고했습니다.
htps : // 기주 b. 코 m / k 마에 푸 / 오 dl 코 m 포넨 t 아 m 비엔 t

사용할 노드

JS 라이브러리를 읽고 HTML 요소를 조작하는 흐름은 다음과 같습니다.


사용하고 있는 노드는 다음의 3 종류입니다.

(1)script downloader
JS 라이브러리를 읽는 노드
(2) javascript
JS를 기술하는 노드
(3) HTML contents
HTML을 기술하는 노드

각 노드 설정

(1)script downloader
"프로퍼티 Script 0"에 라이브러리를 로드할 경로를 설정합니다.


(2) javascript
　　


Javascript의 기술 예는 다음과 같습니다.
inputs에 다음의 3개를 추가합니다.

define({
    inputs: {
        isAddedToDOM : "boolean",
        domElement : "domelement",
        scriptsLoaded: "boolean"
    },

run에서 HTML 요소와 로드된 라이브러리의 인스턴스를 생성합니다.

run: function(inputs, outputs, changedInputs) {
        var ctx = document.getElementById('myChart');
        var myChart = new Chart(ctx, {

(3) HTML contents
HTML 속성을 편집하여 HTML을 작성합니다.

예

Chart.js를 읽어 그래프 표시해 보았습니다.

끝에

자세한 내용은 Noodl의 문서 및 샘플 프로젝트 Google Map 샘플을 참조하십시오.