基于Java+MySQL的三维模型素材交易平台设计

最新推荐文章于 2023-06-28 16:30:54 发布

shejizuopin

最新推荐文章于 2023-06-28 16:30:54 发布

阅读量377

点赞数 1

文章标签： java javascript MySQL 三维模型素材网站素材交易模型

本文链接：https://blog.csdn.net/sheziqiong/article/details/126902558

版权

目录
第1章需求分析 3
1.1 项目背景和问题的提出 3
1.2 项目意义和主要完成内容 3
1.2.1项目意义： 3
1.2.2功能： 3
1.3 项目开发环境 4
第2章概要设计 4
2.1系统功能框架 4
2.2功能模块说明 4
2.2.1用户： 4
2.2.2管理员： 5
第3章详细设计 7
3.1前端设计 7
3.1.1设计理念 7
3.1.2实现方法 7
3.1.3关键代码： 7
3.1.4效果图示： 10
3.2用户登录 11
3.2.1数据设计 11
3.2.2相关ajax实现 12
3.1.3流程图 14
3.3资源文件 14
3.1.1数据设计 14
3.1.2代码描述 15
3.1.3流程图 19
3.4留言 19
3.1.1数据设计 19
3.1.2相关代码 20
3.1.3流程图 21
3.5投稿 21
3.1.1数据设计 21
3.1.2算法描述 22
3.1.3流程图 24
3.7 数据库设计 24
3.7.1数据设计 24
3.7.2物理设计表汇总 26
第4章系统测试 30
4.1用户测试 30
4.1.1登录注册 30
4.1.2修改资料 31
4.1.3留言 33
4.1.4投稿 33
4.1.5文件下载 34
4.2管理员测试 35
4.2.1修改用户 35
4.2.2资源文件管理 36
4.2.3留言处理 38
4.2.4投稿文件操作 38
总结 40
1.2 项目意义和主要完成内容
1.2.1项目意义：
为了弥补上述弊端，本网站提在原有的模板网站上做出了技术和机制的创新，关键在于电子货物的商城模式，给用户以在线下载的方式获取网站上所需类型的模型，用户有一定的金币来兑换模型，3d视野，新式网站demo的下载，是一种视觉的享受，顺应时代的潮流，金币不够的情况下客户可以选择投稿自己的模板来或得高额的金币奖励，也可以给网站提出相应的建议来获取金币奖励，当然也可以使用网上银行进行充值。
上传到的文件经过后台的筛选和重做可以作为新的模板进行上架，扩充网站内容，经过筛选后的投稿即给予投稿者一定奖励。留言和反馈内容如果有价值也有一定的奖励发布给投稿者。
1.2.2功能：
1.用户端：实现网站的观看，需要进行登录才能实现下载功能，如果余额充足，则顺利下载，如果不足，则可选择提供有用的建议或者投稿作品来获得金币奖励，或者使用现金充值。
2.商品类型：网站（商业，宣传，其他类型），模型（风景建筑，人物妖怪，军事器材，动植物，室内，其他杂项），动画（人物，动物，其他），3d全景视野（家居装修，公共场所，其他全景）。
3.用户操作：用户注册，用户登录，忘记密码，修改姓名和性别资料，头像上传，下载文件，金币充值，提供建议，投稿作品。
4.其他功能：验证内容的合法性，自动校验是否已下载，验证的拖动滑块验证功能，全屏滑动功能，本文转载自http://www.biyezuopin.vip/onews.asp?id=150743D背景的生成和展示以及点击事件的触发功能，产品的自动分类功能以及自动检测扣费情况。

