echarts .NET类库开源

echarts .NET类库开源

echarts .NET类库开源

原创 2016-03-05 冰の酷龙 dotNET跨平台

前言：

　　２０１２年从长沙跑到深圳，２０１６年又从深圳回到长沙，兜兜转转一圈，又回到了原点．４年在深圳就呆了一家公司，回长沙也是因为深圳公司无力为继，长沙股东老板挽留，想想自己年纪也不小了．就回来了，在长沙工作几月，也没什么太多的不适应．不用赶着项目上线，不用加班，想想其实也不错.　

　　从１２年在长沙就想写点开源的东西，不过实在不敢献丑．这次机缘巧合，有个朋友一个项目需要用到大量报表，我找到百度的开源echarts项目（感谢开源，４年工作以来用到很多很好的开源项目，对工作助力颇多），看着就挺舒服的，又看到了＠abel533写的java类库，萌生了想写一个.net类库的想法．项目后来没做下去了，但是echart类库倒是坚持写下来了．断断续续几个月的时间，终于有点样子了．之所以写这篇博客，是因为最近在园子里看到很多看衰.net的文章，我无法判断对错,也不想引起争论,不过我只是简单喜欢编程的人,能够做自己喜欢的事就好,其实好的环境需要大家一起营造，我也想为.net阵营做一些有意义的事情．

 

源码：

源码地址：https://github.com/idoku/EChartsSDK

示例地址：http://echarts.idoku.cn/

echart地址：http://echarts.baidu.com/

 

先放几张eharts的图感受一下：

　　　　　　　　　　　　　　　　　　　　　　折线图

　　　　　　　　　　　　　　　　　　柱状图

　　　　　　　　　　　　　　　　散点图

 

　　　　　　　　　　　　饼图

 

正文

ECharts .Net类库

当前版本1.0.1

Echarts

本项目是一个供.NET开发者使用的ECharts的开发包,主要目的是方便在.NET中构件Echarts中可能用的全部数据结构,完整的Option结构. ChartOption中的数据Series,包含Line-折线图,Bar-柱状图,Pie-饼图,Scatter-散点图等,支持Echarts中所有图表.支持所有Style类,如AreaStyle,ItemStyle,LineStyle等.支持多种Data数据类型,一个通用的Data数据,以及PieData,PolarData,TreeData等个性化数据结构.

你可以使用本项目直接构件一个Option对象,使用方法JsonTools.ObjectToJson2(option),(直接使用Json方式返回存在问题,因为function不是标准化的json格式,转换会报错).

 

图表类型

• Line - 折线（面积）图
• Bar - 柱状（条形）图
• Scatter - 散点（气泡）图
• K - K线图
• Pie - 饼（圆环）图
• Radar - 雷达（面积）图
• Chord - 和弦图
• Force - 力导向布局图
• Map - 地图
• Gauge - 仪表盘
• Funnel - 漏斗图
• Heatmap - 热力图
• EventRiver - 事件河流图
• Venn - 韦恩图
• Tree - 树图
• Treemap - 矩形树图
• WordCloud - 词云

Echarts组件

• Axis - 坐标轴
• Grid - 网格
• Title - 标题
• Tooltip - 提示
• Legend - 图例
• DataZoom - 数据区域缩放
• DataRange - 值域漫游
• Toolbox - 工具箱
• Timeline - 时间线

 

ChartOption说明

1. ChartOption 是echarts的主要类.
2. 使用JsonTools.ObjectToJson2方法返回给前端时,需要使用eval('(' + data + ')')转换为JSON结构.

 

Function说明

由于json标准中不包含function类型,一般json库都不支持这种类型,处理这种类型最简单的方式是转换json字符串时,对字符串进行处理.

读者可以自行使用其他自定义方式实现,本项目使用的.net自带的JRaw()方式.不管是:

 

和

 

都可以利用JRaw来实现.

 

                                       

EchartsWeb

本项目通过ASP.NET MVC和ASP.NET web api模拟了echarts官网网站中的全部示例,主要目的是方便大家参考使用和调整结构.

地址:http://echarts.idoku.cn/

 

1.简单Line示例

演示地址: http://echarts.idoku.cn/home/example?api=line1

 

例子中给出的json结构.

 

 

对应的源码:

 

 

2.使用function的bar示例.

演示地址: http://echarts.idoku.cn/home/example?api=bar10#              

 

给出的json代码:

 

 

对应的源码:

 

博客总结:

　　排版真是硬伤~~~因为在项目期间,百度将echarts版本升级到了3.0,但是我已经实现了一半,所以就没有使用新的3.0来实现.而且上面说到的项目没有做下去,所以我是参考了@abel533的写法,实际中使用会碰到什么问题暂时不清楚,如果有园友使用中碰到什么问题,欢迎与我交流.第一次做开源项目,欢迎大家批评指正.

原文地址：http://www.cnblogs.com/kulong995/p/5237796.html

？？？企企csvcsvcsvcsvcsvcsv