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 ...
随机推荐
- location.href 一个小注意
项目里有location.href = '#......'这一类的代码,一直以为某处做了特殊处理,变成前面有主机名的URL,看架构源码也没找到这种处理.今天灵光一现,自己是被JS高程将解位置方法那节给 ...
- Post方式的Http流请求调用
HttpRequest公共类: public static class HttpRequestAction { /// <summary> /// 发送http请求并返回响应 /// &l ...
- php版的redis操作库predis操作大全
转载于:http://www.itxuexiwang.com/a/shujukujishu/redis/2016/0216/146.html predis是php连接redis的操作库,由于它完全使用 ...
- “胡”说IC——菜鸟工程师完美进阶
“胡”说IC——菜鸟工程师完美进阶(数十位行业精英故事分享,顶级猎头十多年来经验总结,对将入或初入IC电子业“菜鸟”职业发展.规划的解惑和点拨.) 胡运旺 编著 ISBN 978-7-121-22 ...
- JS 内置对象
内置对象的定义:有ECMAScript实现提供的.不依赖与宿主环境的对象,在ECMAScript运行之前就已经创建好的对象就叫做内置对象. 就是说,是不需要我们开发人员先是的实例化对象就能够调用和运行 ...
- 对于System.Net.Http的学习(一)——System.Net.Http 简介
System.Net.Http 是微软推出的最新的 HTTP 应用程序的编程接口, 微软称之为“现代化的 HTTP 编程接口”, 主要提供如下内容: 1. 用户通过 HTTP 使用现代化的 Web S ...
- jQuery_03之事件、动画、类数组操作
一.事件: 1.模式触发事件: ①DOM:elem.onXXX();只能触发直接用onXXX绑定的事件处理函数:用addEventistener添加的事件监听无法模拟出发触发: ②jQuery:$ ...
- git查看日志
git查看日志 git log -n 显示前N条记录 git log -3 退出log命令 直接输入: q git log --stat -n 显示提交的文件的简要的修改统计 $ git log -- ...
- PhoneGap介绍及简单部署
一.什么是PhoneGap: PhoneGap是一个自由开放源码的开发工具和框架,允许利用HTML + JavaScript + CSS的强大功能在多个手机平台上开发程序,开发出来的程序经过在各自的平 ...
- 邻接表无向图(二)之 C++详解
本章是通过C++实现邻接表无向图. 目录 1. 邻接表无向图的介绍 2. 邻接表无向图的代码说明 3. 邻接表无向图的完整源码 转载请注明出处:http://www.cnblogs.com/skywa ...