跳到主要內容

Texture packing algorithm

將小圖合併成大圖是最佳化的一種技巧,合併的時機可以是在程式編譯時期,透過工具或者是人工方式作到。或者也能在程式執行時期,由程式自動將小圖合併。這牽涉到怎麼將小圖合併成大圖的演算法,同時在繪圖時也需要支援怎麼從大圖裡抽取出原本是小圖的相關資訊等等。

這裡只對小圖合併大圖作簡介,提供一個簡單的演算法。

首先想到的是很直接的作法:

假設大圖是一張矩形,而小圖也都是矩形。一開始有張空白的大圖,當第一張小圖要擺進大圖時,先確認這張小圖是否可以放進這張空白的大圖裡,如果答案是可以的話,則將這張小圖擺進大圖的左上角位置。接著將空白大圖剩下來的空白區域切割成二塊空白矩形。切割的方法是,小圖以右及小圖以下作分界。


如圖所示,把1號小圖放進大圖後,剩下來的空白區域可以依小圖位置往右往下切成AB二塊較小的空白區塊。

接下來繼續同樣的步驟依序再擺入其它的小圖,如下圖所示。2號小圖可以擺的進去原來切出來的A號空白區塊,把2號小圖放進去後,剩下來的空白區域再以同樣的方法再切成AB二塊空白區塊。


依此累推,將各小圖一個一個塞進去,如果某張小圖找不到可以塞的進去的空白區塊,則再新開另一張空白大圖即可。

因為每次會把剩餘的空白區域切割成二塊,所以很自然的在實作上可以應用一個二元樹的結構,將每個節點分成左右二個子樹,底下列出主要的虛擬碼。

Node::Add(Image)
{
  if (NotImageAdded()) {
    if (IsImageFit(Image)) {
      AddImage(Image);
      Left = new Node(BoundLeft + ImageWidth, BoundTop, BoundRight, BoundTop + ImageHeight);
      Right = new Node(BoundLeft, BoundTop + ImageHeight, BoundRight, BoundBottom);
      return true;
    }
    return false;
  }
  if (Left->Add(Image)) {
    return true;
  }
  if (Right->Add(Image)) {
    return true;
  }
  return false;
}



如上圖,是依此演算法實作出來的一個測試程式的結果。隨機產生100個15x15~165x165之間的小圖,想辨法擺進一張1024x1024的大圖。
 
可以看到結果有22張小圖放不進去大圖裡,但從結果的顯示來看,這張大圖裡似乎有太多空白區域因為切割的方式,造成太多小碎片以致於浪費了,很難再塞入大一點的小圖。所以這個演算法,有很大的改進空間。

;

上一個演算法裡面,切割剩餘空白區域的方式很簡單的只根據加入的小圖的大小,切成右及下二塊,很容易造成小碎片。所以如果改善切割的方式,減少碎片的話,就可以塞入更多的小圖到大點裡去。

原來的方法一律都是以小圖的底的延長線當作是切割線,切出在小圖右及下的二塊區域。現在改善切割的方法,切割時同時還要考慮切的方向。改善方法以計算小圖的寬高及區塊的寬高差異量來決定切割線是水平或垂直方法。

改良後的演算法如下。

Node::Add(Image)
{
  if (NotImageAdded()) {
    if (IsImageFit(Image)) {
      AddImage(Image);
      if (BoundWidth - ImageWidth > BoundHeight - ImageHeight) {
        Left = new Node(BoundLeft + ImageWidth, BoundTop, BoundRight, BoundBottom);
        Right = new Node(BoundLeft, BoundTop + ImageHeight, BoundLeft + ImageWidth, BoundBottom);
      } else
{
        Left = new Node(BoundLeft + ImageWidth, BoundTop, BoundRight, BoundTop + ImageHeight);
        Right = new Node(BoundLeft, BoundTop + ImageHeight, BoundRight, BoundBottom);
      }
      return true;
    }
    return false;
  }
  if (Left->Add(Image)) {
    return true;
  }
  if (Right->Add(Image)) {
    return true;
  }
  return false;
}
只需一點點改善,就可以得到更好的結果,可以在同一張大圖裡塞入更多的小圖。如下圖所示,是改良後的一個測試結果。


留言

這個網誌中的熱門文章

KillSudoku 4顆星精彩數獨詳解 - 鍊技巧

