Javascriptライブラリを正しくインストール/アクセスするには

私はPHPページを含む基本的なWebサイトで作業しています。私はcpanelで私のウェブサイトをホストしています。このJavascriptライブラリ（here）を私のプロジェクトに組み込みたいと思います。私はプロジェクトをダウンロードし、ソースファイルの内容をプロジェクトにコピーし、サンプルコード（here）をテストしましたが、私のページには何も表示されません。プロジェクトをインポート/実装するのが簡単か、いくつかのステップがありますか？ありがとう！Javascriptライブラリを正しくインストール/アクセスするには

ウェブ開発に関する私の知識が他の分野にはほとんどないので、私が何らかの用語を誤ってお詫びします。ありがとう！

編集：私はjqueryを使用していません/インストールされていません。これを追加する必要がありますか？以下

コード：

<div class="jumbotron"> 
    <h1> Test</h1> 

    <canvas id="myChart" width="400" height="400"></canvas> 
    <script type="text/javascript" src="assets/js/chart.js" charset="utf-8"> 
    var ctx = document.getElementById("myChart"); 
    var myChart = new Chart(ctx, { 
     type: 'bar', 
     data: { 
      labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], 
      datasets: [{ 
       label: '# of Votes', 
       data: [12, 19, 3, 5, 2, 3], 
       backgroundColor: [ 
        'rgba(255, 99, 132, 0.2)', 
        'rgba(54, 162, 235, 0.2)', 
        'rgba(255, 206, 86, 0.2)', 
        'rgba(75, 192, 192, 0.2)', 
        'rgba(153, 102, 255, 0.2)', 
        'rgba(255, 159, 64, 0.2)' 
       ], 
       borderColor: [ 
        'rgba(255,99,132,1)', 
        'rgba(54, 162, 235, 1)', 
        'rgba(255, 206, 86, 1)', 
        'rgba(75, 192, 192, 1)', 
        'rgba(153, 102, 255, 1)', 
        'rgba(255, 159, 64, 1)' 
       ], 
       borderWidth: 1 
      }] 
     }, 
     options: { 
      scales: { 
       yAxes: [{ 
        ticks: { 
         beginAtZero:true 
        } 
       }] 
      } 
     } 
    }); 
    </script> 


</div>

出典

2016-08-13 Josh D.

あなたはChart.jsを使用するjQueryのを必要としません。ただし、時間軸を使用する場合は、Moment.jsが必要です。グラフを表示するコードを投稿できますか？ – rockerest

私はDivを含むコードのスニペットを投稿しました。私は、チャートを内部に入れたいと思っていました。役に立つかどうか教えてください、ありがとう！ –

-2

それは私のために働いていたので、あなたはこれをチェックアウトすることができます。スクリプトタグにソース属性を含めたため、表示が表示されませんでした。私が知っているのは、特定のドキュメントで作業しているときにスクリプトタグを持っていて、スクリプトタグの間にコードを入れることを決めた場合、コードが別のファイルにない限りsrcタグは含めません。

<head> 
<script type="text/javascript" src="assets/js/chart.js"></script> 
</head> 
<div class="jumbotron"> 
<h1> Test</h1> 

<canvas id="myChart" width="400" height="400"></canvas> 
<script type="text/javascript"> 
var ctx = document.getElementById("myChart").getContext("2d"); 
var myChart = new Chart(ctx, { 
    type: 'bar', 
    data: { 
     labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], 
     datasets: [{ 
      label: '# of Votes', 
      data: [12, 19, 3, 5, 2, 3], 
      backgroundColor: [ 
       'rgba(255, 99, 132, 0.2)', 
       'rgba(54, 162, 235, 0.2)', 
       'rgba(255, 206, 86, 0.2)', 
       'rgba(75, 192, 192, 0.2)', 
       'rgba(153, 102, 255, 0.2)', 
       'rgba(255, 159, 64, 0.2)' 
      ], 
      borderColor: [ 
       'rgba(255,99,132,1)', 
       'rgba(54, 162, 235, 1)', 
       'rgba(255, 206, 86, 1)', 
       'rgba(75, 192, 192, 1)', 
       'rgba(153, 102, 255, 1)', 
       'rgba(255, 159, 64, 1)' 
      ], 
      borderWidth: 1 
     }] 
    }, 
    options: { 
     scales: { 
      yAxes: [{ 
       ticks: { 
        beginAtZero:true 
       } 
      }] 
     } 
    } 
}); 
</script>

出典

2016-08-13 19:52:05 SBA

私はjQueryをインストールしていません（少なくとも私の知識はありませんか？）。私はそれなしで回避することができますか、それとも私はそれを必要としますか？ありがとう！ –

@Josh D.これらのライブラリのいくつかがそれに依存しているので、インストールしておくべきだと思います。実際にチャートを表示するスクリプトの前に依存関係を最初にロードする – SBA

この回答は間違っています。 Chart.jsはjQueryを必要とせず、OPのjQueryを含めることを推奨します。必要であれば調べることなく、jQueryは無駄に費やされません。 – rockerest

Javascriptライブラリを正しくインストール/アクセスするには

答えて

関連する問題