无聊的日子你是怎么过的

手机不格，qb看多了

这几天，一直处在一个人，没有网络，没有电视，没有书籍的状态，唯一的可以交互的东西是手机。自然带来了这个问题，如何打发时间，或者不无聊的消耗时间，甚或有效利用时间。

6.21日－现在，我都处于上述状态，其中头两天找房子的时候待在同学那里，有网络，有人聊天，过得很快。然而房子一旦敲定，无聊就来了，一个人呆在新的空荡荡的屋子里不知道干啥，电脑留给老爸了，房东买的电视还每到，我只好发呆。

23号，去超市买一些东西，但是发现自己对居家的东东实在是不了解，就买了个烧水壶回来，后来去市场购了垃圾桶，拖把，等用品，顺便把周围的环境观察了下，晚上去三哥那里看了球赛，顺便住下了。

24号，back，无聊，去百家居逛，转了很久，买了个垫子。回来打扫卫生，这次估计是我迄今唯一一次觉得打扫卫生很happy的一次，真tmd充实。再有就是看电子书，逛逛sns，没劲。

25号，该买的买了，该打扫的打扫了，我到底还能干啥？这时候我才发现，平常的快餐生活害了自己，现在我可以静下心去看greader的每一篇觉得有意义的内容，而不是按A，我也能把以前看一半的电子书捡起来了。而我发现，这时候看比起以前，看的更用心，体会的更深。

其实，倘若平常也能静下心去做每一件事情，那么你永远不会无聊。用心的买东西，用心逛街，用心的看书，用心对待一切。

构建可搜索的基于Web的Google图表

在Poynter看到的关于Google Chart Tools的介绍 How to make searchable, Web-based Google charts。参考该文章，也试用了下Google Chart Tools。

　　大量的数据可视化需要有专业的知识或者需要话费大量时间精力以及资源，而google的The Google Visualization API（web）使得此工作变得简单，不管你是designer, developer, Web producer 还是hobbyist。

　　废话不多说，直接上例子，为了体验实验，我自己构造了例子，而没有采用原文的实例。

1. 首先打开Google Visualization API homepage，选择Bar Chart。



2. 在下面的图中，点击Google Visualization API playground的字样。



3. 然后打开一个新的页面，左侧为API或者code的列表，右侧为当前API或者code的代码，而下面为对应的bar chart，修改code，点击 run code，bar chart会有相应的变化。



4. 原始的代码如下 [javascript]function drawVisualization() {
   // Create and populate the data table.
   var data = new google.visualization.DataTable();
   var raw_data = [['Austria', 1336060, 1538156, 1576579, 1600652, 1968113, 1901067],
   ['Bulgaria', 400361, 366849, 440514, 434552, 393032, 517206],
   ['Denmark', 1001582, 1119450, 993360, 1004163, 979198, 916965],
   ['Greece', 997974, 941795, 930593, 897127, 1080887, 1056036]];
   
   var years = [2003, 2004, 2005, 2006, 2007, 2008];
   
   data.addColumn('string', 'Year');
   for (var i = 0; i < raw_data.length; ++i) {
   data.addColumn('number', raw_data[i][0]);
   }
   
   data.addRows(years.length);
   
   for (var j = 0; j < years.length; ++j) {
   data.setValue(j, 0, years[j].toString());
   }
   for (var i = 0; i < raw_data.length; ++i) {
   for (var j = 1; j < raw_data[i].length; ++j) {
   data.setValue(j-1, i+1, raw_data[i][j]);
   }
   }
   
   // Create and draw the visualization.
   new google.visualization.BarChart(document.getElementById('visualization')).
   draw(data,
   {title:"Yearly Coffee Consumption by Country",
   width:600, height:400,
   vAxis: {title: "Year"},
   hAxis: {title: "Cups"}}
   );
   }[/javascript]



5. 通常情况下，需要修改这几个参数即可。
   
   
   
   1. 第4行var raw_data的内容
   
   
   2. 第9行var years的内容
   
   
   3. 第11行和第32行对应的Y轴的坐标名称
   
   
   4. 第33行的X轴的坐标名称
   
   
   5. 第30行的chart的名称
   
   
   6. 其他详细参数设置可以参考文档的Configuration Options部分
   
   
   
   



6. 我的修改之后的代码和charts分别如下所示：[javascript]function drawVisualization() {
   // Create and populate the data table.
   var data = new google.visualization.DataTable();
   var raw_data = [['econsh', 40000, 55381],
   ['mushi', 20000, 43816],
   ['wods', 30000, 5816]];
   
   var years =['article num', 'time'];
   
   data.addColumn('string', 'properties');
   for (var i = 0; i < raw_data.length; ++i) {
   data.addColumn('number', raw_data[i][0]);
   }
   
   data.addRows(years.length);
   
   for (var j = 0; j < years.length; ++j) {
   data.setValue(j, 0, years[j].toString());
   }
   for (var i = 0; i < raw_data.length; ++i) {
   for (var j = 1; j < raw_data[i].length; ++j) {
   data.setValue(j-1, i+1, raw_data[i][j]);
   }
   }
   
   // Create and draw the visualization.
   new google.visualization.BarChart(document.getElementById('visualization')).
   draw(data,
   {title:"SBBSert statictics",
   width:600, height:400,
   vAxis: {title: "properties"},
   hAxis: {title: "nums"}}
   );
   }[/javascript]


