Node.js 圖表處理 (6)

基本介紹

教學目標

透過 plotly.js 套件產生與管理線上圖表,呈現不同類型 App 產品的每天活躍使用者資訊。

使用教學

前置作業

  1. 完成 Node.js 套件安裝與設置。
  2. 完成 plotly 雲端服務帳號註冊。

套件安裝

1
$ npm install plotly

使用教學

輸入正確的使用者帳號和 API 金鑰之後,執行以下程式碼就能產生呈現不同類型 App 產品的每天活躍使用者資訊的私有圖表在 plotly 雲端服務中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var plotly = require('plotly')('user','api key');

var trace1 = {
x: ["2014/12/15", "2014/12/16", "2014/12/17", "2014/12/18", "2014/12/19"],
y: [77890, 88532, 79849, 76526, 81904, 84042],
type: "bar"
};
var trace2 = {
x: ["2014/12/15", "2014/12/16", "2014/12/17", "2014/12/18", "2014/12/19"],
y: [95436, 102374, 94002, 96423, 96724, 98397],
type: "bar"
};
var data = [trace1, trace2];
var graph_options = {filename: "category-app-dau", fileopt: "overwrite", world_readable:false}
plotly.plot(data, graph_options, function (err, msg) {
console.log(msg);
});

此服務的特色在於能夠針對產生的圖表進行完善的管理。

  1. 公開與私有權限分享管理 (Email、Facebook、HTML5、…)
  2. 多元樣式設計和客製化互動介面 (Bar Chart、Bubble Chart、Time Series、…)
  3. 不同程式語言轉換應用 (javascript、R、Python、JSON、…)

相關資源