這題數獨(sudoku)題目估計為4+顆星,有點難度。解題需要應用多種技巧,過程非常精彩有趣,是個好題。 底下使用 KillSudoku 作詳細圖解。 1,使用基本排除法則,可以簡單填入6個數字。到此為止,開始使用 候選數法 來解題。如下所示,為填入6個數字後的狀態圖。 2,如下圖,使用進階排除法,在第9列和第4行可以先排除幾個候選數。 3,如圖,在第2行有一個 Naked Subset (3,4),可以對3,4候選數作排除。附帶提一下,反過來看在同一行裡面也可以說有另一個Hidden Subset(2,5,8)存在。Naked Subset和Hidden Subset常是一體二面同時存在,只不過對我們來說,Naked Subset是相對比較容易看的出來。 排除第2行的3,4後,又可以對第2列以外的3作排除,如下圖。 4,接著,在第5行又發現了一個 Naked Subset (3,7,8)。 對第5行三個Subset以外的候選數3,7,8作排除後,又接著產生可以對第5行以外的3作排除。 5,這一題解到此為止,開始進入高潮。大部份能解到3顆星題目的人,猜想應該就此卡住。以下開始需要應用更高級的鍊技巧,才能夠繼續進行。 應用X-Chains鍊技巧,可以找到一條由4條強連結組成的鍊,可以排除候選數2。這裡的鍊指的是由2條以上的強連結組成,而所謂的強連結是指在同一行、或同一列或同一個Box裡,由唯二的候選數構成的連結。如上圖中的第9行中,只有二個2,這二個2構成一條強連結。為什麼說這是一條強連結?因為在這條連結的AB二個端點中,肯定會有一個2存在,要麼是A點要麼是B點。鍊技巧就是將多條強連結串連起來作候選數排除的技巧,而X-Chains是高級的鍊技巧裡面的基本技巧。 接上圖,這樣一來就又可以應用基本排除方法,填入3個數字,如下圖所示。 6,接下來就是本題最精彩的部份,以下需要連續找到3條鍊,才能繼續往下解。 7,找出3條鍊後,剩下來的部份就沒什麼特別的了,只需要應用基本法就能把所有剩餘數字填完。

生成小鎮1010 - 用 Ollama 製作一個在本機執行的生成式文字冒險小遊戲

  生成小鎮 1010 是一個利用在本機執行的大語言模型,動態的生成遊戲地圖及根據玩家互動生成故事劇情及任務內容的文字冒險小遊戲。 完成環境建置後,就可以到  Ollama 官網  下載模型,在本機開始測試遊戲。 處理器(CPU) 13th Gen Intel(R) Core(TM) i5-13500H 2.60 GHz 記憶體(RAM) 40.0 GB 顯示卡 Intel(R) Iris(R) Xe Graphics 128 M 系統 Windows 11 家用版 24H2 這是我的筆電規格。在我的筆電上跑  gemma3:4b-it-q4_K_M  模型,勉強可以玩。如果你有更強的硬體,就能夠利用更大的模型,得到更好的遊戲內容體驗。 gemma 是 Google 的開放的整合了視覺理解能力多模態大語言模型。4b: 是模型參數大小,表示 40 憶個參數。q4_K_M: 是一種減少模型大小和提高效率的技術,它涉及到將模型中的數值精度降低,並減少了對記憶體和計算資源的需求。 你也可以根據自己的需要或喜好,選擇下載不同模型。 [ GitHub ] 1. 準備工作 1.1 什麼是 Ollama Ollama 是一個可以在本機運行大型語言模型(LLM)如 LLaMA、Mistral、Gemma 等的開源工具。它的目的是讓開發者和使用者可以更輕鬆地在自己的電腦上執行和使用這些 AI 模型,而不需要依賴雲端服務。Ollama 的特點是: 本地運行模型  你可以直接在 Windows、macOS 或 Linux 上下載並運行語言模型,無需連網使用 API。 簡單的 CLI 工具  安裝後只需要輸入像 ollama run llama3 這樣的指令就可以開始對話。 支援多種模型  包含 Meta 的 LLaMA、Mistral、Gemma、Deepseek 等模型,也可以自訂模型。 開發整合容易  提供簡單的 API(RESTful),方便整合到你自己的應用程式、網頁或手機 App 中。 節省成本與提高隱私  不用連接 OpenAI、Anthropic 或其他雲端 LLM,降低使用成本,也不會洩漏資料。 1.2 安裝 Ollama 訪問  Ollama 官網 ,根據你的作業系...

單人撲克牌遊戲 - 蒙地卡羅

新增一個簡單的單人撲克牌遊戲: 蒙地卡羅 ,簡單介紹一下玩法。 下載 事先排列好5x5張牌。 每次移動一張可以配對的牌,並消除這對牌。在上下、左右及斜向相隣的二張牌,只要擁有同樣數字(不計花色),即可配對。 消除二張配對的牌後,剩餘的牌以往左往上的方式補滿空隙,接著在發新牌補滿後面的空格。 重覆步驟2~3,直到沒有牌可以配對及發完所有牌為止。 結果有二種。一個是勝利,成功的消除掉所有牌。另一個是Gameover沒有牌可以再作配對。