对应图片如下

注意：这个bar chart貌似不支持中文，有了中文的话，就不能正常工作，已经反馈给google

Machine Learning Demos

这是Basilio Noris博士的杰作，主要针对现有的机器学习的分类、距离、回归等算法的现有source code并不是很好使用以及理解，实现了一个交互式的GUI，把一些库和例子结合起来，对这些算法进行了更好的可视化和比较，该GUI支持Windows，Linux，以及Mac。用户可以根据自己的机器选择安装进行体验。详细的使用和介绍参考这里Machine Learning Demos。

界面如下：

实现的方法如下：

Classification	Regression	Dynamical Systems	Clustering	Projections
Support Vector Machine (SVM) (C, nu, Pegasos) Relevance Vector Machine (RVM) Gaussian Mixture Models (GMM) Multi-Layer Perceptron + BackPropagation Gentle AdaBoost + Naive Bayes Approximate K-Nearest Neighbors (KNN)	Support Vector Regression (SVR) Relevance Vector Regression (RVR) Gaussian Mixture Regression (GMR) MLP + BackProp Approximate KNN Sparse Optimized Gaussian Processes (SOGP) Locally Weighed Projection Regression (LWPR)	GMM+GMR LWPR SVR SEDS SOGP (Slow!) MLP KNN	K-Means Soft K-Means Kernel K-Means GMM One Class SVM	Principal Component Analysis (PCA) Kernel PCA Independent Component Analysis (ICA) Linear Discriminant Analysis (LDA) Fisher Linear Discriminant EigenFaces to 2D (using PCA)

岁月如歌还是如杀猪刀

今天去JLH原来的宿舍收拾最后的东西，居然好多是本科的记忆了。难得我的东西保留的那么好，通知书，新生导航都是那样的完整，以及那时候青涩的回忆。

　　那时的我，头发是直直的，天天乐呵呵，喜欢恶作剧，喜欢浦口的足球场，其他时间泡在图书馆；那时的我只有两件事情，学习和玩；现在的我，IT民工一个，头发不再坚挺，偶尔笑笑，不再恶作剧，很少踢球，从来不去图书馆了。这也是我的本科和研究生的写照，本科的我活在人群中，和哥们一起欢乐；到了研究生，各自呆在实验室，同学也认不全，因此本科的时候毕业我可以喝上一打啤酒，现在我都不愿意参加毕业典礼，从20080622那天起，我不再是一个真正的大学生，我的生活完全的改变了，而随之改变的是我的性格。

　　不想过多描述现在的我，只愿看着物品去回忆曾经的青春，岁月真的是杀猪刀了。。。回家的时候我妈都说我变丑了，我可是亲生的啊。。。

　　物品1：录取通知书。我依稀记得附带的新生导航里面还有介绍电台的页面，记得男生宿舍，还有该死的159和鼓杨线。报道的手续的签名几乎模糊。

　　物品2：信和明信片，加起来有一本计算机专业书籍那么厚。那时候还是比较原始的，也是幸福的，有人写信找我，当然我也回过，一打明信片也说明了当时我们的友谊是那么的阳光，赛果五道杠。发现其中一封mm的信封里面居然有字，WTF，当时我是真的没有在意，也没有想过还有这等事情，信的字里行间有“有一片花儿我们曾经望过，有一些人儿我们曾经爱过”云云我都没有看懂，只能慨叹，坑爹了。

　　物品3：日记。看来自己以前思考和反省很多，也喜欢写东西，现在连个成语都尼玛不会用了，只剩网络体，有木有。两本日记躺在那里，以后怕是不会再有那份心情去写了。我认为这个和互联网有着很大的关系，让哥不淡定了。

　　物品4：哥们的照片、院内足球冠军奖状和院系杯冠军照片。那是和哥们一起奋斗的岁月，从来没有一个人去上课，更不可能一个人去吃饭，逛街也是一群人（当然我的取向没有问题，这点现在已经证明了）。而事实证明，那时的哥们，是真的兄弟，即使有的在北京，有的在武汉，有的在芜湖，有的在无锡，有的在上海。。。，但都在我的心中。

阴影、背景以及边界的CSS builder

CSS对于Web页面的重要性不言自明，而不懂得CSS的用户甚至是非资深的Web开发者常常也会头疼CSS的阴影，边界等问题，尤其是要做的漂亮，有自己的style，这里推荐大家一个神器。

　　Layer Styles是一个在线的CSS builder for shadows, backgrounds, and borders。它支持的styles包括：

1. Drop shadow


2. Inner shadow


3. Background


4. Border


5. Border radius

　　每个style都有几个属性（如Background的属性包括Opacity（不透明度），Gradient（梯度），以及梯度的style和angle），属性发生变化时，页面上的div会实时变化，同时下面的CSS code也会跟着变化，这样我们不必精通CSS，也照样可以编写适合自己的CSS代码。当然，对于IE，表示无能为力。

　　下面的截图是我自己随手涂鸦的作品：



　　对应的CSS代码：

[css]

<code>border: 1px solid black;
border-radius: 13px;
background-image: -moz-linear-gradient(top, white, black);
background-image: -webkit-gradient(linear, center top, center bottom, from(white), to(black));
box-shadow: 0 1px 5px 6px rgba(14,232,50,0.75), inset 0 1px 1px 1px #ffb812;</code>

[/css]