C# Winform ECharts X轴数据量大进行拖动（小白篇）

环境：Win10 x64,VS2015, C#,  ECharts

目标：C# 使用 WebBrowser控件加载ECharts,创建折线图，X轴可拖动，

           本文只介绍C# 如何配置 ECharts,不介绍ECharts 的具体用法。

介绍： ECharts：

           官网：https://echarts.apache.org/zh/index.html

           优势：开源，功能丰富，学习简单，真的很好用，

           如果想学好这个，建议直接官网上学习，比其他博客文章介绍的详细，有趣 ！！！

记录时间：2020/08/28

---

内容：

先上效果图：

显示内容是从ECharts 官网样例代码改的，X轴方向上的数量大概是800个值，可以水平拖动。

---

项目配置：

1. 新建C# 项目，Windows窗体应用程序

2. 添加公共控件 WebBrowser

3. 添加代码如下：

//构造函数初始化
public EChartUI(string htmlFilePath)
{
    m_htmlFilePath = htmlFilePath;

    InitializeComponent();

    //EChart所需的IE版本较高
    SetIE(IE_Version.Enforce_IE10);

    //初始化浏览器
    InitWebBrowser();

    //加载网页文件
    LoadHtmlFile();
}

private enum IE_Version
{
    Enforce_IE10,    //强制ie10: 10001 (0x2711) Internet Explorer 10。网页以IE 10的标准模式展现，页面!DOCTYPE无效
    Stand_IE10,     // 标准ie10: 10000 (0x02710) Internet Explorer 10。在IE 10标准模式中按照网页上!DOCTYPE指令来显示网页。Internet Explorer 10 默认值。
    Enforce_IE9,    //强制ie9:    9999 (0x270F) Windows Internet Explorer 9. 强制IE9显示，忽略!DOCTYPE指令
    Stand_IE9,       //标准ie9:    9000 (0x2328) Internet Explorer 9. Internet Explorer 9默认值，在IE9标准模式中按照网页上!DOCTYPE指令来显示网页。
    Enforce_IE8,    //强制ie8:    8888 (0x22B8) Internet Explorer 8，强制IE8标准模式显示，忽略!DOCTYPE指令
    Stand_IE8,      //标准ie8:     8000 (0x1F40) Internet Explorer 8默认设置，在IE8标准模式中按照网页上!DOCTYPE指令展示网页
    Stand_IE7       //标准ie7:     7000 (0x1B58) 使用WebBrowser Control控件的应用程序所使用的默认值，在IE7标准模式中按照网页上!DOCTYPE指令来展示网页
}

/// <summary>
/// 设置WebBrowser的默认版本
/// </summary>
/// <param name="ver">IE版本</param>
private void SetIE(IE_Version ver)
{
    string productName = AppDomain.CurrentDomain.SetupInformation.ApplicationName;//获取程序名称

    object version;
    switch (ver)
    {
        case IE_Version.Stand_IE7:
            version = 0x1B58;
            break;
        case IE_Version.Stand_IE8:
            version = 0x1F40;
            break;
        case IE_Version.Enforce_IE8:
            version = 0x22B8;
            break;
        case IE_Version.Stand_IE9:
            version = 0x2328;
            break;
        case IE_Version.Enforce_IE9:
            version = 0x270F;
            break;
        case IE_Version.Stand_IE10:
            version = 0x02710;
            break;
        case IE_Version.Enforce_IE10:
            version = 0x2711;
            break;
        default:
            version = 0x1F40;
            break;
    }

    Microsoft.Win32.RegistryKey key = Registry.CurrentUser;
    RegistryKey software =
        key.CreateSubKey(
            @"Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION\" + productName);
    if (software != null)
    {
        software.Close();
        software.Dispose();
    }
    RegistryKey wwui =
        key.OpenSubKey(
            @"Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION", true);

    //该项必须已存在
    if (wwui != null)
    {
        wwui.SetValue(productName, version, RegistryValueKind.DWord);
    }
}

/// <summary>
/// 初始化浏览器
/// </summary>
private void InitWebBrowser()
{
    //防止 WebBrowser 控件打开拖放到其上的文件。
    webBrowser.AllowWebBrowserDrop = false;

    //防止 WebBrowser 控件在用户右击它时显示其快捷菜单.
    webBrowser.IsWebBrowserContextMenuEnabled = false;

    //以防止 WebBrowser 控件响应快捷键。
    webBrowser.WebBrowserShortcutsEnabled = false;

    //以防止 WebBrowser 控件显示脚本代码问题的错误信息。    
    webBrowser.ScriptErrorsSuppressed = true;

    //（这个属性比较重要，可以通过这个属性，把WINFROM中的变量，传递到JS中，供内嵌的网页使用；但设置到的类型必须是COM可见的，所以要设置     [System.Runtime.InteropServices.ComVisibleAttribute(true)]，因为我的值设置为this,所以这个特性要加载窗体类上）
    webBrowser.ObjectForScripting = this;
}

private void LoadHtmlFile()
{
    this.webBrowser.Url = new Uri(m_htmlFilePath);
}

private void UI_Close(object sender, FormClosingEventArgs e)
{
    this.webBrowser.Dispose();
}

注意的坑： WebBrowser 默认支持的是IE7, 但高版本的ECharts 需要 IE10,所以必须设置IE版本。

---

参考链接：

1. https://blog.csdn.net/a5pansq/article/details/89669310     

2. https://www.cnblogs.com/JiYF/p/8711277.html            

---

测试项目下载：

编译时使用 VS2015 + Debug + x64

链接：https://download.csdn.net/download/qq_30722721/12767882