Web API:将FlexChart导出为图片
如果想要将FlexChart在应用之外使用,比如使用在报表中,Web API帮助你将FlexChart导出成任何你需要的图片格式。
下面是实现的步骤:
1:创建FlexChart
2:调用Service
3:运行项目
第一步:
需要一个FlexChart,本文的注意力放在Web API部分。因此从一个基本的FlexChart应用开始:
![]()
第二步:调用Service
1.添加C1 Web API客户端的JavaScript文件和引用到MVC工程。
2.创建一个功能,使用客户端JavaScript帮助,继承export功能,在Views|FlexChart|Index.cshtml里添加如下代码:
<script type="text/javascript">
function exportImage() {
var exporter = new wijmo.chart.ImageExporter();
imageType = document.getElementById("mySelect").value;
control = wijmo.Control.getControl('#flexChart');
exporter.requestExport(control, "http://demos.componentone.com/ASPNET/C1WebAPIService/api/export/image", {
fileName: "exportFlexChart",
type: imageType,
});
}
</script>
3.添加按钮然后在Button的Click中调用export的功能,在Views|FlexChart|Index.cshtml里添加如下代码
<select id="mySelect">
<option selected>Png</option>
<option>Jpg</option>
<option>Gif</option>
<option>Bmp</option>
<option>Tiff</option>
</select>
<button onclick="exportImage()" title="Export">Export</button>
第三步:运行项目
*点击Build|Build Solution编译项目
*选择F5运行
当运行程序,得到的效果如下所示:
![]()
更多的Web API请参考:
http://helpcentral.componentone.com/nethelp/C1WebAPI/webframe.html#C1WebAPI.html
Web API:将FlexChart导出为图片的更多相关文章
- 使用web API和NPOI导出Excel
使用MVC controller输出excel的例子,自不待言,例子满天飞. 由于本项目使用的是Asp.net MVC API,因此在本项目使用API,实现了文件下载功能.代码的原理很简单,基本上是老 ...
- Web Api 图片上传,在使用 Task.ContinueWith 变量无法赋值问题
细谈 Web Api 图片上传,在使用 Task.ContinueWith 变量无法赋值问题的解决办法! 在使用Asp.Net Web Api 图片上传接口的时候,到网上找了一些个例子,但大多数找 ...
- .Net core Web API导出数据到Excel
前言 产品经理有一个需求,就是将cosmosDB里的数据,导出到Excel中. 1.新建一个.net core web api controller 添加引用:EPPlus.Core Install- ...
- Asp.Net Core Web Api图片上传(一)集成MongoDB存储实例教程
Asp.Net Core Web Api图片上传及MongoDB存储实例教程(一) 图片或者文件上传相信大家在开发中应该都会用到吧,有的时候还要对图片生成缩略图.那么如何在Asp.Net Core W ...
- 细谈 Web Api 图片上传,在使用 Task.ContinueWith 变量无法赋值问题的解决办法!
在使用Asp.Net Web Api 图片上传接口的时候,到网上找了一些个例子,但大多数找到都是这个版本! [HttpPost] public Task<Hashtable> ImgUpl ...
- Windows Azure 系列-- 使用Azure + Web API实现图片上传
1. 创建1个Azure账号,登录之后创建1个AzureStorage.左下方点Manage Access会看到Primary Access Key和Storage Account,记住它们的位置,等 ...
- C#设计模式总结 C#设计模式(22)——访问者模式(Vistor Pattern) C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】:利用Swagger调试WebApi
C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...
- 同时上传参数及图片到 Web Api
方法一:利用 FormData JS: function uploadFileAndParam() { var url = "http://localhost:42561/api/uploa ...
- Web API接口之FileReader
Web API接口之FileReader *:first-child { margin-top: 0 !important; } body>*:last-child { margin-botto ...
随机推荐
- 连接池技术 Connection Pooling
原创地址:http://www.cnblogs.com/jfzhu/p/3705703.html 转载请注明出处 和数据库建立一个物理连接是一个很耗时的任务,所以无论是ADO.NET还是J2EE都提供 ...
- flex 阅读器
遇到很多的困难 首先是 pdf2swf 而后又下载swftools 而后有swfcombine.exe 让制作的swf 文字可选? —— 这应该是很常见的需求啊! 可是我搜索来搜索去都找不到... 搜 ...
- swift 加载 storyboard 里的UIViewController
let storyBoard:UIStoryboard! = UIStoryboard(name: "Main", bundle: nil) let deskVC:DeskView ...
- WebApi系列~StringContent参数需要添加MetaType对象
回到目录 对于api调用已经很多见了,在客户端去post一个请求到API服务端也是经常见到,但有时不注意,可能会引起一些问题,如为一个HttpContent参数进行赋值时,如果使用StringCont ...
- 理解nginx的配置
Nginx配置文件主要分成四部分:main(全局设置).server(主机设置).upstream(上游服务器设置,主要为反向代理.负载均衡相关配置)和 location(URL匹配特定位置后的设置) ...
- 带你走近AngularJS - 体验指令实例
带你走近AngularJS系列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自定义指令 ------------- ...
- java的五种数据类型解析
不知道大家对java的简单数据类型是否了解,下面针对Java的五种类型简单数据类型表示数字和字符,进行详细的讲解和分析. 一.简单数据类型初始化 在Java语言中,简单数据类型作为类的成员变量声明时自 ...
- mac本用WTG(Windows To Go)安装Win10到移动硬盘
准备工作: 一个空的 USB 3.0 移动硬盘(在安装 WTG 时候会将这个硬盘清空重新并分区,注意备份好数据.USB 3.0 的优盘是不行的,即使安装成功,系统的运行速度会奇慢) 原版Windows ...
- CSS层叠
前面的话 层叠样式表CSS最基本的一个特性就是层叠.冲突的声明通过层叠进行排序,由此确定最终的文档表示.而这个过程的核心就是选择器及其相关声明的特殊性.重要性.来源及继承机制.本文将详细介绍CSS层叠 ...
- Bmob基础
BaaS是指专为移动应用开发者提供整合云后端的服务.开发者无需过多研究服务器端程序,而只需调用云计算平台提供的API,使用相应SDK,就能迅速完成数据存储.账户管理.消息推送.社交网络整合等功能.本文 ...