Spring Boot WebGL小程序

最新推荐文章于 2024-09-03 16:00:22 发布

殘遛

最新推荐文章于 2024-09-03 16:00:22 发布

阅读量487

点赞数 1

CC 4.0 BY-SA版权

分类专栏： SpringBoot

本文链接：https://blog.youkuaiyun.com/qq_28960147/article/details/80100856

该博客介绍了如何在Spring Boot应用中结合WebGL创建一个小程序。首先，通过添加JS文件glMatrix-0.9.5.js和一张图片到指定目录。接着，在JSP文件中编写相关代码，然后在控制器类添加处理逻辑。最后，运行程序，展示了一个动态变化的WebGL效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在Spring Boot应用连接数据库MySQL 基础上实现一个WebGL的小程序。

添加JS文件

在/webapp/static/js目录下添加glMatrix-0.9.5 .js文件。glMatrix-0.9.5 下载地址

添加图片

在/webapp/static/images目录下一个webgl.jpg图片，图片内容随意。

编写JSP文件

在/webapp/WEB-INF/jsp目录下新建一个名为webgl的jsp文件。代码如下：

<!DOCTYPE html >
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%> 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="/static/js/glMatrix-0.9.5.js"></script>
<script id="shader-vs" type="x-shader/x-vertex">
        attribute vec3 v3Position;
        uniform mat4 um4Rotate;
        varying vec2 v_texCoord;
       void main(void)
       {
             vec4 v4pos = um4Rotate * vec4(v3Position, 1.0);
                v_texCoord = vec2((v4pos.x+1.0)/2.0, 1.0-(v4pos.y+1.0)/2.0);
                gl_Position = v4pos;
            //v_texCoord = vec2((v3Position.x+1.0)/2.0, 1.0-(v3Position.y+1.0)/2.0);