1.3 项目开发环境
操作系统 Windows10
开发工具 Myeclipse，HBulider
浏览器 Google Chrome/Internet Exploer
数据库 MySQL
使用语言 JSP语言和IAVA语言

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'register.jsp' starting page</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">
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
		<style>

			body {
				color: #000;
				font-family:Monospace;
				font-size:13px;
				margin: 0px;
				overflow: hidden;
			}

			#info {
				position: absolute;
				top: 0px; width: 100%;
				text-align:center;
				padding: 5px;
			}

		</style>
	</head>
	<body>
	<%request.getSession().removeAttribute("id");
	request.getSession().removeAttribute("name"); %>

		<div id="container"></div>
		<div id="info" style="position:absolute;top:85px;left:350px;width:630px;height:100px;">
			<span style="font-size:80px;color:black;">欢迎来到3D模板商城</span>
			<h1>制作人：B15533赵碧帆</h1>
		</div>

		<script src="js/build/three.js"></script>
		<script src="js/jquery-2.1.1.js"></script>

		<script src="js/newjs/OrbitControls.js"></script>
		<script src="js/newjs/WaterShader.js"></script>

		<script src="js/newjs/Detector.js"></script>
		<form action="show.jsp" method="Post" id="show">
		</form>
		<script>//border:#FF0000 1px dashed;doshow?action=show

			if ( ! Detector.webgl ) {

				Detector.addGetWebGLMessage();
				document.getElementById( 'container' ).innerHTML = "";

			}

			var container;
			var camera, scene, renderer;
			var controls, water, sphere;

			var parameters = {
				width: 2000,
				height: 2000,
				widthSegments: 250,
				heightSegments: 250,
				depth: 1500,
				param: 4,
				filterparam: 1
			};

			var waterNormals;

			init();
			animate();

			function init() {

				container = document.getElementById( 'container' );

				//

				renderer = new THREE.WebGLRenderer();
				renderer.setPixelRatio( window.devicePixelRatio );
				renderer.setSize( window.innerWidth, window.innerHeight );
				container.appendChild( renderer.domElement );
	
				//

				scene = new THREE.Scene();
				scene.fog = new THREE.FogExp2( 0xaabbbb, 0.0001 );

				//

				camera = new THREE.PerspectiveCamera( 55, window.innerWidth / window.innerHeight, 0.5, 3000000 );
				camera.position.set( 2000, 750, 2000 );

				//

				controls = new THREE.OrbitControls( camera, renderer.domElement );
				controls.enablePan = false;
				controls.minDistance = 1000.0;
				controls.maxDistance = 5000.0;
				controls.maxPolarAngle = Math.PI * 0.495;
				controls.target.set( 0, 500, 0 );//目标位置在球心

				scene.add( new THREE.AmbientLight( 0x444444 ) );

				var light = new THREE.DirectionalLight( 0xffffbb, 1 );
				light.position.set( - 1, 1, - 1 );
				scene.add( light );


				waterNormals = new THREE.TextureLoader().load( 'img/water-normal.jpg' );
				waterNormals.wrapS = waterNormals.wrapT = THREE.RepeatWrapping;

				water = new THREE.Water( renderer, camera, scene, {
					textureWidth: 512,
					textureHeight: 512,
					waterNormals: waterNormals,
					alpha: 	1.0,
					sunDirection: light.position.clone().normalize(),
					sunColor: 0xffffff,
					waterColor: 0x001e0f,
					distortionScale: 50.0,
					fog: scene.fog != undefined
				} );


				var mirrorMesh = new THREE.Mesh(
					new THREE.PlaneBufferGeometry( parameters.width * 500, parameters.height * 500 ),
					water.material
				);

				mirrorMesh.add( water );
				mirrorMesh.rotation.x = - Math.PI * 0.5;
				scene.add( mirrorMesh );

				var cubeMap = new THREE.CubeTexture( [] );
				cubeMap.format = THREE.RGBFormat;

				var loader = new THREE.ImageLoader();
				loader.load( 'img/skyboxsun25degtest.png', function ( image ) {

					var getSide = function ( x, y ) {

						var size = 1024;

						var canvas = document.createElement( 'canvas' );
						canvas.width = size;
						canvas.height = size;
						var context = canvas.getContext( '2d' );
						context.drawImage( image, - x * size, - y * size );
						return canvas;

					};

					cubeMap.images[ 0 ] = getSide( 2, 1 ); // px
					cubeMap.images[ 1 ] = getSide( 0, 1 ); // nx
					cubeMap.images[ 2 ] = getSide( 1, 0 ); // py
					cubeMap.images[ 3 ] = getSide( 1, 2 ); // ny
					cubeMap.images[ 4 ] = getSide( 1, 1 ); // pz
					cubeMap.images[ 5 ] = getSide( 3, 1 ); // nz
					cubeMap.needsUpdate = true;

				} );

				var cubeShader = THREE.ShaderLib[ 'cube' ];
				cubeShader.uniforms[ 'tCube' ].value = cubeMap;

				var skyBoxMaterial = new THREE.ShaderMaterial( {
					fragmentShader: cubeShader.fragmentShader,
					vertexShader: cubeShader.vertexShader,
					uniforms: cubeShader.uniforms,
					depthWrite: false,
					side: THREE.BackSide
				} );

				var skyBox = new THREE.Mesh(
					new THREE.BoxGeometry( 1000000, 1000000, 1000000 ),
					skyBoxMaterial
				);

				scene.add( skyBox );

				var geometry = new THREE.IcosahedronGeometry( 400, 4 );

				/*for ( var i = 0, j = geometry.faces.length; i < j; i ++ ) {

					geometry.faces[ i ].color.setHex( Math.random() * 0xffffff );

				}
				
				var material = new THREE.MeshPhongMaterial( {
					vertexColors: THREE.FaceColors,
					shininess: 100,
					envMap: cubeMap
				} );
				* */
				var material = new THREE.MeshPhongMaterial(// {color:0xff0000}
				{ map: THREE.ImageUtils.loadTexture('img/play3.jpg') });
				
				//var material=new THREE.MeshBasicMaterial({ map: THREE.ImageUtils.loadTexture('img/play3.jpg') });

				sphere = new THREE.Mesh( geometry, material );
				sphere.position.y = 120;
				scene.add( sphere );
				
				document.addEventListener('mousedown', onDocumentMouseDown, false);

			}

			function onWindowResize() {

				camera.aspect = window.innerWidth / window.innerHeight;
				camera.updateProjectionMatrix();
				renderer.setSize( window.innerWidth, window.innerHeight );

			}

			//

			function animate() {

				requestAnimationFrame( animate );
				render();

			}

			function render() {

				var time = performance.now() * 0.001;

				//sphere.position.y = Math.sin( time ) * 500 + 250;
				//sphere.rotation.x = time * 0.5;
				sphere.rotation.y = time * 0.51;

				water.material.uniforms.time.value += 1.0 / 60.0;
				controls.update();
				water.render();
				renderer.render( scene, camera );

			}
			
		var projector = new THREE.Projector();
 	
		function onDocumentMouseDown(event){
    	event.preventDefault();
        var vector = new THREE.Vector3(( event.clientX / window.innerWidth ) * 2 - 1, -( event.clientY / window.innerHeight ) * 2 + 1, 0.5);
        projector.unprojectVector(vector, camera);
        var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
        var intersects = raycaster.intersectObjects(scene.children);
		if(intersects.length>0&&intersects[0].object==sphere){
			console.log("OK");
			$("#show").submit();
		}
    }

		</script>
	</body>
</html>

在这里插入图片描述

shejizuopin

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
基于Java+MySQL的三维模型素材交易平台设计

为了弥补上述弊端，本网站提在原有的模板网站上做出了技术和机制的创新，关键在于电子货物的商城模式，给用户以在线下载的方式获取网站上所需类型的模型，用户有一定的金币来兑换模型，3d视野，新式网站demo的下载，是一种视觉的享受，顺应时代的潮流，金币不够的情况下客户可以选择投稿自己的模板来或得高额的金币奖励，也可以给网站提出相应的建议来获取金币奖励，当然也可以使用网上银行进行充值。3.用户操作：用户注册，用户登录，忘记密码，修改姓名和性别资料，头像上传，下载文件，金币充值，提供建议，投稿作品。
复制链接

扫一扫