使用DeepSeek+藍耘快速設計網頁簡易版《我的世界》小游戲

前言:如今,借助先進的人工智能模型與便捷的云平臺,即便是新手開發者,也能開啟創意游戲的設計之旅。DeepSeek 作為前沿的人工智能模型,具備強大的功能與潛力,而藍耘智算云平臺則為其提供了穩定高效的運行環境。《我的世界》作為一款風靡全球的沙盒游戲,以其高度自由的玩法和無限的創意空間深受玩家喜愛。本次,我們將探索如何巧妙運用 DeepSeek 結合藍耘智算云平臺,快速設計出網頁簡易版的《我的世界》小游戲,讓大家能直觀感受到現代技術融合帶來的便捷與樂趣,即使沒有深厚編程基礎,也能在短時間內實現一個具備基礎功能的游戲雛形。

使用DeepSeek+藍耘快速設計網頁簡易版《我的世界》小游戲

目錄

一、在藍耘智算云平臺使用DeepSeek-R1_32B模型

二、快速設計網頁簡易版《我的世界》小游戲


一、在藍耘智算云平臺使用DeepSeek-R1_32B模型

登錄藍耘元生代智算云平臺,如下鏈接?

https://cloud.lanyun.net/#/registerPage?promoterCode=11f606c51ehttps://cloud.lanyun.net/#/registerPage?promoterCode=11f606c51e登錄進來后,點擊首頁上方的“應用市場”

在deepseek-r1_32b欄,點擊“部署”?

在彈出的窗口中可以選擇GPU型號等,然后點擊“立即購買”?

等待工作空間的創建?

創建完成后,點擊“快速啟動應用”?

?會提示輸入郵箱和密碼

返回應用市場界面,可以看到賬號密碼分別為:

【默認賬號:lanyunuser@lanyun.net 密碼:lanyunuser】?

?輸入后,點擊登錄

即可使用DeepSeek-R1_32B模型

二、快速設計網頁簡易版《我的世界》小游戲

接下里進行使用deepseek快速設計網頁簡易版的《我的世界》小游戲

輸入一個簡單的指令即可

設計一個網頁版的我的世界2D,html

如下所示,即可完成設計?

可以將代碼復制出來,粘貼到新建一個txt文件里

修改txt文件的后綴為html

效果如下所示

