本發(fā)明涉及互聯(lián)網(wǎng)技術領域，特別涉及一種獎池顯示容量控制方法及系統(tǒng)。

背景技術：

隨著互聯(lián)網(wǎng)技術的發(fā)展，越來越多的用戶每天都需要在互聯(lián)網(wǎng)上進行信息瀏覽、互動操作等，而網(wǎng)站網(wǎng)頁的設計就變得非常重要，友好的交互界面顯然可以帶給用戶良好的體驗。

網(wǎng)站伴隨著網(wǎng)絡的快速發(fā)展而快速興起，作為上網(wǎng)的主要依托，由于人們使用網(wǎng)絡的頻繁而變得非常的重要。由于企業(yè)需要通過網(wǎng)站呈現(xiàn)產(chǎn)品、服務、理念、文化，或向受眾提供某種功能服務。網(wǎng)頁通常包括如下的元素信息：

文本：文本是網(wǎng)頁上最重要的信息載體和交流工具，網(wǎng)頁中的主要信息一般都以文本形式為主。

圖像：圖像元素在網(wǎng)頁中具有提供信息并展示直觀形象的作用。

靜態(tài)圖像：在頁面中可能是光柵圖形或矢量圖形。通常為GIF，JPEG或PNG；或矢量格式，如SVG或Flash。

動畫圖像：通常動畫為GIF和SVG。

Flash動畫：動畫在網(wǎng)頁中的作用是有效地吸引訪問者更多的注意。

聲音：聲音是多媒體和視頻網(wǎng)頁重要的組成部分。

視頻：視頻文件的采用是網(wǎng)頁效果更加精彩且富有動感。

表格：表格是在網(wǎng)頁中用來控制面業(yè)信息的布局方式。

導航欄：導航欄在網(wǎng)頁中是一組超鏈接，其連接的目的端是網(wǎng)頁中重要的頁面。

交互式表單：表單在網(wǎng)頁中通常用來聯(lián)系數(shù)據(jù)庫并接受訪問用戶在瀏覽器端輸入的數(shù)據(jù)。利用服務器的數(shù)據(jù)庫為客戶端與服務器端提供更多的互動。

網(wǎng)頁設計必須首先明確設計站點的目的和用戶的需求，從而做出切實可行的設計方案。專業(yè)的網(wǎng)頁設計，需要經(jīng)歷以下幾個階段：

需要根據(jù)消費者的需求、市場的狀況、企業(yè)自身的情況等進行綜合分析，從而建立起營銷模型。

以業(yè)務目標為中心進行功能策劃，制作出欄目結構關系圖。

以滿足用戶體驗設計為目標，使用axure rp或同類軟件進行頁面策劃，制作出交互用例。

以頁面精美化設計為目標，使用PS、AI等軟件，調整，使用更合理的顏色、字體、圖片、樣式進行頁面設計美化。

根據(jù)用戶反饋，進行頁面設計調整，以達到最優(yōu)效果。

網(wǎng)頁設計作為一種視覺語言，特別講究編排和布局，雖然主頁的設計不等同于平面設計，但它們有許多相近之處。

版式設計通過文字圖形的空間組合，表達出和諧與美。

多頁面站點頁面的編排設計要求把頁面之間的有機聯(lián)系反映出來，特別要求處理好頁面之間和頁面內的秩序與內容的關系。為了達到最佳的視覺表現(xiàn)效果，反復推敲整體布局的合理性，使瀏覽者有一個流暢的視覺體驗。

色彩是藝術表現(xiàn)的要素之一。在網(wǎng)頁設計中，設計師根據(jù)和諧、均衡和重點突出的原則，將不同的色彩進行組合.搭配來構成美麗的頁面。根據(jù)色彩對人們心理的影響，合理地加以運用。如果企業(yè)有CIS(企業(yè)形象識別系統(tǒng))，應按照其中的VI進行色彩運用。

