Puo's 学习园地
http://puo.cn

用Web Picasa API搭建站内相册

玩过Flickr,使用过巴巴变,yupoo,也见识了茄子等,不过终于看到Picasa Web API 出线了

下面是原作者的文章,转了过来!没事的时候可研究一下

在flickr时代,为了专门把站内嵌入相册,还专门写了一篇文章把Flickr相册搬回家。flickr被墙之后,我就把个人相册转到了Web Picasa上。用Picasa Web就简单多了,官方提供了Slideshow Flash,而且形式也比较漂亮,阅微堂之前也是用这样的方式,不过这种方法麻烦的一点是在Picasa上添加相册,就要手动到blog这边更新一次。这两天看到了 Web Picasa API,感觉这玩意儿的功能太强了,完全可以做一个Picasa的站内镜像版。 最后的效果见阅微堂相册。 更令人惊讶的是,这种效果完全是javascript(JSON API)实现的(虽然我觉得如果在后台用php实现效果会更好)。主要用的是JavaScript interface to PicasaWeb Albums,一个开源项目,其实就一个单js文件。使用也非常简单,就下面几行代码:

>script type='text/javascript'<
 username = 'your.username'; photosize='800';
>/script<

>script type='text/javascript' src='http://yourpath/pwa.js'<
>/script<

不过我改了很多地方,除了界面UI上的改变外,主要是改进页面加载速度。有兴趣的可以参考一下我的代码

在修改过程中,仔细学习并应用了picasaweb的照片展示方式。Google的图片预载入做的非常好,浏览图片的时候会自动开始载入下一张图片,而且每张图片有若干种大小,它会从小到大预先载入,以便察看下一张的时候便能使用已经载入的图片,所以经常出现察看下一张图片时刚开始比较模糊,过一会就会变得清晰的情形(其实这种效果用小波编码的图像可以自动实现,但不知为何一直没见到什么应用)。这样做的相册,用户体验非常好,xiaonei等网站的相册可以学一学。不过这种方法会增加网站的带宽成本,Google财大气粗… 另外,我终于知道了为何我以前有时候引用Google的图片却不成功了。Google的图片分为好多种大小,通过imgmax参数调用,比如右边图片的原始地址是DSCN6503.JPG,但直接在网页上引用这个地址是不行的,一定要明确指出需要的图片大小,而且还不能太大,太大了只能提供下载(如果直接输入地址,浏览器会提示你保存图片,而不是显示出来)。能在网页上引用的图片最大宽度(高度)为800px,也即DSCN6503.JPG?imgmax=800。更详细的资料见下表。

输出大小 是否可剪切 是否可嵌入 输出大小 是否可剪切 是否可嵌入
32 Yes Yes 576 No Yes
48 Yes Yes 640 No Yes
64 Yes Yes 720 No Yes
72 No Yes 800 No Yes
144 No Yes 912 No No
160 Yes Yes 1024 No No
200 No Yes 1152 No No
288 No Yes 1280 No No
320 No Yes 1440 No No
400 No Yes 1600 No No
512 No Yes d No No

从表中可以看出Google输出的图片种类之多,难道Google在服务器端保存了这么多副本么?那得耗费多少空间啊?

来自:http://zhiqiang.org/blog/posts/local-mirror-of-picasaweb-using-api.html


不知道你是否正需要这个,我是用不到了,用着不顺手,还是Flickr或者巴巴变吧


Technorati : Flickr, picasa, yupoo

打赏
允许转载,请注明转载地址:Puo's 学习园地 » 用Web Picasa API搭建站内相册

评论 抢沙发

做一个好的个人学习园地

主要网建,域名、集装箱物流、生活方法论的学习及研究,整理等内容

网址导航222域名店

觉得文章有用就打赏一下文章作者

非常感谢你的打赏,我们将继续提供更多优质内容,让我们一起创建更加美好的网络世界!

支付宝扫一扫

微信扫一扫

登录

找回密码

注册