Echarts+WPF

Posted hegezhishouzhetian

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Echarts+WPF相关的知识,希望对你有一定的参考价值。

C#

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Interop;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;

namespace WpfBrowserApp1
{
    /// <summary>
    /// Page1.xaml 的交互逻辑
    /// </summary>
    public partial class Page1 : Page
    {
        public dynamic scriptObject = null;
        public Page1()
        {
            InitializeComponent();
            if (!BrowserInteropHelper.IsBrowserHosted)
            {
                MessageBox.Show("不满足与JS调用条件");
                return;
            }
            scriptObject = BrowserInteropHelper.HostScript;
            if (scriptObject != null)
            {
                scriptObject.SetWpfObj(new OprateBasic());
            }
            webbrowser.Source = new Uri("html页面的路径");
            webbrowser.ObjectForScripting = new OprateBasic();
//            m_webFrame.Source =
//                new Uri(
//                    "");
//            m_webFrame.NavigationUIVisibility = System.Windows.Navigation.NavigationUIVisibility.Hidden;
            // Web.Navigate();
        }
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            //O option = JsonConvert.DeserializeObject<O>(Readjson(""));
            webbrowser.InvokeScript("msg",Readjson(""));
            //Web.InvokeScript("msg", Tb1.Text);
        }
        /// <summary>
        /// 读取JSON文件
        /// </summary>
        /// <param name="key">JSON文件中的key值</param>
        /// <returns>JSON文件中的value值</returns>
        public static string Readjson(string key)
        {
            string jsonfile = "";//JSON文件路径

            using (System.IO.StreamReader file = System.IO.File.OpenText(jsonfile))
            {
                using (JsonTextReader reader = new JsonTextReader(file))
                {
                    JObject o = (JObject)JToken.ReadFrom(reader);
                    var value = o.ToString();
                    return value;
                }
            }
        }
    }
    [System.Runtime.InteropServices.ComVisible(true)] // 将该类设置为com可访问
    public class OprateBasic
    {
        public void palymusic(string msg)
        {
            //string json = File.ReadAllText("json文件路径“);
            //dynamic jsonObj = Newtonsoft.Json.JsonConvert.DeserializeObject(json);
            
           // string output = JsonConvert.SerializeObject(msg, Newtonsoft.Json.Formatting.Indented);
            File.WriteAllText("data.json", msg);
           // MessageBox.Show("WPF弹出框:" + msg);
        }
    }
}

html 

技术图片
 1 <!-- saved from url=(0013)about:internet -->
 2 <!DOCTYPE html>
 3 <html>
 4 <head>
 5     <meta charset="utf-8">
 6     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 7     <title>ECharts</title>
 8     
 9     <!-- 引入 echarts.js -->
10     <script src="../Scripts/echarts.js"></script>
11     <script src="../Scripts/echarts-all.js"></script>
12     <script src="http://code.jquery.com/jquery-latest.js"></script>
13 </head>
14 <body>
15     <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
16 <div id="main" style="width: 600px;height:400px;"></div>
17 <input type="text" id="txtInput" />
18 <button onclick="Test()" style="width:100px;height:20px">测试</button>
19 <script>
20     var con = window.external
21     var option = {};
22     function Test() {
23         option.xAxis[0].name = $("#txtInput").val()
24         con.palymusic(JSON.stringify(option));
25     }
26     
27     function msg(obj) {
28         alert(obj)
29         var myChart = echarts.init(document.getElementById(main));
30         option = JSON.parse(obj)
31         myChart.setOption(option)
32     }
33     
34 </script>
35     <script type="text/javascript">
36         // 基于准备好的dom,初始化echarts实例
37         
38 
39         // 指定图表的配置项和数据
40         
41         //var str = ""
42        // $.getJSON("../Data/data.json",function(data){
43          //   $.each(data,function(infoindex,info){
44                 //str+=info["dd"]
45            // })
46         //})
47        // alert(str);
48         //;
49         
50     </script>
51 </body>
52 </html>
View Code
配置
技术图片
 1 <?xml version="1.0" encoding="utf-8"?>
 2 <asmv1:assembly manifestVersion="1.0" xmlns="urn:schemas-microsoft-com:asm.v1" xmlns:asmv1="urn:schemas-microsoft-com:asm.v1" xmlns:asmv2="urn:schemas-microsoft-com:asm.v2" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
 3   <assemblyIdentity version="1.0.0.0" name="MyApplication.app" />
 4   <trustInfo xmlns="urn:schemas-microsoft-com:asm.v2">
 5     <security>
 6       <requestedPrivileges xmlns="urn:schemas-microsoft-com:asm.v3">
 7         <!-- UAC 清单选项
 8             如果要更改 Windows 用户帐户控制级别,请用以下节点之一替换 
 9             requestedExecutionLevel 节点。
10 
11         <requestedExecutionLevel  level="asInvoker" uiAccess="false" />
12         <requestedExecutionLevel  level="requireAdministrator" uiAccess="false" />
13         <requestedExecutionLevel  level="highestAvailable" uiAccess="false" />
14 
15             指定 requestedExecutionLevel 节点将会禁用文件和注册表虚拟化。
16             如果要利用文件和注册表虚拟化实现向后 
17             兼容性,则删除 requestedExecutionLevel 节点。
18         -->
19         <requestedExecutionLevel level="asInvoker" uiAccess="false" />
20       </requestedPrivileges>
21       <applicationRequestMinimum>
22         <defaultAssemblyRequest permissionSetReference="Custom" />
23         <PermissionSet class="System.Security.PermissionSet" version="1" Unrestricted="true" ID="Custom" SameSite="site" />
24       </applicationRequestMinimum>
25     </security>
26   </trustInfo>
27   <compatibility xmlns="urn:schemas-microsoft-com:compatibility.v1">
28     <application>
29       <!-- 此应用程序设计使用的所有 Windows 版本的列表。Windows 将会自动选择最兼容的环境。-->
30       <!-- 如果应用程序设计使用 Windows 7,请取消注释以下 supportedOS 节点-->
31       <!--<supportedOS Id="{35138b9a-5d96-4fbd-8e2d-a2440225f93a}"/>-->
32     </application>
33   </compatibility>
34   <!-- 启用 Windows 公共控件和对话框的主题(Windows XP 和更高版本) -->
35   <!-- <dependency>
36     <dependentAssembly>
37       <assemblyIdentity
38           type="win32"
39           name="Microsoft.Windows.Common-Controls"
40           version="6.0.0.0"
41           processorArchitecture="*"
42           publicKeyToken="6595b64144ccf1df"
43           language="*"
44         />
45     </dependentAssembly>
46   </dependency>-->
47 </asmv1:assembly>
View Code

 

以上是关于Echarts+WPF的主要内容,如果未能解决你的问题,请参考以下文章

小程序里echarts画的饼图在安卓手机上效果不正常?

在WPF中嵌入WebBrowser可视化页面

WPF实用小工具

wpf MenuItem动态加载数据

从控制台应用程序启动 WPF 窗口

WPF中嵌套charts图表查询数据