Ranaly

Ranaly是一个基于Redis的数�?�统计�?�视化工具。

Ranaly的Node.js客户端库node_ranaly已�?完�?。

特点如下：

1. 使用简�?�，容易维护
2. 基于Redis，性能优异
3. 支�?模�?�级别的�?��?控制
4. 长连接实时数�?�统计
5. 多�?图表�?�以选择，�?�以自定义模�?��?模�?�

快速入门

在项目中使用Ranaly统计数�?��??分简�?�，步骤如下。

1. 安装Node.js和Redis

Ranaly使用Node.js开�?�，所以需�?先安装Node.js。�?�样因为Ranaly的统计数�?�存储于Redis中，所以需�?安装Redis。

2. 安装Ranaly

git clone git://github.com/luin/ranaly.git
cd ranaly
npm install

3. 在已有项目中加入统计代�?

如果你的项目使用Node.js开�?�，�?�以使用Ranaly的node客户端库，安装方法如下：

npm install node_ranaly

如果希望统计项目注册用户的�?�化趋势，�?�以在用户注册�?功�?�加上如下代�?：

var ranaly = require('node_ranaly').createClient();
var rUsers = new ranaly.Amount('Users');
rUsers.incr();

node_ranaly库会将�??为“Users�?的Amount类型的桶的值增1并和当�?时间一起写入到Redis中。

4. 查看统计结果

建立�?置文件，内容如下：

app_name: Demo
users:
  - username: admin
    password: admin123
pages:
  - title: Overview
    widgets:
      - type: amount_line_chart
        bucket: Users

将文件�?存，并进入Ranaly的目录执行：

node ranaly /path/to/config_file

其中/path/to/config_file表示�?置文件路径。此时就�?�以访问 http://127.0.0.1:3000 进入数�?�查看页�?�了，使用admin和admin123登录系统，能看到用户数�?的折线图。

文档

Ranaly由两个部分组�?，分别是客户端库和数�?�展示部分，本页�?�项目是数�?�展示部分。在程�?中通过客户端库在Redis中记录统计数�?�，而本页�?�项目的作用是将这些数�?�以图表的形�?显示出�?�。

1. 客户端库

Node.js：node_ranaly

2. 数�?�类型

为了适应�?�?�场�?�的统计需�?，Ranaly支�?3�?类型的数�?�统计：

(1) Amount

当�?记录�?一个数�?�的在�?用时间的数�?�?�化时就需�?使用Amount类型，如想记录用户数�?的�?�化趋势等。

(2) Realtime

Realtime用�?�记录实时数�?�，如当�?系统内存使用情况等。

(3) DataList

DataList用�?�记录数�?�列表，数�?��?�以是数字�?字符串甚至对象。如新注册的用户头�?地�?�列表�?新注册的用户资料列表等。DataList�?��?留数�?�列表中的�?N�?�数�?�（N的数值�?�以指定）。

3. Ranaly�?置文件

为了能够通过Ranaly�?�将Redis中记录的统计数�?��?�视化，需�?�??供一份�?置文件。�?置文件的格�?为YAML，样例如下：

app_name: 应用�??称
port: Ranaly使用的端�?��?�，默认是3000
redis:
	host: Redis的主机地�?�，默认是127.0.0.1
	port: Redis的端�?��?�，默认是6379
	key_prefix: 存储统计数�?�的键�??�?缀，需�?和客户端库的�?置一样
users:
	- username: 用户�??
	  password: 密�?
	  role: 数字，表示用户的�?��?，默认是0
pages:
	- title: 页�?�的标题
	  widgets:
	  	  - type: widget的类型
	  	    bucket: widget对应的bucket
	  	    title: widget的标题
		    role: 数字，�?�对拥有大于或等于该role的用户�?��?

4. 桶（bucket）