為了將豐富的意義和多樣的形式組織成統(tǒng)一的頁面結構，形式語言必須符合頁面的內容，體現(xiàn)內容的豐富含義。

靈活運用對比與調和、對稱與平衡、節(jié)奏與韻律以及留白等手段，通過空間、文字、圖形之間的相互關系建立整體的均衡狀態(tài)，產(chǎn)生和諧的美感。

網(wǎng)絡上的三維空間是一個假想空間，這種空間關系需借助動靜變化.圖像的比例關系等空間因素表現(xiàn)出來。在頁面中，圖片、文字位置前后疊壓，或頁面位置變化所產(chǎn)生的視覺效果都各不相同。通過圖片、文字前后疊壓所構成的空間層次不太適合網(wǎng)頁設計，根據(jù)現(xiàn)有瀏覽器的特點，網(wǎng)頁設計適合比較規(guī)范、簡明的頁面，盡管這種疊壓排列能產(chǎn)生強節(jié)奏的空間層次，視覺效果強烈。

網(wǎng)頁上常見的是頁面上、下、左、右、中位置所產(chǎn)生的空間關系，以及疏密的位置關系所產(chǎn)生的空間層次，這兩種位置關系使產(chǎn)生的空間層次富有彈性，同時也讓人產(chǎn)生輕松或緊迫的心理感受。

現(xiàn)有技術中，通過對于網(wǎng)頁設計以及提高互動性的方案越來越多，但是，各種設計方案良莠不齊，帶給用戶的體驗也差別很大。更多的是，其中對于用戶互動動畫的設計都比較少，不能滿足用戶虛擬現(xiàn)實界面的需求。在抽獎顯示的過程中，如何讓用戶更直觀的看到自身參與的進度，是一個亟需要解決的問題。

技術實現(xiàn)要素：

本發(fā)明提供一種獎池顯示容量控制方法及系統(tǒng)，用以解決現(xiàn)有技術中無法根據(jù)用戶需要進行獎池顯示容量控制的問題。

本發(fā)明提供一種獎池顯示容量控制方法，包括：

以獎池能顯示用戶信息的最大容量設定數(shù)組；一個用戶信息對應所述數(shù)組的一個數(shù)值；

新進入獎池的用戶信息順序分別為所述數(shù)組的各個數(shù)值賦值；

當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個數(shù)值賦值。

所述方法還包括：

動畫效果的實現(xiàn)獎池顯示用戶信息，新進入獎池的用戶信息通過投入的動畫效果投入獎池。

所述方法還包括：

數(shù)組長度的最大值即為獎池能顯示用戶信息的最大容量。

所述方法還包括：

當數(shù)組長度達到最大值時，新進入獎池的用戶信息重新從數(shù)組的第一個數(shù)值開始，依次對數(shù)組的各個數(shù)值進行賦值，并以此類推進行循環(huán)。

所述方法還包括：

獎池中僅顯示與所述數(shù)組對應的、所述數(shù)組的賦值結果對應的用戶信息的動畫效果。

所述方法還包括：

將不是所述數(shù)組的數(shù)值對應的用戶信息以動畫效果移除。

一種獎池顯示容量控制系統(tǒng)，包括：

數(shù)組設定單元，用于以獎池能顯示用戶信息的最大容量設定數(shù)組；一個用戶信息對應所述數(shù)組的一個數(shù)值；

數(shù)組賦值單元，用于新進入獎池的用戶信息順序分別為所述數(shù)組的各個數(shù)值賦值；

重新賦值單元，用于當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個數(shù)值賦值。

所述系統(tǒng)還包括動畫實現(xiàn)單元，用于動畫效果的實現(xiàn)獎池顯示用戶信息，新進入獎池的用戶信息通過投入的動畫效果投入獎池。

所述系統(tǒng)還包括循環(huán)控制單元，用于當數(shù)組長度達到最大值時，新進入獎池的用戶信息重新從數(shù)組的第一個數(shù)值開始，依次對數(shù)組的各個數(shù)值進行賦值，并以此類推進行循環(huán)。

