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 ...
随机推荐
- 如何在 ASP.NET MVC 中集成 AngularJS(1)
介绍 当涉及到计算机软件的开发时,我想运用所有的最新技术.例如,前端使用最新的 JavaScript 技术,服务器端使用最新的基于 REST 的 Web API 服务.另外,还有最新的数据库技术.最新 ...
- WINFrom Excal 数据导入数据库
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- 程序员DNS知识指南
本次内容比较hardcore,非科班出身可能会有理解障碍,可以考虑不用挣扎,直接放弃.毕竟普通驾驶员是不需要理解内燃机原理和曲轴如何做功的,所谓术业有专攻也,能看完的不是同行就是真爱~ 引 DNS对于 ...
- 关于js内部运行机制的一本好书
读<单页Web应用一书>,第二章讲了js内部运行机制,感觉棒极了.之前读<你不知道的js>,看的云里雾里,似懂非懂.没想到单页Web一书将此内容讲的如此通俗易懂,好多困惑已久的 ...
- Java连接Oracle数据库开发银行管理系统【一、需求篇】
此系统开发共分为三篇完成. 第一篇[需求篇]:效果展示图,也就是需求部分的展示 第二篇[设计篇]:需求分析和类,接口的设计 第三篇[实现篇]:具体代码实现
- H5 调用摄像头
WebRTC(Web Real-Time Communication,网页实时通信),是一个支持网页浏览器进行实时语音对话或视频对话的API. 1.getUserMedia 要播放摄像头的影像,首先需 ...
- EF架构~通过EF6的DbCommand拦截器来实现数据库读写分离
回到目录 前几天看了一个基于sqlserver的负载均衡与读写分离的软件Moebius,实现的方式还是不错的,这使得用sqlserver数据库的同学时有机会对数据库进行更有效的优化了
- [Spring框架]Spring AOP基础入门总结一.
前言:前面已经有两篇文章讲了Spring IOC/DI 以及 使用xml和注解两种方法开发的案例, 下面就来梳理一下Spring的另一核心AOP. 一, 什么是AOP 在软件业,AOP为Aspect ...
- js 四舍五入函数 toFixed(),小数位数精度
js的加减乘除有时得到的结果的小数的位数非常大,这种结果非常难以读取,例如某两个数相乘得到的结果是:1.3921000000000001 这种结果小数的位数有点多,一般需要的结果是四舍无入的 1.39 ...
- 【WP 8.1开发】手机客户端应用接收推送通知
上一篇文章中,已经完成了用于发送通知的服务器端,接下来我们就用这个服务端来测试一下. 在开始测试之前,我们要做一个接收通知的WP应用. 1.启动VS Express for Windows,新建项目, ...