PHP開發學堂:用PHP建立動態圖形

來源:互聯網
上載者:User
關鍵字 PHP開發學堂:用PHP建立動態圖形

  PHP有一個令人驚訝的能力——你可以利用它的伺服器端指令碼建立動態圖形。這項功能的基礎是GD庫,它是由Thomas Boutell設計的ANSI C庫,這個庫支援除.GIF檔案之外的絕大多數常見圖形檔案格式(不過該庫的設計者確保當LZW專利在2004年7月7日到期後就立即添加.GIF支援)。
  
  PHP4.3以及它的更高版本整合了GD庫。如果你使用的是老版本的PHP,你需要手工安裝圖形支援。這兒有許多與之有關的資訊。
  
   折線圖
  為了示範如何用PHP建立動態圖形,我們建立一些自訂圖形。第一個例子是畫在網格上的折線圖,A所示。
  
   圖A
    
  我們把這個頁面叫著grid.php(相關附件:清單A)。為了調用Web頁動態產生的圖形,你只需要訪問這個PHP頁,它將該圖形傳遞到瀏覽器。IMG元素可以很好的完成這項工作。下面是實現這個功能的例子代碼:"
  
  
  
  現在,我們開始編寫用於建立圖形的代碼。下面是grid.php中原始碼片斷:
    //添加圖形的值
  $graphValues=array(0,80,23,11,190,245,50,80,111,240,55);
  
  首先,我們定義圖形的值。在這個例子中,圖形值直接寫到代碼中的一個數組中,不過你可以很容易改寫代碼,讓代碼從xml(標準化越來越近了)檔案、表格或者資料庫中擷取這些值。這些值的範圍從0到250(以象素為單位的圖形尺寸)。這些值將決定每個網格上線段的初始象素位置。如果你想使用數值0和100(用百分比表示),你只需把這些值乘以2.5來決定網格上的象素位置。
  
  然後,我們發送一個PNG頭並定義映像的高度和寬度:
  // Define .PNG image
  header("Content-type: image/png");
  $imgWidth=250;
  $imgHeight=250;
  我們發送一個圖形頭來“欺騙”瀏覽器,使它認為我們的PHP頁面是一幅真正的映像,這樣它才可以正確顯示在螢幕上。伺服器將以位元據流的形式把程式產生的資訊發送到瀏覽器。
  
  PNG(Portable Network Graphic,攜帶型網路圖形)標準是一種無損的圖形格式,它由於GIF的 LZW演算法專利這一法律問題而在1995年提出來的。
  
  現在,我們例化繪圖物件並定義我們在圖形中用到的顏色:
  
  //建立映像、定義顏色
  $image=imagecreate($imgWidth, $imgHeight);
  $colorWhite=imagecolorallocate($image, 255, 255, 255);
  $colorGrey=imagecolorallocate($image, 192, 192, 192);
  $colorBlue=imagecolorallocate($image, 0, 0, 255);
  
  我們設定白色背景,灰色畫框以及藍色折線。你可以通過建立新變數並賦不同的RGB值來輕鬆的修改或者添加顏色。
  
  我們可以用imageline函數來建立灰色畫框,每次調用這個函數就畫一條線:
  
  //建立映像周圍的框
  imageline($image, 0, 0, 0, 250, $colorGrey);
  imageline($image, 0, 0, 250, 0, $colorGrey);
  imageline($image, 249, 0, 249, 249, $colorGrey);
  imageline($image, 0, 249, 249, 249, $colorGrey);
  
  這裡用到了二維的x/y象素座標。Imageline函數中的每一對值指定了映像的起點和終點。
  
  為了實現網格線,我們在x座標軸和y座標軸上每隔25個象素畫一條灰線:
  
  //建立網格
  for ($i=1; $i<11; $i++){
  imageline($image, $i*25, 0, $i*25, 250, $colorGrey);
  imageline($image, 0, $i*25, 250, $i*25, $colorGrey);
  }
  位置(0,0)表示網格的左上方,位置(250,250)表示右下角。每個座標軸等分為10格,每格寬度是25個象素,即250個象素(圖形的尺寸)。
  
  為了建立折線圖,我們只需迴圈的取出數組中的座標值,按座標畫出每條線段的起點和終點:
  
  //建立折線圖
  for ($i=0; $i<10; $i++){
  imageline($image, $i*25, (250-$graphValues[$i]), ($i+1)*25, (250-$graphValues[$i+1]), $colorBlue);

1 2 下一頁
  • 相關文章

    聯繫我們

    該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

    如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.