所述系統(tǒng)還包括移除單元，用于將不是所述數(shù)組的數(shù)值對應的用戶信息以動畫效果移除。

本發(fā)明實施例中，通過以獎池能顯示用戶信息的最大容量設定數(shù)組；一個 用戶信息對應所述數(shù)組的一個值；新進入獎池的用戶信息順序分別為所述數(shù)組的各個值賦值；當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個值賦值。本發(fā)明實施例的方案，能夠在頁面上顯示一個設定的用戶信息投入獎池的動畫效果圖案，以設定的數(shù)組長度來確定獎池的大小，以重新為數(shù)組賦值的方式保證獎池的顯示容量，帶給用戶互動的樂趣，豐富用戶互動體驗，從而極大的提高了用戶體驗度。

本發(fā)明的其它特征和優(yōu)點將在隨后的說明書中闡述，并且，部分地從說明書中變得顯而易見，或者通過實施本發(fā)明而了解。本發(fā)明的目的和其他優(yōu)點可通過在所寫的說明書、權利要求書、以及附圖中所特別指出的結構來實現(xiàn)和獲得。

下面通過附圖和實施例，對本發(fā)明的技術方案做進一步的詳細描述。

附圖說明

附圖用來提供對本發(fā)明的進一步理解，并且構成說明書的一部分，與本發(fā)明的實施例一起用于解釋本發(fā)明，并不構成對本發(fā)明的限制。在附圖中：

圖1為本發(fā)明實施例1提供的一種獎池顯示容量控制方法原理流程圖；

圖2為本發(fā)明實施例2提供的一種獎池顯示容量控制系統(tǒng)結構示意圖。

具體實施方式

以下結合附圖對本發(fā)明的優(yōu)選實施例進行說明，應當理解，此處所描述的優(yōu)選實施例僅用于說明和解釋本發(fā)明，并不用于限定本發(fā)明。

如圖1所示，為本發(fā)明實施例1提供的一種獎池顯示容量控制方法原理流程圖，其中，

步驟11，以獎池能顯示用戶信息的最大容量設定數(shù)組；一個用戶信息對應所述數(shù)組的一個值。

本實施例中，首先需要設定一個動畫效果的獎池，用戶可以直觀的在網(wǎng)頁 上看到該獎池。當用戶參與互動，例如進行投注或者抽獎的時候，用戶的用戶信息就以動畫效果的形式投入到獎池中，使得用戶可以直觀的看到自身的用戶信息進入獎池的過程，提高用戶參與的效果。

這里的用戶信息可以是系統(tǒng)設定的任何用戶信息，只要能夠區(qū)分用戶并且足夠直觀即可。例如，通常可以采用用戶頭像或者用戶名稱等信息。

當用戶參與互動后，用戶信息即以動畫投入的效果進入獎池中。例如，可以將用戶信息顯示為圓球形狀，然后，參與互動的用戶就可以看到代表自身用戶信息的圓球投入獎池，并可以在獎池中進行碰撞、翻滾的動畫效果。

網(wǎng)頁繪圖功能，通常是網(wǎng)頁編輯軟件或平臺提供的繪圖工具，當然也可以是其它的繪圖工具進行繪圖，之后嵌入網(wǎng)頁。這里的網(wǎng)頁也不是限定于網(wǎng)站頁面，可以是任何的面向用戶的頁面，例如微信公眾號后臺頁面、APP中用戶頁面等。

設定形狀的圖案，可以是簡單的幾何圖形，也可以是設計好的卡通形象，目的在于吸引用戶的注意進行互動操作。本實施例對圖案的具體設計不做限定。

最常見的網(wǎng)頁繪圖工具是HTML5提供的canvas功能。

Canvas對象表示一個HTML畫布元素-<canvas>。它沒有自己的行為，但是定義了一個API支持腳本化客戶端繪圖操作。

