用JSP在Div中随机点分布

最新推荐文章于 2021-06-09 10:19:11 发布

Mr_Chenph

最新推荐文章于 2021-06-09 10:19:11 发布

阅读量845

点赞数

本文链接：https://blog.csdn.net/yueritian/article/details/9278787

版权

有个需求，需要用到Div中随机点分布，随手写了一个，最后发现需求变了，没用到。

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	// 点数量
	int point_Count = 30;
	// div大小
	int div_Width = 180;
	int div_Height = 150;
	// 点大小
	int point_Width = 10;
	int point_Height = 10;
	
	// 存储已经随机出的点
	int[] left_Array = new int[point_Count];
	int[] top_Array = new int[point_Count];
	// 随机类
	class Mice{
		public int randomNum(int MIN, int MAX){
			return new Random().nextInt(MAX - MIN + 1) + MIN; 
		}
	}
	Mice mice = new Mice();
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Mice</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<style>
		.block {background-color: #009900;height: <%=point_Height%>px;width: <%=point_Width%>px;}
	</style>
  </head>
  <body>
  	<div id="tprs" style="width:<%=div_Width%>px;height:<%=div_Height%>px;position:absolute;border:1px solid #c9d5ed;">
  		<% 
  			for(int i = 0;i < point_Count;i++){
  				int left = 0;
  				int top = 0;
  				// 随机数需要注意
  				// 1 与点宽度/长度相加不能超出div范围
  				// 2 不能出现点与点之间重叠的情况
  				// 随机处理
  				boolean again = true;
  				while(again){
  					left = mice.randomNum(0, div_Width);
  					top = mice.randomNum(0, div_Height);
  					// 2.1 随机点不能超出div范围
  					if(left > div_Width - point_Width || top > div_Height - point_Height){
  						again = true;
  						continue;
  					}else{
  						again = false;
  					}
  					// 对比已经存在的点数据
  					for(int j = 0;j < i;j++){
  						// 判断四个顶点是否已经存在于已有节点中
  						// 左上顶点
  						int zb1_x = left;
  						int zb1_y = top;
  						// 右上顶点
  						int zb2_x = left + point_Width;
  						int zb2_y = top;
  						// 左下顶点
  						int zb3_x = left;
  						int zb3_y = top + point_Height;
  						// 右下顶点
  						int zb4_x = left + point_Width;
  						int zb4_y = top + point_Height;
  						// 已经存在的坐标的范围
						int left_FW = left_Array[j] + point_Width;
						int top_FW = top_Array[j] + point_Height;
						// 判断标记
						boolean mark =  false;
						if(zb1_x <= left_FW && zb1_x >= left_Array[j] && zb1_y <= top_FW && zb1_y >= top_Array[j]){
							mark = true;
						}
						if(zb2_x <= left_FW && zb2_x >= left_Array[j] && zb2_y <= top_FW && zb2_y >= top_Array[j]){
							mark = true;
						}
						if(zb3_x <= left_FW && zb3_x >= left_Array[j] && zb3_y <= top_FW && zb3_y >= top_Array[j]){
							mark = true;
						}
						if(zb4_x <= left_FW && zb4_x >= left_Array[j] && zb4_y <= top_FW && zb4_y >= top_Array[j]){
							mark = true;
						}
						if(mark){
							again = true;
	  						continue;
						}
  	  				}
  				}
  				left_Array[i] = left;
  				top_Array[i] = top;
  				out.println("<div class='block' style='top:"+top+"px; left:"+left+"px; position:absolute'></div>");	
  			}
  		%>	
	</div>
  </body>
</html>

最终效果：

Mr_Chenph

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
用JSP在Div中随机点分布

有个需求，需要用到Div中随机点分布，随手写了一个，最后发现需求变了，没用到。<% // 点数量 int point_Count = 30; // div大小 int div_Width = 180; int div_Height = 150; // 点大小 int point_Width = 10; int point_Height = 10; // 存储已经随机出的
复制链接

扫一扫