为了区分�?�?�的统计数�?�，需�?为�?类数�?�起个�??字（桶），如统计用户�??称的桶�?�以命�??为“Users�?，统计访问�?的桶�?�以命�??为“Page views�?。�?�?�数�?�类型的桶�?�以�?�??，桶的�??称�?�以包�?�空格。

5. Widget类型

在�?置文件中�?�以看到�?一个项目是由若干个page组�?的，�?个page由若干个widget组�?。widget分为�?�?��?类，�?一�?widget�?�适用于一�?数�?�类型，�?�以从其命�??看出�?�。

(1) amount_line_chart

该类型的widget用�?�显示折线图，�?�支�?Amount。�?个widget除了type�?bucket�?title和role四个�?�数外还支�?其它�?�?�的�?�数。amount_line_chart类型支�?的�?�数如下：

amount_line_chart支�?�?�时显示多个bucket的数�?�，在�?置文件中以数组形�?设置，如：

type: amount_line_chart
bucket: [Users, Page views, Groups]

(2) amount_pie_chart

用�?�显示饼图。amount_pie_chart类型支�?的其它�?�数如下：

amount_pie_chart支�?�?�时比对多个bucket的数�?�。

(3) amount_today_count

用�?�显示当天的数�?�，并根�?�昨天�?�时间的数�?�预测今天的全天的数�?�。支�?的其它�?�数如下：

amount_today_count支�?�?�时显示多个bucket的数�?�。

(4) amount_total_count

显示�?一时间范围的数�?�总和，如最近30天注册的用户总数。支�?的其它�?�数如下：

amount_total_count支�?�?�时显示多个bucket的数�?�。

(5) realtime_line_chart

显示实时数�?�的折线图，更新频率是1秒。

realtime_line_chart支�?�?�时显示多个bucket的数�?�。

(6) realtime_count

显示实时数�?�的数值，更新频率是实时。

realtime_count支�?�?�时显示多个bucket的数�?�。

(7) datalist_list

显示DataList数�?�列表。由于DataList类型�?�以存储任何数�?�的列表，所以该类型的widget支�?高度自定义。�?�以通过template�?�数指定显示DataList的模�?�，模�?�采用Mustache，渲染的数�?�格�?是{"data": [数�?�列表]}。下�?�的实例中还会对此进行介�?。除此之外还支�?count_per_page�?�数用�?�指定�?页�?显示的数�?��?�数。

(8) custom_code

该widget类型比较特殊，无需bucket�?�数，�?�需�?content�?�数。作用是执行自定义的代�?，包括HTML/CSS/JavaScript。如：

  - type: custom_code
    content: >
      <p>hi</p>

综�?�实例

现在�?�设�?统计Facebook网站的数�?�，以使用Ranaly的Node.js客户端为例。首先我们通过node_ranaly建立到Redis的连接（�?�设Redis�?行在本机6380端�?�上）：

var ranaly = require('node_ranaly');
var ranalyClient = ranaly.createClient(6380, '127.0.0.1');

首先�?统计的是用户的数�?，�?当用户注册�?功都调用如下代�?令Users桶的数值加1：

var rUsers = new ranalyClient.Amount('Users');
rUsers.incr();

然�?�我们�?统计网站的访问�?，�?当访问一个页�?�时，都执行：

var rPageViews = new ranalyClient.Amount('Page views');
rPageViews.incr();

现在�?��?置Ranaly�?�视化部分�?�显示我们的统计数�?�：

app_name: Facebook
redis:
	host: 127.0.0.1
	port: 6380
users:
	- username: admin
	  password: admin123
pages:
	- title: Overview
	  widgets:
	    - type: amount_line_chart
	      bucket: [Users, Page views]

在这个�?置中，我们使用折线图�?�比对用户数�?和访问�?的关系。将该内容存为config.yaml，然�?�执行：

$ node ./ranaly.js /path/to/config.yaml
Ranaly server listening on port 3000

此时就�?�以通过http://127.0.0.1:3000�?�访问了。