可以直接在該對象上指定寬度和高度，但是，其大多數(shù)功能都可以通過CanvasRenderingContext2D對象獲得。這是通過Canvas對象的getContext()方法并且把直接量字符串"2d"作為唯一的參數(shù)傳遞給它而獲得的。

<canvas>標記在Safari 1.3中引入，在制作此參考頁時，它在Firefox 1.5和Opera 9中也得到了支持。在IE中，<canvas>標記及其API可以使用位于excanvas點sourceforge點net的ExplorerCanvas開源項目來模擬。

大多數(shù)Canvas繪圖API都沒有定義在<canvas>元素本身上，而是定義在通過畫布的getContext()方法獲得的一個“繪圖環(huán)境”對象上。

Canvas API也使用了路徑的表示法。但是，路徑由一系列的方法調用來定義，而不是描述為字母和數(shù)字的字符串，比如調用beginPath()和arc()方法。

一旦定義了路徑，其他的方法，如fill()，都是對此路徑操作。繪圖環(huán)境的各種屬性，比如fillStyle，說明了這些操作如何使用。

HTML5 canvas是一個原生HTML繪圖簿，用于JavaScript代碼，不使用第三方工具?？缢衱eb瀏覽器的完整HTML5支持還沒有完成，但在新興的支持中，canvas已經(jīng)可以在幾乎所有現(xiàn)代瀏覽器上良好運行了，但Windows Internet Explorer除外。幸運的是，一個解決方案已經(jīng)出現(xiàn)，將Internet Explorer也包含進來。

本質上，canvas元素是一個白板，直到您在它上面“繪制”一些可視內容。與擁有各種畫筆的藝術家不同，您使用不同的方法在canvas上作畫。您甚至可以在canvas上創(chuàng)建并操作動畫，這不是使用畫筆和油彩所能夠實現(xiàn)的。

新的HTML canvas元素，從簡單地包含一個canvas元素到高級JavaScript交互(動畫的關鍵)逐步進行演示。學習如何在一個web頁面上顯示canvas。本文針對web設計師和開發(fā)人員，盡管JavaScript知識不是必須的，但理解該語言的運行方式將有所幫助。但是，HTML知識是關鍵所在，尤其是如何創(chuàng)建一個基本web頁面。

Canvas對象的屬性主要包括如下幾個：

height屬性。

畫布的高度。和一幅圖像一樣，這個屬性可以指定為一個整數(shù)像素值或者是窗口高度的百分比。當這個值改變的時候，在該畫布上已經(jīng)完成的任何繪圖都會擦除掉。默認值是300。

width屬性。

畫布的寬度。和一幅圖像一樣，這個屬性可以指定為一個整數(shù)像素值或者是窗口寬度的百分比。當這個值改變的時候，在該畫布上已經(jīng)完成的任何繪圖都會擦除掉。默認值是300。

<canvas>標記和SVG以及VML之間的一個重要的不同是，<canvas>有一個基于JavaScript的繪圖API，而SVG和VML使用一個XML文檔來描述繪圖。

這兩種方式在功能上是等同的，任何一種都可以用另一種來模擬。從表面上看，它們很不相同，可是，每一種都有強項和弱點。例如，SVG繪圖很容易編輯，只要從其描述中移除元素就行。

要從同一圖形的一個<canvas>標記中移除元素，往往需要擦掉繪圖重新繪制它。

本實施例中，利用canvas功能繪制相應的圖案，然后將該圖案顯示在頁面上。用戶瀏覽網(wǎng)頁的時候可以直觀的看到該圖案。

實際上，根據(jù)網(wǎng)頁繪圖功能，需要繪制一系列設定形狀的圖案；所述一系列設定形狀的圖案中包括各種設定形狀圖案的變形圖案。這是因為要實現(xiàn)動畫的效果，就需要多個圖案進行切換，從而展示給用戶動畫效果。這需要在設計圖案的時候就設計一系列的圖案，包括所有圖案的各種變形效果，從而支持后續(xù)的用戶操作。

所述變形圖案模擬真實的圖案操作而產(chǎn)生的變形繪制。這里，對于一系列的圖案不是隨便設定的，是根據(jù)可能出現(xiàn)的操作而設定的。例如，可以將圖案拉伸、壓縮、扭曲等多種操作，從而需要設計原始圖案在經(jīng)過這些操作后的圖案。

本實施例中，可以采用網(wǎng)頁繪圖工具，設置網(wǎng)頁動畫效果，或者，根據(jù)JS腳本編輯網(wǎng)頁動畫特效。本實施例對動畫效果的實現(xiàn)不做限定。

本實施例中，根據(jù)動畫效果中獎池能夠顯示的用戶信息的最大容量，設定一個數(shù)組。這個數(shù)組的長度就是獎池能夠顯示的用戶信息的最大容量的值。數(shù)組是由多個數(shù)值組成，一個用戶信息對應一個數(shù)值。

步驟12，新進入獎池的用戶信息順序分別為所述數(shù)組的各個數(shù)值賦值。

新進入獎池的用戶信息，就是那些需要投入獎池的用戶的信息。例如，當 用戶參與投注或者抽獎時候，則用戶選擇參與投注或者抽獎的時候，用戶信息需要進入獎池。也就是需要以動畫效果投入獎池。這樣，新進入獎池的用戶就需要為數(shù)組中各個數(shù)組賦值。

通常，對數(shù)組賦值的時候，按照現(xiàn)有順序，每個新進入獎池的用戶信息都按照順序逐一對數(shù)組中的數(shù)值賦值。例如，第一個用戶信息對數(shù)組的第一個數(shù)值賦值，第二個用戶信息對第二個數(shù)值賦值，以此類推。

當新的用戶需要進入獎池的時候，可以先看一下數(shù)組中接下來該為哪個數(shù)值賦值，然后，該新進入獎池的用戶信息就對該數(shù)值賦值。

當然，賦值并不一定是用戶信息直接賦值，而是可以用唯一識別用戶信息的數(shù)值來進行賦值。

步驟13，當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個數(shù)值賦值。

當數(shù)組長度達到最大值時，新進入獎池的用戶信息重新從數(shù)組的第一個數(shù)值開始，依次對數(shù)組的各個數(shù)值進行賦值，并以此類推進行循環(huán)。

獎池中僅顯示與所述數(shù)組對應的、所述數(shù)組的賦值結果對應的用戶信息的動畫效果。將不是所述數(shù)組的數(shù)值對應的用戶信息以動畫效果移除。

當數(shù)組長度最大的時候，說明獎池中已經(jīng)到達顯示的上限，新進入的用戶信息已經(jīng)無法再進行顯示。此時，需要重新對數(shù)組賦值。同樣是按照順序，每個用戶信息對應一個數(shù)值。

這樣，無論有多少用戶信息需要投入獎池，但是獎池的最大容量與數(shù)組的長度是一致的。通過所有用戶信息重復為數(shù)組賦值的過程，保證了在獎池中始終僅顯示與數(shù)組長度相同數(shù)量的用戶信息。

本發(fā)明實施例中，通過以獎池能顯示用戶信息的最大容量設定數(shù)組；一個用戶信息對應所述數(shù)組的一個值；新進入獎池的用戶信息順序分別為所述數(shù)組的各個值賦值；當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個值賦值。本發(fā)明實施例的方案，能夠在頁面上顯示一個設 定的用戶信息投入獎池的動畫效果圖案，以設定的數(shù)組長度來確定獎池的大小，以重新為數(shù)組賦值的方式保證獎池的顯示容量，帶給用戶互動的樂趣，豐富用戶互動體驗，從而極大的提高了用戶體驗度。

如圖2所示，為本發(fā)明實施例2提供的一種獎池顯示容量控制系統(tǒng)結構示意圖，其中，

