前端页面,看看这个效果:主机状态图,怎么实现?

YueZheng 发布于 2013/12/10 14:25
阅读 314
收藏 0

后台返回类似:

[{"server": "server_1", "status": "active"},
 {"server": "server_2", "status": "active"},
 {"server": "server_3", "status": "error"},
 …………
]

如何实现下图中的状态图:

绿色点表示状态正常的,红点表示error的。有没有类似的插件?

加载中
0
Youtubeornotobe
Youtubeornotobe

不用插件吧,直接js,根据json遍历在固定的高宽度里输出点,计算点的css的相对位置,将其定位,然后再根据状态显示红点还是绿点。 


YueZheng
YueZheng
恩 ,我试试看。
0
javadeveloper
javadeveloper
安全点,还是每个节点指定一个ID,然后操作替换不同颜色的图片就行。
0
梅开源
梅开源

回忆是挥不去的痛……09年我做过个这个

查询状态返回个json,然后UI画一排电脑,红掉的上面用jquery定位画个框

你这个只需要根据json值,把对应div的样式换个就好

YueZheng
YueZheng
嗯嗯,谢谢。看来都有类似的需求,哈哈!
返回顶部
顶部