相關鏈接：
|
C++ GUI 繪圖控件目錄 MFC
Qt |
也許這是vc下最好最方便的繪圖類，它有TeeChart的繪圖和操作風格，不用當心註冊破解的問題，因爲它是開源的。不用打包註冊，因爲它是封裝成類的，能方便擴展繼承。vc6.0到vs2010都能使用，而且非常簡單。
此類發表於codeproject
在使用它的時候，展示一下它的效果吧：
如果你想需要上面這些效果的，果斷選它吧！
下面用圖文並茂的方式，來詳細介紹這個繪圖控件
首先，下載這個控件，最新可以從這裏獲取codeproject
1 ChartCtrl類的導入
在工程下建立一個文件夾
叫ChartCtrl吧，裏面放置ChartCtrl的源代碼
文件夾內容如圖所示
然後讓vs導入這些類
全選，確定-ok
這時工程就添加好這個控件了
2.創建控件
2.1 對話框編輯器創建
對於一些不需要改變大小的對話框來說，在對話框編輯器裏拖曳創建控件是最舒服的方法了，這個ChartCtrl可以用用戶控件來創建首先在對話框上放置一個Custom Control
修改屬性如下圖所示。這裏要改的屬性有Style，就在5右邊的0改爲2,0x52010000,Class命名爲ChartCtrl,ID隨便改了
給對話框添加變量，和傳統的方法一樣。這裏需要注意的是，由於文件都放置在工程文件的一個文件夾下，包含頭文件時需要指明路徑
頭文件包含的樣式如下：
#include "ChartCtrl/ChartCtrl.h"在對話框類添加變量，叫m_ChartCtrl1（後面還有m_ChartCtrl2通過動態創建的）
CChartCtrl m_ChartCtrl2; 在DoDataExchange函數裏添加關聯
void CSpeedChartCtrlDemoDlg::DoDataExchange(CDataExchange* pDX)
{
CDialogEx::DoDataExchange(pDX);
DDX_Control(pDX, IDC_ChartCtrl1, m_ChartCtrl1);
}
2.2 動態創建
添加頭文件：
同樣頭文件如下寫：
#include "ChartCtrl/ChartCtrl.h"CChartCtrl m_ChartCtrl2;在resource.h裏添加一個資源
添加IDC_ChartCtrl2，爲1001，注意記得把_APS_NEXT_CONTROL_VALUE改成下一個資源號
在OnInitDialog裏創建
如：
CRect rect,rectChart;
GetDlgItem(IDC_ChartCtrl1)->GetWindowRect(&rect);
ScreenToClient(rect);
rectChart = rect;
rectChart.top = rect.bottom + 3;
rectChart.bottom = rectChart.top + rect.Height();
m_ChartCtrl2.Create(this,rectChart,IDC_ChartCtrl2);
m_ChartCtrl2.ShowWindow(SW_SHOWNORMAL);這樣就可以創建了，下圖兩個控件分別通過對話框編輯器創建和動態創建，代碼在附件下載裏
此時什麼也不會顯示，需要添加座標軸
3.創建座標軸
ChartCtrl一共有3種座標，都繼承於CChartAxis
頭文件ChartCtrl.h已經包含這些座標，不需要引入
下面分別建立兩種座標軸，一個是數值型一個是時間型
在m_ChartCtrl1建立兩個都是數值型的座標
在創建m_ChartCtrl1之後加入如下創建座標軸的代碼：（這裏寫在OnInitDialog裏）
CChartAxis *pAxis= NULL;
pAxis = m_ChartCtrl1.CreateStandardAxis(CChartCtrl::BottomAxis);
pAxis->SetAutomatic(true);
pAxis = m_ChartCtrl1.CreateStandardAxis(CChartCtrl::LeftAxis);
pAxis->SetAutomatic(true);
給m_ChartCtrl2創建時間座標
CChartDateTimeAxis* pDateAxis= NULL;
pDateAxis = NULL;
pDateAxis = m_ChartCtrl2.CreateDateTimeAxis(CChartCtrl::BottomAxis);
pDateAxis->SetAutomatic(true);
pDateAxis->SetTickLabelFormat(false,_T("%m月%d日"));
pAxis = m_ChartCtrl2.CreateStandardAxis(CChartCtrl::LeftAxis);
pAxis->SetAutomatic(true);SetTickLabelFormat函數用來設置時間顯示方式，格式化和COleDateTime的Format一樣
4.創建標題
#include "ChartClass\ChartTitle.h"
在添加標題時，先要說說ChartCtrl的字符串，ChartCtrl的字符串實際是stl的string和wstring，爲了對應unicode，作者對這兩種字符進行了一個宏定義，就像TCHAR一樣，定義如下：
#include<string>
#include <sstream>
#if defined _UNICODE ||defined UNICODE
typedef std::wstring TChartString;
typedef std::wstringstream TChartStringStream;
#else
typedef std::string TChartString;
typedef std::stringstream TChartStringStream;
#endif所以在多字節情況下，就是string。由於MFC大部分都是用CString，CString也是經過宏定義，所以可以比較輕鬆的和TChartString轉換，另外TChartStringStream遠比CString的Format靈活和直觀，建議大家研究研究！
加入如下代碼：
TChartString str1;
str1 = _T("IDC_ChartCtrl1 - m_ChartCtrl1");
m_ChartCtrl1.GetTitle()->AddString(str1);
CString str2(_T(""));
str2 = _T("IDC_ChartCtrl2 - m_ChartCtrl2");
m_ChartCtrl2.GetTitle()->AddString(TChartString(str2));TChartString 可以直接用“=”對字符串賦值
設置座標軸的標題，首先需要獲取座標GetLeftAxis，GetBottomAxis ……
獲取座標後，獲得座標的文字標籤GetLabel，然後進行修改
如下兩種寫法，一種比較安全繁瑣，一種就直接過去就可以，看個人喜好
CChartAxisLabel* pLabel = NULL;
CChartAxis *pAxis = NULL;
TChartString str1 = _T("左座標軸");
CChartAxisLabel* pLabel = NULL;
pAxis = m_ChartCtrl1.GetLeftAxis();
if(pAxis)
pLabel = pAxis->GetLabel();
if(pLabel)
pLabel->SetText(str1);
m_ChartCtrl2.GetLeftAxis()->GetLabel()->SetText(str1);
str1 = _T("數值座標軸");
pAxis = m_ChartCtrl1.GetBottomAxis();
if(pAxis)
pLabel = pAxis->GetLabel();
if(pLabel)
pLabel->SetText(str1);
str1 = _T("時間座標軸");
m_ChartCtrl2.GetBottomAxis()->GetLabel()->SetText(str1);設置完效果如圖
標題還可以更改顏色，這裏不再重複描述。
5.畫圖
5.1 創建線圖
ChartCtrl的畫線非常簡單通用，遠比TeeChart簡單和方便。
創建線圖先要創建一個圖形系列，這個和TeeChart很像
用函數CChartCtrl的CreateLineSerie()函數即可創建一個線圖，這個函數會返回這個系列的指針，所有在創建之後記得保存下這個指針，以便之後的操作。線圖系列的指針是CChartLineSerie，記得包含頭文件
#include "ChartClass\ChartLineSerie.h"
創建完序列之後就可以用AddPoints函數把double數組的數據畫出來，這個比TeeChart方便多了
如下這是畫圖的函數
m_ChartCtrl1.EnableRefresh(false);
m_ChartCtrl2.EnableRefresh(false);
//////////////////////////////////////////////////////////////////////////
//畫圖測試
//////////////////////////////////////////////////////////////////////////
double x[1000], y[1000];
for (int i=0; i<1000; i++)
{
x[i] = i;
y[i] = sin(float(i));
}
CChartLineSerie *pLineSerie1;
m_ChartCtrl1.RemoveAllSeries();//先清空
pLineSerie1 = m_ChartCtrl1.CreateLineSerie();
pLineSerie1->SetSeriesOrdering(poNoOrdering);//設置爲無序
pLineSerie1->AddPoints(x, y,1000);
pLineSerie1->SetName(_T("這是IDC_ChartCtrl1的第一條線"));//SetName的作用將在後面講到
//////////////////////////////////////////////////////////////////////////
//時間軸畫圖
//////////////////////////////////////////////////////////////////////////
COleDateTime t1(COleDateTime::GetCurrentTime());
COleDateTimeSpan tsp(1,0,0,0);
for (int i=0; i<1000; i++)
{
x[i] = t1.m_dt;
y[i] = sin(float(i));
t1 += tsp;
}
CChartLineSerie *pLineSerie2;
m_ChartCtrl2.RemoveAllSeries();//先清空
pLineSerie2 = m_ChartCtrl2.CreateLineSerie();
pLineSerie2->SetSeriesOrdering(poNoOrdering);//設置爲無序
pLineSerie2->AddPoints(x, y,1000);
pLineSerie2->SetName(_T("這是IDC_ChartCtrl2的第一條線"));//SetName的作用將在後面講到
m_ChartCtrl1.EnableRefresh(true);
m_ChartCtrl2.EnableRefresh(true);
RemoveAllSeries函數可以清楚所有線條，EnableRefresh函數可以提供繪圖效率，另外告訴大家一個bug，時間軸座標在調第二次用RemoveAllSeries函數後，畫圖時一定要EnableRefresh(false)再EnableRefresh(true);否則會斷言
下面將介紹更多的會圖方法
在上一篇已經介紹了簡單的線條繪製，實際上可能需要多的功能
5.2 添加曲線
控件可以繪製不止一條曲線，可以繪製足夠多的曲線在上面，下面演示如何添加多個曲線
只要在畫圖時不清楚原來的曲線就會添加多一條曲線
把代碼的RemoveAllSeries去掉就會添加多條曲線
m_ChartCtrl1.EnableRefresh(false);
m_ChartCtrl2.EnableRefresh(false);
//////////////////////////////////////////////////////////////////////////
//畫圖測試
//////////////////////////////////////////////////////////////////////////
double x[1000], y[1000];
for (int i=0; i<1000; i++)
{
x[i] = i;
y[i] = sin(float(i)*m_ChartCtrl1.GetSeriesCount());
}
CChartLineSerie *pLineSerie1;
// m_ChartCtrl1.RemoveAllSeries();//不清空
pLineSerie1 = m_ChartCtrl1.CreateLineSerie();
pLineSerie1->SetSeriesOrdering(poNoOrdering);//設置爲無序
pLineSerie1->AddPoints(x, y,1000);
TChartStringStream strs1;
strs1 << _T("這是IDC_ChartCtrl1的第")
<< m_ChartCtrl1.GetSeriesCount()
<< _T("條曲線");
pLineSerie1->SetName(strs1.str());
//////////////////////////////////////////////////////////////////////////
//時間軸畫圖
//////////////////////////////////////////////////////////////////////////
COleDateTime t1(COleDateTime::GetCurrentTime());
COleDateTimeSpan tsp(1,0,0,0);
for (int i=0; i<1000; i++)
{
x[i] = t1.m_dt;
y[i] = sin(float(i)*m_ChartCtrl2.GetSeriesCount());
t1 += tsp;
}
CChartLineSerie *pLineSerie2;
// m_ChartCtrl2.RemoveAllSeries();//不清空
pLineSerie2 = m_ChartCtrl2.CreateLineSerie();
pLineSerie2->SetSeriesOrdering(poNoOrdering);//設置爲無序
pLineSerie2->AddPoints(x, y,1000);
TChartStringStream strs2;
strs2 << _T("這是IDC_ChartCtrl2的第")
<< m_ChartCtrl2.GetSeriesCount()
<< _T("條曲線");
pLineSerie2->SetName(strs2.str());
m_ChartCtrl1.EnableRefresh(true);
m_ChartCtrl2.EnableRefresh(true);這裏我添加了n條。
5.3 動態曲線
以前寫TeeChart畫圖的文章時好多人問怎麼動態畫圖，其實所有畫圖控件的動態畫圖都一樣，就是不停的畫，動的只是數組，控件只負責畫圖，你想讓圖像動起來，就讓數據動起來！
數據動起來涉及到數組的左右移動，很簡單的一個算法而已
如有一個double數組 double pdx[100],pdy[100];
每次畫圖時讓pdx左移一位
for(int i(0);i<99;++i)
{
pdx[i] = pdx[i+1];
pdy[i] = pdy[i+1];
}
pdy[99] = ……需要顯示的新數據……然後每隔0.幾秒畫出來，就發現動起來了
ChartCtrl提供了兩種繪圖函數，AddPoints和AddPoint,這兩種函數在繪製動態圖時會有所區別，區別見上圖，上面的是AddPoints，繪圖長度固定，AddPoint效果見下圖，圖線會不停積累。
這是我在上研究生時寫的一篇文章，當時放進草稿箱裏一直沒發出來，今天無意看到，決定把他完成，demo代碼已經找不到了，可能在我以前實驗室的電腦裏吧~工作後也很少用mfc了，現在偶爾用用qt過把癮，大家如果對繪圖工控有需求的話，可以使用qt的qwt控件，也比較簡單，這個控件幫了我很多忙，在此向作者表示感謝，大家可以查看其源代碼學習其編程思想。
下載地址：http://www.codeproject.com/Articles/14075/High-speed-Charting-Control
csdn資源下載地址：http://download.csdn.net/detail/czyt1988/6880917
