Echarts .NET类库开源

博主分享了自己开发的一个.NET版ECharts类库,方便.NET开发者构建ECharts图表。类库支持多种图表类型和组件,包括折线图、柱状图、散点图等,并提供了示例网站供参考。同时,博主提到了对开源社区的感激,并鼓励大家为.NET阵营贡献力量。
摘要由CSDN通过智能技术生成

前言:

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

  从12年在长沙就想写点开源的东西,不过实在不敢献丑.这次机缘巧合,有个朋友一个项目需要用到大量报表,我找到百度的开源echarts项目(感谢开源,4年工作以来用到很多很好的开源项目,对工作助力颇多),看着就挺舒服的,又看到了@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()方式.不管是:

"formatter": function(params) {
 
        // for text color
 
        var color = colorList[params[0].dataIndex];
 
        var res = '<div style="color:' + color + '">';
 
        res += '<strong>' + params[0].name + '消费(元)</strong>'
 
        for (var i = 0, l = params.length; i < l; i++) {
 
            res += '<br/>' + params[i].seriesName + ' : ' + params[i].value
 
        }
 
       
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值