重要事項:Google 圖表工具的「圖片圖表」部分已自 2012 年 4 月 20 日起正式淘汰。但請放心,該功能將根據淘汰政策持續運作。
總覽
使用 Google Charts API 顯示為圖片的折線圖。
範例
<html> <head> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> google.charts.load("current", {packages:["imagelinechart"]}); google.charts.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Year', 'Sales', 'Expenses'], ['2004', 1000, 400], ['2005', 1170, 460], ['2006', 660, 1120], ['2007', 1030, 540] ]); var chart = new google.visualization.ImageLineChart(document.getElementById('chart_div')); chart.draw(data, {width: 400, height: 240, min: 0}); } </script> </head> <body> <div id="chart_div" style="width: 400px; height: 240px;"></div> </body> </html>
載入中
google.charts.load
套件名稱為 "imagelinechart"
。
google.charts.load('current', {packages: ['imagelinechart']});
視覺呈現的類別名稱為 google.visualization.ImageLineChart
。
var visualization = new google.visualization.ImageLineChart(container);
資料格式
第一欄應為字串且包含類別標籤,可追蹤的欄數量不限,所有欄都必須為數字。 每個資料欄會逐行顯示。
設定選項
名稱 | 類型 | 預設 | 說明 |
---|---|---|---|
backgroundColor | 字串 | 「#FFFFFF」(白色) | 圖表 API 顏色格式的圖表背景顏色。 |
顏色 | 陣列<字串> | 自動 | 藉此為各個資料序列指定特定顏色。您可以使用圖表 API 顏色格式指定顏色。顏色 i 會用於資料欄 i,如果資料欄超過顏色,則會從頭到頭換行。如果所有系列都接受單一顏色的變化版本,請改用 color 選項。 |
enableEvents | boolean | false | 讓圖表擲回使用者觸發的事件,例如點擊或滑鼠遊標懸停。僅支援特定圖表類型。請參閱下方的「事件」一節。 |
高度 | 號碼 | 容器高度 | 圖表的高度 (以像素為單位)。 |
傳說 | 字串 | 「右」 | 圖例位置和類型。可能是下列其中一個值:
|
max | 號碼 | 自動 | Y 軸中顯示的最大值。 |
分鐘 | 號碼 | 自動 | Y 軸顯示的最低值。 |
showAxisLines | boolean | true | 如果設為 False,系統會移除軸線和標籤。 |
showCategoryLabels | boolean | 與 showAxisLines 相同 | 如果設為 False,系統會移除類別標籤 (X 軸標籤)。 |
showValueLabels | boolean | 與 showAxisLines 相同 | 如果設為 False,系統會移除值的標籤 (Y 軸標籤)。 |
title | 字串 | 無標題 | 顯示在圖表上方的文字。 |
valueLabelsInterval | 號碼 | 自動 | 值軸標籤的顯示間隔。舉例來說,如果 min 為 0,max 為 100,而 valueLabelsInterval 為 20,圖表就會顯示軸標籤如下 (0、20、40、60、80 100)。 |
寬度 | 號碼 | 容器寬度 | 圖表的寬度 (以像素為單位)。 |
方法
方法 | 傳回類型 | 說明 |
---|---|---|
draw(data, options) |
無 | 繪製圖表。 |
事件
您可以註冊聆聽一般圖片圖表網頁中所述的事件。
資料政策
請參閱圖表 API 記錄政策。