完整代碼如下

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Minecraft 2D</title><style>canvas {border: 1px solid black;}body {display: flex;justify-content: center;align-items: center;height: 100vh;margin: 0;background-color: #f0f0f0;}.controls {position: absolute;top: 20px;left: 20px;background-color: white;padding: 10px;border-radius: 5px;box-shadow: 0 0 5px rgba(0,0,0,0.3);}button {margin: 5px;padding: 5px 10px;cursor: pointer;}</style>
</head>
<body><div class="controls"><button onclick="generateNewMap()">新地圖</button><button onclick="setCurrentBlock('stone')">石頭</button><button onclick="setCurrentBlock('dirt')">泥土</button><button onclick="setCurrentBlock('air')">空氣</button></div><canvas id="gameCanvas"></canvas><script>const canvas = document.getElementById('gameCanvas');const ctx = canvas.getContext('2d');// 設置畫布大小const worldSize = 15; // 格子數量const blockSize = 20; // 每個格子的像素大小canvas.width = worldSize * blockSize + 2;canvas.height = worldSize * blockSize + 2;// 方塊類型const blockTypes = {air: { color: '#ffffff' },stone: { color: '#808080' },dirt: { color: '#663d17' }};// 當前方塊類型let currentBlock = 'stone';// 初始化地形數據let terrain = Array(worldSize).fill().map(() => Array(worldSize).fill().map(() => ({type: 'air'})));// 鼠標狀態let mouseDown = false;let lastX, lastY;// 繪制函數function draw() {ctx.clearRect(0, 0, canvas.width, canvas.height);for (let y = 0; y < worldSize; y++) {for (let x = 0; x < worldSize; x++) {const block = terrain[y][x];ctx.fillStyle = blockTypes[block.type].color;ctx.fillRect(x * blockSize + 1, y * blockSize + 1, blockSize - 2, blockSize - 2);}}// 繪制鼠標光標if (mouseDown) {ctx.strokeStyle = '#ff0000';ctx.strokeRect(lastX - 5, lastY - 5, 10, 10);}}// 設置當前方塊類型function setCurrentBlock(type) {currentBlock = type;}// 處理點擊事件function handleClick(x, y) {const gridX = Math.floor((x - 1) / blockSize);const gridY = Math.floor((y - 1) / blockSize);if (gridX >= 0 && gridX < worldSize && gridY >= 0 && gridY < worldSize) {// 放置方塊if (currentBlock !== 'air') {terrain[gridY][gridX].type = currentBlock;} else {// 破壞方塊terrain[gridY][gridX].type = 'air';}draw();}}// 生成新地圖function generateNewMap() {for (let y = 0; y < worldSize; y++) {for (let x = 0; x < worldSize; x++) {terrain[y][x].type = 'air';if (y > worldSize - 5) {if (y === worldSize - 1 || y === worldSize - 2) {terrain[y][x].type = 'stone';} else {terrain[y][x].type = 'dirt';}}}}draw();}// 鼠標事件處理canvas.addEventListener('mousedown', (e) => {mouseDown = true;lastX = e.clientX - canvas.offsetLeft;lastY = e.clientY - canvas.offsetTop;handleClick(lastX, lastY);});canvas.addEventListener('mousemove', (e) => {if (mouseDown) {lastX = e.clientX - canvas.offsetLeft;lastY = e.clientY - canvas.offsetTop;handleClick(lastX, lastY);}});canvas.addEventListener('mouseup', () => {mouseDown = false;});// 初始化generateNewMap();</script>
</body>
</html>

這個設計包含以下功能:

  • 基本的2D地形編輯器界面
  • 支持放置和破壞方塊(石頭、泥土)
  • 可以生成新的隨機地圖
  • 鼠標拖拽繪制
  • 簡單的控制按鈕

主要特點:

  • 使用HTML Canvas進行渲染
  • 支持三種基本方塊類型:空氣、石頭、泥土
  • 鼠標交互操作
  • 控制面板提供基本功能
  • 自動生成初始地形

你可以通過以下方式使用這個設計:

  • 左鍵點擊并拖拽以放置當前選擇的方塊
  • 右鍵點擊可以破壞方塊(設置為空氣)
  • 使用控制按鈕切換方塊類型
  • 點擊"新地圖"按鈕可以生成新的隨機地形

不使用時,記得返回首頁,點擊應用實例,將剛剛創建的工作空間關機?

點擊關機

總結

通過本次實踐,我們成功地利用藍耘智算云平臺部署 DeepSeek-R1_32B 模型,并借助其完成了網頁簡易版《我的世界》小游戲的設計。從在藍耘元生代智算云平臺進行簡單操作部署模型,到輸入指令快速生成小游戲代碼,整個流程展現了現代技術結合下的高效性。該簡易版小游戲具備基本的 2D 地形編輯器界面,支持放置和破壞方塊,擁有生成新隨機地圖、鼠標拖拽繪制等實用功能。其以 HTML Canvas 進行渲染,通過鼠標交互與控制面板實現操作。然而,它也存在一定局限性,如相較于完整版《我的世界》,功能仍顯單一,畫面不夠精美。可以在現有基礎上,利用更復雜的算法和設計,添加更多方塊類型、優化地形生成機制,融入更多游戲元素,不斷完善這款小游戲。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/73110.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/73110.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/73110.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

固定表頭、首列 —— uniapp、vue 項目

項目實地&#xff1a;也可以在 【微信小程序】搜索體驗&#xff1a;xny.handbook 另一個體驗項目&#xff1a;官網 一、效果展示 二、代碼展示 &#xff08;1&#xff09;html 部分 <view class"table"><view class"tr"><view class&quo…

【學習筆記】Numpy和Tensor的區別

1. NumPy 和 PyTorch Tensor 的格式對比 NumPy 使用的是 numpy.ndarray&#xff0c;而 PyTorch 使用的是 torch.Tensor&#xff0c;兩者的格式在數據存儲和計算方式上有所不同。 NumPy (numpy.ndarray) import numpy as np array np.array([[1.0, 2.0, 3.0], [4.0, 5.0, 6.…

每天一道算法題【藍橋杯】【在排序數組中查找元素的第一個位置和最后一個位置】

思路 本題為查找左邊界和右邊界的標準模型 查找左邊界 int left 0, right nums.size() - 1, mid 0; //查找左邊界 while (left < right) { mid left (right - left) / 2; if (nums[mid] < target) left mid 1; else right mid; } 查找右邊界 int left 0, r…

Python數據分析之機器學習基礎

Python 數據分析重點知識點 本系列不同其他的知識點講解&#xff0c;力求通過例子讓新同學學習用法&#xff0c;幫助老同學快速回憶知識點 可視化系列&#xff1a; Python基礎數據分析工具數據處理與分析數據可視化機器學習基礎 五、機器學習基礎 了解機器學習概念、分類及…

我與DeepSeek讀《大型網站技術架構》(10)- 維基百科的高性能架構設計分析

目錄 網站整體架構核心組件請求處理流程圖關鍵環節說明 性能優化策略前端優化&#xff1a;攔截 80% 以上請求服務端優化&#xff1a;高性能 PHP 集群后端優化&#xff1a;存儲與緩存極致設計Memcached 持久化連接 性能優化策略對比表 網站整體架構 核心組件 Wikipedia 的架構…

Excel多級聯動下拉菜單設置

1.問題描述 現有數據表如下圖所示&#xff1a; 該表中包括省、市、縣三級目錄。 現要將其整理成數據表模板&#xff0c;如下圖所示&#xff1a; 要求制作成下拉菜單的形式&#xff0c;且每一級目錄的下拉菜單列表要根據上一級目錄的內容來確定。 如上圖所示&#xff0c;只有…

智駕技術全鏈條解析

智駕技術全鏈條解析&#xff08;2025年最新版&#xff09; 智駕技術涵蓋從環境感知到車輛控制的完整閉環&#xff0c;涉及硬件、算法、數據與系統集成等多個領域。以下結合行業最新進展&#xff08;截至2025年3月&#xff09;進行深度拆解&#xff1a; 一、感知技術&#xff1…

SpringMVC執行的流程

SpringMVC 基于 MVC 架構模式&#xff0c;核心流程時前端控制室 DispathcherServlet 統一調度&#xff0c;通過組件協作完成 http 的請求與響應。 對于 dispatchServlet 作為前端請求的控制器&#xff0c;全局的訪問點&#xff0c;首先將根據 URL 調用 HandlerMapping 獲取 Han…

Linux學習(十五)(故障排除(ICMP,Ping,Traceroute,網絡統計,數據包分析))

故障排除是任何 Linux 用戶或管理員的基本技能。這涉及識別和解決 Linux 系統中的問題。這些問題的范圍包括常見的系統錯誤、硬件或軟件問題、網絡連接問題以及系統資源的管理。Linux 中的故障排除過程通常涉及使用命令行工具、檢查系統和應用程序日志文件、了解系統進程&#…

存儲過程和自定義函數在銀行信貸業務中的應用(oracle)

數據校驗和清洗 例如&#xff0c;檢查客戶的年齡是否在合理范圍內&#xff0c;貸款金額是否符合規定的上下限等。 對于不符合規則的數據&#xff0c;可以進行清洗和修正。比如&#xff0c;將空值替換為默認值&#xff0c;或者對錯誤的數據進行糾正。 CREATE OR REPLACE PROC…

指令微調 (Instruction Tuning) 與 Prompt 工程

引言 預訓練語言模型 (PLMs) 在通用語言能力方面展現出強大的潛力。然而&#xff0c;如何有效地引導 PLMs 遵循人類指令&#xff0c; 并輸出符合人類意圖的響應&#xff0c; 成為釋放 PLMs 價值的關鍵挑戰。 指令微調 (Instruction Tuning) 和 Prompt 工程 (Prompt Engineerin…

【c++】反轉字符串

說明 將string類型的字符串本身反轉 用到庫&#xff1a;algorithm 示例代碼 #include <iostream> #include <string> #include <algorithm> using namespace std;int main() {string str "123";reverse(str.begin(), str.end());cout <<…

正則表達式(復習)

文章目錄 一、[]: 一個字符集合二、{}: 重復次數三、特殊符號四、(): 分組五、python代碼示例六、注意 正則表達式(regular expression)描述了一種字符串匹配的模式&#xff08;pattern&#xff09;&#xff0c;可以用來檢查一個串是否含有某種子串、將匹配的子串替換或者從某個…

ARMV8的64位指令

一、介紹 ARMv8 體系結構最大的改變是增加了一個新的 64 位的指令集&#xff0c;這是早前 ARM 指令集 的有益補充和增強。它可以處理 64 位寬的寄存器和數據并且使用 64 位的指針來訪問內存。這 個新的指令集稱為 A64 指令集&#xff0c;運行在 AArch64 狀態。 ARMv8 兼容舊的…

線性代數之矩陣特征值與特征向量的數值求解方法

文章目錄 前言1. 冪迭代法&#xff08;Power Iteration&#xff09;冪法與反冪法求解矩陣特征值冪法求最大特征值編程實現補充說明 2. 逆冪迭代法&#xff08;Inverse Iteration&#xff09;移位反冪法 3. QR 算法&#xff08;QR Algorithm&#xff09;——稠密矩陣理論推導編程…

VScode:運行程序停止后,頻繁出現終端進程被終止

VScode里面powershell被迫關閉 bug場景排查原因解決辦法 bug場景 系統&#xff1a;Windows IDE&#xff1a;Visual Studio Code 停止運行程序后&#xff0c;按向上箭頭想要執行上一步命令&#xff0c;忽然終端頁面強行關閉&#xff0c;并報錯如下&#xff1a; 終端進程 &quo…

[MERN] 使用 socket.io 實現即時通信功能

[MERN] 使用 socket.io 實現即時通信功能 效果實現如下&#xff1a; MERN-socket.io 實現即時聊天 Github 項目地址:https://github.com/GoldenaArcher/messenger-mern 項目使用了 MERN(MongoDB, Express, React, Node.js) socket.io 實現即時通信功能&#xff0c;并且使用了…

【菜鳥飛】Conda安裝部署與vscode的結合使用

介紹 Conda 是一個跨平臺的開源工具&#xff0c;用于管理軟件包和環境。最初由 Anaconda 公司開發&#xff0c;它的設計目標是支持數據科學和機器學習領域&#xff0c;但其功能不僅局限于此。 以下是 Conda 的核心特點&#xff1a; 包管理&#xff1a;安裝、更新、卸載各種庫…

《Android應用性能優化全解析:常見問題與解決方案》

目錄 一、UI卡頓/掉幀 二、內存泄漏&#xff08;Memory Leak&#xff09; 三、ANR&#xff08;Application Not Responding&#xff09; 四、列表滑動卡頓&#xff08;RecyclerView/ListView&#xff09; 五、冷啟動耗時過長 六、內存抖動&#xff08;Memory Churn&#x…

【MySQL是怎么運行的】0、名詞解釋

聚簇索引&#xff1a;聚簇索引和數據在一起&#xff0c;又名主鍵索引&#xff0c;是主鍵id構建的一顆B樹&#xff0c;非葉節點是主鍵id&#xff0c;葉子節點是真實數據。其他索引統稱二級索引&#xff0c;也稱為非聚簇索引。覆蓋索引&#xff1a;查找的數據就在索引樹上&#x…