首先我們先上效果圖，如果你需要這樣的Demo請(qǐng)點(diǎn)擊此處下載：High-speed Charting Control--MFC繪圖Demo

在開(kāi)始之前，我們首先推薦一篇博客，該博客主要對(duì)該控件的英文開(kāi)發(fā)文檔進(jìn)行了翻譯，如果各位需要進(jìn)一步開(kāi)發(fā)該控件的其他功能可以詳細(xì)閱讀該博客或官方文檔：High-speed Charting Control--MFC繪制圖表（折線圖、餅圖、柱形圖）控件

接下來(lái)是該控件的下載地址：

免費(fèi)官方下載地址（需要注冊(cè)下載，頁(yè)面有時(shí)會(huì)打不開(kāi)）：https://www.codeproject.com/Articles/14075/High-speed-Charting-Control

CSDN下載地址（需要積分）：https://download.csdn.net/download/qq_15029743/10956256

好了，接下來(lái)正式介紹我們是如何畫(huà)圖的：

Step1:建立一個(gè)新的MFC工程文件，并將下載的控件的源文件（CSDN下載中的ChartCtrl_source.zip文件）解壓放到MFC工程目錄下：

Step2:導(dǎo)入控件類：

?

?Step3:程序界面拖入控件：

?

?選中拖入的自定義控件并更改屬性，這里要改的屬性有Style，就在5右邊的0改為2,0x52010000,Class命名為ChartCtrl,ID我們可以自定義（這里就使用默認(rèn)的IDC_CUSTOM1）：

Step4:?添加頭文件，在對(duì)話框類的頭文件中把控件包含進(jìn)來(lái)，具體代碼及實(shí)現(xiàn)效果如下如下：

#include "ChartCtrl/ChartCtrl.h"

Step5: 創(chuàng)建控件的成員變量：

CChartCtrl m_ChartCtrl1; //這里的成員變量名稱根據(jù)實(shí)際需要命名即可

關(guān)聯(lián)控件的成員變量和ID：

DDX_Control(pDX, IDC_CUSTOM1, m_ChartCtrl1);

此時(shí)，我們編譯運(yùn)行，控件就顯示出來(lái)了：

?Step6:?為控件添加坐標(biāo)軸：

CChartAxis *pAxis = NULL; pAxis = m_ChartCtrl1.CreateStandardAxis(CChartCtrl::BottomAxis); pAxis->SetAutomatic(true); pAxis = m_ChartCtrl1.CreateStandardAxis(CChartCtrl::LeftAxis); pAxis->SetAutomatic(true);

?Step7:創(chuàng)建標(biāo)題

首先導(dǎo)入標(biāo)題類的頭文件：

#include "ChartCtrl\ChartTitle.h" //標(biāo)題頭文件

?代碼實(shí)現(xiàn)：

TChartString str1; str1 = _T("High-speed Charting畫(huà)圖Demo"); m_ChartCtrl1.GetTitle()->AddString(str1);

?

?

?Step8:一些外觀上的設(shè)計(jì)(通常白底繪圖看久了比較累，我們這里進(jìn)行一些顏色的改變)

m_ChartCtrl.GetTitle()->SetColor(RGB(255, 255, 255)); //標(biāo)題字體白色m_ChartCtrl.GetLeftAxis()->SetTextColor(RGB(255, 255, 255)); //左坐標(biāo)軸白色m_ChartCtrl.GetBottomAxis()->SetTextColor(RGB(255, 255, 255)); //底部坐標(biāo)軸白色m_ChartCtrl.SetBorderColor(RGB(255, 255, 255)); //邊框顏色白色m_ChartCtrl.SetBackColor(RGB(85, 85, 85)); //背景顏色深灰色

修改之后看起來(lái)舒服多了，不扎眼了：

Step9:畫(huà)線

先導(dǎo)入畫(huà)線的頭文件：

#include "ChartCtrl\ChartLineSerie.h" //畫(huà)線頭文件

代碼實(shí)現(xiàn)：這里我們把代碼添加到一個(gè)按鈕響應(yīng)里（按鈕畫(huà)圖）：

?

這里我們畫(huà)一條過(guò)原點(diǎn)的直線，代碼如下：

?

double X1Values[10], Y1Values[10];for (int i = 0; i<10; i++){X1Values[i] = i;Y1Values[i] = i;}CChartLineSerie *pLineSerie2;m_ChartCtrl1.SetZoomEnabled(true);m_ChartCtrl1.RemoveAllSeries();//先清空pLineSerie2 = m_ChartCtrl1.CreateLineSerie();pLineSerie2->SetSeriesOrdering(poNoOrdering);//設(shè)置為無(wú)序pLineSerie2->SetPoints(X1Values, Y1Values, 10);

?這樣，我們點(diǎn)擊之后就可以畫(huà)出一條直線了：

Step10:添加鼠標(biāo)響應(yīng)，很多時(shí)候我們需要知道繪圖控件中的某個(gè)點(diǎn)的具體坐標(biāo)，這時(shí)候我們可以通過(guò)添加十字光標(biāo)來(lái)實(shí)現(xiàn)

?添加鼠標(biāo)響應(yīng)頭文件：

#include "ChartCtrl\ChartMouseListener.h" //鼠標(biāo)響應(yīng)頭文件

定義兩個(gè)全局變量來(lái)存儲(chǔ)坐標(biāo)：

double x, y;

添加一個(gè)自定義消息來(lái)傳遞坐標(biāo)：

?

?點(diǎn)擊編輯代碼，然后我們來(lái)寫處理代碼：

CString s;s.Format(_T("x = %.2f,y = %.2f"), x, y);CStatic* pStatic;pStatic = (CStatic*)GetDlgItem(IDC_STATIC);pStatic->SetWindowText(s);return 1;

?這里的IDC_STATIC是我們提前準(zhǔn)備的一個(gè)靜態(tài)文本框，用于顯示坐標(biāo)信息

?這里我們還需要定義一下消息：

#define MESSAGE_UPDATEPOS WM_USER+1001

?加下來(lái)我們用代碼實(shí)現(xiàn)派生類：

class CCustomCursorListener : public CChartCursorListener { public:void OnCursorMoved(CChartCursor *pCursor, double xValue, double yValue){x = xValue;y = yValue;SendMessage(m_hwnd, MESSAGE_UPDATEPOS, 0, 0);// Do something with the string...}void GetHwnd(HWND hwnd){m_hwnd = hwnd;}HWND m_hwnd; };

?

?最后，我們?cè)诎粹o下添加實(shí)現(xiàn)代碼：

CCustomCursorListener* m_pCursorListener;CChartCrossHairCursor* pCrossHair =m_ChartCtrl1.CreateCrossHairCursor();HWND hWnd = this->GetSafeHwnd();m_pCursorListener = new CCustomCursorListener;m_pCursorListener->GetHwnd(hWnd);pCrossHair->RegisterListener(m_pCursorListener);

?

至此，我們完成了整個(gè)Demo,點(diǎn)擊畫(huà)圖即可獲得博客開(kāi)頭的效果:

總結(jié)

以上是生活随笔為你收集整理的High-speed Charting Control（MFC绘图控件）--MFC绘图Demo(包含鼠标响应)的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。