數(shù)組設定單元21，用于以獎池能顯示用戶信息的最大容量設定數(shù)組；一個用戶信息對應所述數(shù)組的一個數(shù)值；

數(shù)組賦值單元22，用于新進入獎池的用戶信息順序分別為所述數(shù)組的各個數(shù)值賦值；

重新賦值單元23，用于當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個數(shù)值賦值。

進一步的，上述系統(tǒng)還包括動畫實現(xiàn)單元24，用于動畫效果的實現(xiàn)獎池顯示用戶信息，新進入獎池的用戶信息通過投入的動畫效果投入獎池。

進一步的，上述系統(tǒng)還包括循環(huán)控制單元25，用于當數(shù)組長度達到最大值時，新進入獎池的用戶信息重新從數(shù)組的第一個數(shù)值開始，依次對數(shù)組的各個數(shù)值進行賦值，并以此類推進行循環(huán)。

進一步的，上述系統(tǒng)還包括移除單元26，用于將不是所述數(shù)組的數(shù)值對應的用戶信息以動畫效果移除。

綜上所述，本發(fā)明實施例中，通過以獎池能顯示用戶信息的最大容量設定數(shù)組；一個用戶信息對應所述數(shù)組的一個值；新進入獎池的用戶信息順序分別為所述數(shù)組的各個值賦值；當數(shù)組長度達到設定的最大值，則新進入獎池的用戶信息重新對所述數(shù)組的第一個值賦值。本發(fā)明實施例的方案，能夠在頁面上顯示一個設定的用戶信息投入獎池的動畫效果圖案，以設定的數(shù)組長度來確定獎池的大小，以重新為數(shù)組賦值的方式保證獎池的顯示容量，帶給用戶互動的 樂趣，豐富用戶互動體驗，從而極大的提高了用戶體驗度。

本領域內的技術人員應明白，本發(fā)明的實施例可提供為方法、系統(tǒng)、或計算機程序產(chǎn)品。因此，本發(fā)明可采用完全硬件實施例、完全軟件實施例、或結合軟件和硬件方面的實施例的形式。而且，本發(fā)明可采用在一個或多個其中包含有計算機可用程序代碼的計算機可用存儲介質(包括但不限于磁盤存儲器和光學存儲器等)上實施的計算機程序產(chǎn)品的形式。

本發(fā)明是參照根據(jù)本發(fā)明實施例的方法、設備(系統(tǒng))、和計算機程序產(chǎn)品的流程圖和/或方框圖來描述的。應理解可由計算機程序指令實現(xiàn)流程圖和/或方框圖中的每一流程和/或方框、以及流程圖和/或方框圖中的流程和/或方框的結合。可提供這些計算機程序指令到通用計算機、專用計算機、嵌入式處理機或其他可編程數(shù)據(jù)處理設備的處理器以產(chǎn)生一個機器，使得通過計算機或其他可編程數(shù)據(jù)處理設備的處理器執(zhí)行的指令產(chǎn)生用于實現(xiàn)在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能的裝置。

這些計算機程序指令也可存儲在能引導計算機或其他可編程數(shù)據(jù)處理設備以特定方式工作的計算機可讀存儲器中，使得存儲在該計算機可讀存儲器中的指令產(chǎn)生包括指令裝置的制造品，該指令裝置實現(xiàn)在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能。

這些計算機程序指令也可裝載到計算機或其他可編程數(shù)據(jù)處理設備上，使得在計算機或其他可編程設備上執(zhí)行一系列操作步驟以產(chǎn)生計算機實現(xiàn)的處理，從而在計算機或其他可編程設備上執(zhí)行的指令提供用于實現(xiàn)在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能的步驟。

顯然，本領域的技術人員可以對本發(fā)明進行各種改動和變型而不脫離本發(fā)明的精神和范圍。這樣，倘若本發(fā)明的這些修改和變型屬于本發(fā)明權利要求及其等同技術的范圍之內，則本發(fā)明也意圖包含這些改動和變型在內。