{{name}}<\/div>\n \n \n \n \n \n \n \n<\/body>\n<\/html><\/pre>

\n<\/p>さあ、いくつかのチャートを描きましょう。まず、index.htmlにAjax APIを含めます。

\n\n次に、以下に示すように、index.htmlのdivを変更します。 <\/strong>\n<\/p>\n

controllers.jsに視覚化APIとLineChartパッケージをロードします。 <\/p>\n

{{name}}<\/div><\/pre>\n
パッケージをロードした後、角度アプリケーションを初期化する必要があります。 <\/p>\n
'use strict';\n\n\/* Controllers *\/\n\nangular.module('myApp.controllers', []).\n  controller('MyCtrl1', ['$scope',\n    function($scope) {\n      $scope.name = 'Jay';\n    }\n  ])\n  .controller('MyCtrl2', [\n    function() {\n\n    }\n  ]);<\/pre>\n
Angular.Bootstrapは、手動(dòng)で開始する角度アプリケーションのグローバルAPIです。 Googleチャート作成コードをコントローラー関數(shù)にコピーして貼り付けるだけで、これが最終結(jié)果です。\n<\/p>\n
node scripts\/web-server.js<\/pre>index.htmlを編集し、コードを?qū)g行する前にhtmlタグからng-app = \"myApp\"を削除します。 NG-APPは、アプリケーションブート要素を使用します。ただし、コントローラーコードで既にこれを?qū)g行しているため（次のコード行を使用して）、HTMLから削除できます。 
\n<\/p>\n
<\/pre>ノードサーバーを再起動(dòng)し、http：\/\/ localhost：8000\/app\/index.htmlにアクセスします。仮想データに基づいて行チャートが表示されます。 
\n<\/p>
<\/div><\/pre>結(jié)論
<\/p>このチュートリアルのこの部分では、角度コントローラーに焦點(diǎn)を當(dāng)てています。次の記事では、ディレクティブの使用と$ Scopeの使用に焦點(diǎn)を當(dāng)てます。同時(shí)に、この記事のすべてのコードはGitHubで見つけることができます。 
\nGoogle Charts APIとAngularJS <\/p>
を使用して視覚的アプリケーションを作成するための <\/strong>FAQ（FAQ）\n<\/p> Googleチャートの外観をカスタマイズする方法は？ 
\n<\/h3>Google Charts APIには、チャートの外観を変更できる幅広いカスタマイズオプションが提供されます。色、フォント、グリッドラインなどを変更できます。チャートをカスタマイズするには、Chart Draw（）メソッドのオプションオブジェクトを変更する必要があります。たとえば、チャートのタイトルを変更するには、次のコードを使用できます。\n
\n<\/p>オプションオブジェクトには、チャートを広範(fàn)囲にカスタマイズできる多くのプロパティが含まれていることを忘れないでください。 
\n\n
<\/div><\/pre>\n
 Googleチャートにインタラクティブ性を追加するにはどうすればよいですか？ <\/p>\n
Google Charts APIは、チャートにインタラクティブ性を追加する複數(shù)の方法を提供します。最も一般的な方法の1つは、「選択」イベントを使用することです。これは、ユーザーがチャート上のアイテムを選択したときにトリガーされます。イベントリスナーを「選択」イベントに耳を傾け、トリガーされたときにアクションを?qū)g行するチャートに追加できます。例は次のとおりです。<\/h3>\n
\nこの例では、ユーザーがチャート上のアイテムを選択すると、選択したアイテム値を表示するアラートボックスが表示されます。 <\/p>\n
cd angular-seed\nnode scripts\/web-server.js<\/pre> angularjsを使用してGoogleチャートを使用するにはどうすればよいですか？ 
\n<\/p> AngularJを使用してGoogleチャートを使用するには、Angular-Google-Chartsパッケージを使用できます。このパッケージは、GoogleチャートをAngularJSアプリケーションに簡(jiǎn)単に統(tǒng)合できるようにするAngularJSディレクティブのセットを提供します。パッケージをインストールするには、次のコマンドを使用できます。\n
\n<\/h3>パッケージをインストールした後、パッケージが提供する手順を使用して、チャートを作成およびカスタマイズできます。 
\n<\/p> Googleチャートで複數(shù)のデータテーブルを接続するにはどうすればよいですか？ 
HTTP Server running at http:\/\/localhost:8000\/<\/code><\/pre>\n
 Google.visualization.data.join（）メソッドを使用して、Googleチャートで複數(shù)のデータテーブルを接続できます。このメソッドは、3つのデータテーブルをパラメーターとして使用します。最初のデータテーブル、2番目のデータテーブル、および各データテーブルのキー列です。このメソッドは、キー列の値が一致する2つのDatatablesに行を含む新しいデータテーブルを返します。例は次のとおりです。<\/p>\n
\nこの例では、datatable1とdatatable2は、各データテーブルの最初の列に接続されています。 <\/h3>\n
 Googleチャートを使用してどのような種類のチャートを作成できますか？ <\/p>\n
\n\n\n  \n