在Facebook中，用户�?�以�?�布文字状�?�?照片和视频，若想统计这3�?类型的状�?的比例，�?�以在�?�布时执行：

var bucket = '';
switch (status.type) {
case 'text':
	bucket = 'Text';
	break;
case 'photo':
	bucket = 'Photo';
	break;
case 'video':
	bucket = 'Video';
	break;
}
var rStatus = new ranalyClient.Amount(bucket);
rStatus.incr();

然�?�我们接�?�编辑config.yaml，在widgets中加入：

		    - type: amount_pie_chart
		      bucket: [Text, Photo, Video]

这时�?新�?�动Ranaly�?务器（�?次修改config.yaml都得�?�?�），�?�以看到显示3者比例的饼图，并且�?�以�?�?调整时间范围。

接下�?�显示�?务器的资�?，包括内存和CPU：

var rMemory = new ranalyClient.Realtime('Memory');
var rCPU = new ranalyClient.Realtime('CPU');
setInterval(function () {
	rMemory.set(System.getUsedMemory());
	rCPU.set(System.getUsedCPU());
}, 100);

嗯...好�?是没有System.getUsedMemory()和System.getUsedCPU()这两个东西，�?过�?��?知�?�他们都会返回个数字就好了。

�?�样我们接�?�编辑config.yaml，在widgets中加入：

		    - type: realtime_count
		      bucket: [Memory, CPU]

�?�?��?务器，就�?�以看到空闲的内存和CPU资�?了。�?次Realtime类型的数�?�更新都会推�?给Ranaly�?务器，所以页�?�上显示的数值�?100毫秒�?�一次。

现在我们还希望能在Ranaly页�?�中看到用户最新上传的头�?，所以我们在头�?上传�?功�?�执行：

var rAvatar = new ranalyClient.DataList('Avatar');
rAvatar.push(avatarURL, 100);

其中avatarURL是一个字符串，存储用户头�?的URL地�?�。100表示�?�存储最新的100�?�记录，防止数�?��?�用过多的内存（因为数�?�是存储在Redis中的）。

接�?�我们�?��?置config.yaml：

		    - type: datalist_list
		      bucket: [Avatar]

默认会以列表的形�?展示数�?�，�?是很好看，所以我们�?�自定义模�?�。Ranaly使用了BootStrap框架，所以�?�以在模�?�中自由使用BootStrap的风格。我们将数�?�修改�?：

		    - type: datalist_list
		      bucket: [Avatar]
		      template: >
					<ul class="thumbnails" style="margin-right: -20px">
					  {{#data}}
					  <li class="span2" style="width: 135px">
					    <a href="{{.}}" class="thumbnail">
					      <img src="{{.}}" alt="" width="150" height="150" />
					    </a>
					  </li>
					  {{/data}}
					</ul>

对于展示图片，Ranaly�??供了一个预置的模�?�，�?�以这样写：

		    - type: datalist_list
		      bucket: [Avatar]
		      preset_template: images

接�?�我们想记录最近注册�?功的用户的资料，则在用户注册�?功�?�执行：

var rUsers = new ranalyClient.DataList('Users');
rUsers.push({
	id: user.id,
	name: user.name,
	age: user.age,
	description: user.description
}, 100);

然�?�修改�?置文件：

		    - type: datalist_list
		      bucket: [Users]
		      template:
		          <table class="table table-hover table-bordered">
		            <thead>
		              <tr>
		                <th>ID</th>
		                <th>name</th>
		                <th>age</th>
		                <th>description</th>
		              </tr>
		            </thead>
		            <tbody>
		              {{#data}}
		              <tr>
		                <td>{{id}}</td>
		                <td>{{name}}</td>
		                <td>{{age}}</td>
		                <td>{{description}}</td>
		              </tr>
		              {{/data}}
		            </tbody>
		          </table>

就�?�以看到记录最新注册用户资料的表格了。