使用 Google 圖表
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
Google 圖表可讓您以視覺化方式呈現網站上的資料。從簡單的折線圖到複雜的階層式樹狀圖,圖表庫都提供了大量可用的圖表類型,
使用 Google 圖表的最常見方法就是使用嵌入網頁中的簡易 JavaScript。您載入某些 Google 圖表資料庫、列出要繪製圖表的資料、選取自訂圖表的選項,最後使用您選擇的 id 來建立圖表物件。
然後,在網頁上使用該 id 建立 <div> 以顯示 Google 圖表。
這就是您需要開始使用的步驟。
圖表是以 JavaScript 類別的形式呈現,而 Google 圖表則提供多種圖表類型供您使用。預設外觀通常是您所需要的,您也可以隨時自訂圖表,以符合網站的外觀和風格。圖表具備高度互動性及公開呈現事件,您可以用來連結各種資訊主頁或其他與網頁整合的體驗。圖表採用 HTML5/SVG 技術來呈現,提供跨瀏覽器相容性 (包括舊版 IE 版本的 VML),以及 iPhone、iPad 和 Android 的跨平台可攜性。使用者永遠都無需使用外掛程式或任何軟體。如果他們擁有網路瀏覽器,就可以查看您的圖表。
所有圖表類型都會使用 DataTable 類別填入資料,方便您在實驗時輕鬆切換圖表類型,找出理想的外觀。DataTable 提供排序、修改及篩選資料的方法,並可直接從您的網頁、資料庫或任何支援圖表工具資料來源通訊協定的資料供應商填入。(該通訊協定包含類似 SQL 的查詢語言,且是由 Google 試算表、Google Fusion Tables 和 SalesForce 等第三方資料供應商所實作。
您甚至可以在自己的網站上實作通訊協定,並成為其他服務的資料供應商。)
準備好建立第一個圖表了嗎?請參閱快速入門導覽課程。
我們的工具會持續更新,以更滿足您的需求;我們會參考您的意見回饋,決定要優先提供哪些功能。歡迎加入我們的討論群組。
除非另有註明,否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權,程式碼範例則為阿帕契 2.0 授權。詳情請參閱《Google Developers 網站政策》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間:2024-07-10 (世界標準時間)。
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"缺少我需要的資訊"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"過於複雜/步驟過多"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"過時"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"翻譯問題"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"示例/程式碼問題"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"其他"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"容易理解"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"確實解決了我的問題"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"其他"
}]
{"lastModified": "\u4e0a\u6b21\u66f4\u65b0\u6642\u9593\uff1a2024-07-10 (\u4e16\u754c\u6a19\u6e96\u6642\u9593)\u3002"}
[[["容易理解","easyToUnderstand","thumb-up"],["確實解決了我的問題","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少我需要的資訊","missingTheInformationINeed","thumb-down"],["過於複雜/步驟過多","tooComplicatedTooManySteps","thumb-down"],["過時","outOfDate","thumb-down"],["翻譯問題","translationIssue","thumb-down"],["示例/程式碼問題","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新時間:2024-07-10 (世界標準時間)。"]]