很有爱的QAir空气监测站之HTML5版~

[xhinking]

特别有爱的QAir空气监测站，小兔子、汽车、房子等等全部是橡皮泥捏的~小心被萌翻

用到了一些常见的HTML5技术，交互和动画主要使用CreateJS来实现，部署在SAE上。

http://qair.sinaapp.com

[TonyG]

amazing stuff !

[xhinking]

@TonyG 谢谢
~

[iYu]

老萌了。

[NemoAlex]

Uncaught ReferenceError: type is not defined

[xhinking]

@NemoAlex 会出现数据没有加载完的情况，需要刷新几次。

[jedicxl]

哈哈已经买了IOS版的，太可爱了

[jlee]

你是kvc同学工作室的吧，哈哈~

[xhinking]

@jedicxl 谢谢支持！

[xhinking]

@jlee 哈哈，是的啊。

[ichigo]

无法切换城市？

[cranej]

北京太恐怖了, 北京公司offer再好也不能去，还是老实呆在魔都吧，哈哈

[xhinking]

@ichigo 左上角有添加监控城市的，然后就可以切换了。

[xhinking]

@ichigo 错了...是右上角

[xhinking]

@cranej 在厦门的无压力啊

[imcj]

推荐给同事了。

[sobigfish]

不允许获得位置得话就什么都看不到么？


btw 海口缩写hk...你让香港情何以堪啊

[sobigfish]

o 原来是从usembassy采集的数据啊，那lz可以从香港环保署 采集hk的api啊 http://www.epd-asg.gov.hk/cindex.html 严格来说也是要授权的－，－

[xhinking]

@sobigfish 不获取位置的话应该是看到帝都的..判断逻辑那里还有些小bug

目前还不支持香港..

[xhinking]

@sobigfish 北上广等地是从美帝大使馆获取的数据，国内的数据严重不靠谱，解析起来还很要命-_-

香港的数据回来看看能不能获取授权，果断添加进来。

[sobigfish]

@xhinking 看来greenpeace也对官方的api有不同看法。http://www.greenpeace.org/hk/aptin/

wiki http://zh.wikipedia.org/wiki/%E7%A9%BA%E6%B0%A3%E6%B1%A1%E6%9F%93%E6%8C%87%E6%95%B8_(%E9%A6%99%E6%B8%AF)

[paloalto]

firefox打开一直卡在进度条上。
chrome打开，页面只有一个绿色的球。

[xhinking]

@paloalto 应该是图片加载太慢的问题，SAE的速度还是有点汗。。

[jimmy]

版本有更新了呢，之前没有进度条，感觉卡死的样子。
现在加了进度条好多了呢。

[amoydavid]

@jimmy 蛙哥果然四处出没。

[jimmy]

@amoydavid 哈哈，彼此彼此

[vincent1q84]

火狐打开只有一个绿色的球

[moxuanyuan]

不错

[xhinking]

@vincent1q84 明天测试一下火狐浏览器。

[xhinking]

@jimmy 竟然见过没有进度条的版本！难道是自己人-_-

[zx900930]

火狐打开只有一个绿色的球+1

[aveline]

@xhinking 诶你也在厦门么... 我还以为那个是根据地理位置自动判断的... 囧

[jimmy]

@xhinking 哈哈

[choyo]

chrome开怎么只有一个圆盘呢。

[choyo]

多刷几次，出来了：）

[momou]

虽然看到结果，但不知道那些数字代表空气质量如何啊。。。

[xhinking]

@aveline 理论上讲应该是会自动判断地理位置的...

[xhinking]

@momou 可以看小兔子的表情，小兔子越开心空气质量越好。

[xhinking]

好消息，iOS版今天限免啦~大家喜欢的话快去下载啊~~

https://itunes.apple.com/cn/app/q-air-kong-qi-jian-ce-zhan/id495609535?mt=8

[ywencn]

那个小兔子能做成汤姆猫那种可以点一下就动一下的不

[xhinking]

@ywencn 负责捏橡皮泥的同志表示压力很大很大

[joby]

@xhinking This app is incompatible with your China Unicom Samsung Galaxy Nexus.

[archeryan]

H5的动画很厉害啊
easeljs+tweenjs
能透露一下动画的实现技术吗=。=

[xhinking]

@archeryan

主要就是easeljs+tweenjs，很多概念和flash差不多，用起来挺方便的。当时就配合文档看了几篇文章，上手很快。

http://active.tutsplus.com/tutorials/games/learn-createjs-by-building-an-html5-pong-game/

遇到的最大问题就是圆周运动，其他就没什么了。

性能还是有些问题的，R屏ipad全屏的时候会出现卡顿，本来有好多车啊、飞机啊都没加进来。

[jimmy]

@joby 这是一个很奇怪的问题，不知道啥原因，我的N1也说不支持，之前的版本还可以，自从ADT升到高版本之后就不行了，但我还是用2.2的SDK做开发的。

[54xiaobin]

根据ip判断城市够了吧？用geo是不是体验差了点

[xhinking]

@54xiaobin 之前从没有用过HTML5 geo，这次正好有机会就尝试了一下。