当前位置: 代码迷 >> Web前端 >> 5区法平均分点
  详细解决方案

5区法平均分点

热度:168   发布时间:2012-07-15 20:11:29.0
五区法平均分点
今天这个项目的一个算法,想让网页中的所有指定层随机在网页中排布,开始用的是用Math.random()来进行取点,但是这样的点阵下来有时候某区间下点的密度较高,所以才想出来这个法子~,如果还有更好的算法的话可以贴出来给偶学习学习:-)
画个草图出来说明什么是“五区法”:

这种形式的话给5区点比例会多一点,但是比系统的随机函数给的不一定区域的密集还是好看点的,而且进入网页是如果左上区域内容不多的话,视线会移动到中间区域的!具体用户视觉没学过,就是这个意思了~~~~。
下面就是我的代码了!(比较乱,还没优化~~)
  1. var cal_width, cal_height, rect;
  2. //根据类型返回随机坐标对象
  3. this.getRandPos = function (){
  4. var _id = (_rec_id)%5;
  5. var _ret;
  6. var _win_height = parseInt(_wrap.height()/2);
  7. var _win_width = parseInt(_wrap.width()/2);
  8. var _height = parseInt(_wrap.height()/2 - _obj.height() );
  9. var _width = parseInt(_wrap.width()/2 - _obj.width() );
  10. cal_width = (Math.random()*1000)%_width;
  11. cal_height = (Math.random()*1000)%_height;
  12. switch(_id){
  13. case 1://2区
  14. _ret = {
  15. x: parseInt(cal_width + _win_width),
  16. y: parseInt(cal_width)
  17. };
  18. break;
  19. case 2://3区
  20. _ret = {
  21. x: parseInt(cal_width),
  22. y: parseInt(cal_height + _win_height)
  23. };
  24. break;
  25. case 3://4区
  26. _ret = {
  27. x: parseInt(cal_width + _win_width ),
  28. y: parseInt(cal_height + _win_height)
  29. };
  30. break;
  31. case 4://5区
  32. _ret = {
  33. x: parseInt(cal_width + _win_width/2 ),
  34. y: parseInt(cal_height + _win_height/2)
  35. };
  36. break;
  37. default://1区
  38. _ret = {
  39. x: parseInt(cal_width),
  40. y: parseInt(cal_height)
  41. };
  42. }
  43. _rec_id++;
  44. return _ret;
  45. };

  相关解决方案