用pChart生成雷達圖圖片


需求 :由於工作需要,需要在一張背景圖上添加這一張雷達圖,之后圖片可以在微信中長按保存。所以說我必須生成一張帶有雷達圖的圖片
第一反應是用百度echars雷達圖做動態顯示,之后截圖。考慮到工作量和效率,放棄。
改為pchart 直接生成雷達圖圖片 然后用imagick拓展貼到背景圖上面。由於imagick攻略比較詳細,這里不做贅述,而pchart中文文檔則比較匱乏,所以簡略介紹下。


第一步 在pchart官網下載類庫 http://www.pchart.net/download  建議在本地環境調試,因為你需要大量的操作去調試點線的顏色外形。

下一個zip的包就可以了 一般的解壓工具就可以解壓縮 重點關注三個文件夾 class example fonts

1 . class目錄為生成雷達圖類庫 包含數據處理類 畫圖類等 因為需求對顏色樣式要求很高 所以大概做了一些了解。如果只是簡單要一張雷達圖可不做了解。
pData.class.php=>處理數據 轉化為點線圖形 色值需要設置(必須)
pDraw.class.php=>畫圖類(必須)
pImage.class.php=>圖片處理類(必須)
pRadar.class.php=>雷達圖類(必須)
其他為非必須引入 當然如果嫌麻煩可以不用管他們是干什么用的 全扔項目里就好
2. fonts目錄為字體資源目錄
3. example 示例目錄

工具包內有index文件,在php環境下打開文件夾,會自動生成圖形界面這還是比較人性化的一個設計。

如果只是要一個二維坐標軸 name直接用sandbox直接調試想要的圖形就好了 這是一個調試工具。二維的圖基本都可以出來

 

 

 回來說我們的 雷達圖 在目錄下找到一個跟需求類似的雷達圖

然后根據名稱找到對應去 example目錄下找到對應的文件 復制一份到上層目錄下新建一個自己的目錄 myexample下 根據直接本地訪問調試就好了 大部分需要用到的注釋在腳本中注釋了
效果:基本每個部分都可調試

 

<?php /** * Created by PhpStorm. * User: zhangxd * Date: 2018/2/9 * Time: 15:20 */
include ("../class/pData.class.php"); include ("../class/pDraw.class.php"); include ("../class/pImage.class.php"); include ("../class/pRadar.class.php"); $one_data = array(1,5,10,20,30); drow_love_radar($one_data); function drow_love_radar($one_data, $file_name='radar.png', $type='auto'){ /* 設置顏色 */
    $MyData = new pData(); $MyData->addPoints($one_data, "score"); //設置字體描述 //$MyData->setSerieDescription("ScoreB", "Coverage B"); //設置數據線顏色(此處為紅綠藍三元素調色 alpha為透明度
    $data = array("R"=>30,"G"=>220,"B"=>245,"Alpha"=>100); $MyData->setPalette('score',$data);
/* 設立數據名稱 此處設置為空 不做顯示名稱 但是占位*/ $MyData->addPoints(array("", "", "", "", ""), "score_name"); $MyData->setAbscissa("score_name"); /* 創建畫布設置大小 */ $myPicture = new pImage(800, 800, $MyData); //$myPicture = new pImage(212, 213, $MyData); /* 畫一個背景蒙版 */ $Settings = array("R" => 255, "G" => 151, "B" => 178,"Alpha" => 100); //$myPicture->drawFilledRectangle(0, 0, 700, 230, $Settings); //根據起點和重點設置背景圖大小 $myPicture->drawFilledRectangle(100, 100, 600, 600, $Settings); /* 設置默認的字體屬性 */ $myPicture->setFontProperties(array("FontName" => "../fonts/Forgotte.ttf", "FontSize" => 10, "R" => 80, "G" => 80, "B" => 80)); /*在數據區域 添加填充顏色(為圖添加陰影)*/ // $myPicture->setShadow(TRUE, array("X" => 1, "Y" => 1, "R" => 250, "G" => 255, "B" => 250, "Alpha" => 50)); //$myPicture->setShadow(TRUE, array("X" => 1, "Y" => 1, "R" => 49, "G" => 221, "B" => 243, "Alpha" => 100)); /* Create the pRadar object */ $SplitChart = new pRadar(); //根據起點和重點設置雷達圖大小 $myPicture->setGraphArea(200, 200, 500, 500); $Options = array( //坐標軸顏色 'AxisR'=>255, 'AxisG'=>0, 'AxisB'=>0, 'AxisAlpha'=>100, "AxisRotation" => -17, //圖形旋轉角度 "DrawPoly" => TRUE, //區域陰影 需要調用setShadow方法設置陰影顏色 // "PolyAlpha" => 100, //區域陰影 透明度 'DrawAxisValues' => false, //畫坐標軸的值 奇丑 'WriteValues'=>false, //在坐標軸頂點標注數值 'WriteValuesInBubble'=>true, //在頂點氣泡中標注 'ValuePadding'=>1, //在頂點氣泡中標注 大小 'OuterBubbleRadius'=>0, //頂點氣泡顏色 //設置漸變顏色 從里圈到外圈 "BackgroundGradient" => array("StartR" => 255, "StartG" => 151, "StartB" => 178, "StartAlpha" => 100, "EndR" => 255, "EndG" => 255, "EndB" => 255, "EndAlpha" => 100), 'Layout'=>690011,//690011=>尖角雷達圖 690012=>圓角雷達圖 'SegmentHeight'=> 5,//設置每個坐標格大小 'Segments'=> 3, //設置雷達圖顯示幾個坐標格 'LabelMiddle'=>true, //標簽的一些東西 死丑死丑的 反正我沒用 'LabelsBackground'=>true, 'LabelsBGR'=>255, 'LabelsBGG'=>255, 'LabelsBGB'=>255, 'LabelsBGAlpha'=>100, "LabelPos" => RADAR_LABELS_HORIZONTAL, 'LabelPadding'=>10,//標簽距離 'DrawPoints'=>TRUE,//畫坐標頂點的小圓點 'PointRadius'=>5,//坐標頂點的小圓點大小 'PointSurrounding'=>500, 'DrawLines'=>true,//畫坐標點連接線(首尾點不連接 適用於xy坐標軸) 'LineLoopStart'=>true,//鏈接首尾的點 "FontName" => "../fonts/pf_arma_five.ttf",//字體文件 "FontSize" => 6,//字體大小 /*下面的調試無結果*/ //設置外 氣泡顏色 'OuterBubbleR'=>1, 'OuterBubbleG'=>1, 'OuterBubbleB'=>1, 'OuterBubbleAlpha'=>100, //設置內 氣泡顏色 'InnerBubbleR'=>1, 'InnerBubbleG'=>1, 'InnerBubbleB'=>1, 'InnerBubbleAlpha'=>100, //設置背景色 'DrawBackground'=>true, 'BackgroundR'=>255, 'BackgroundG'=>255, 'BackgroundB'=>255, 'BackgroundAlpha'=>100, ); $SplitChart->drawRadar($myPicture, $MyData, $Options); switch ($type){ case 'auto': //根據輸出環境操作 在命令模式下保存 $myPicture->autoOutput($file_name); break; case 'out': $myPicture->stroke(); break; case 'save': $myPicture->Render($file_name); break; } }

友情提示:最好熟悉一下dg庫 要不調試起來會很痛苦。



 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM