zoukankan      html  css  js  c++  java
  • ECharts 图表导出

    Echarts图形是由Javascript亲自在前端网页上绘制的

    1.用ECharts配置项手册中的toolbox.feature.saveAsImage

    toolbox: {
      show: true,
      feature: {
        saveAsImage: {
        show:true,
        excludeComponents :['toolbox'],
        pixelRatio: 2
        }
      }
    }
    //写在option中,这样会在图形右上角产生一个保存为图片的标识,点击即可下载图片,这种方法试用于网站点击保存的需求

    2.用ECharts实例方法getImage(这种方法得到的picInfo为[object HTMLImageElement],无法通过Ajax传递到后台处理,只能用于显示)

    这个功能在ECharts3中好像已经舍弃,作者用ECharts3没有出现任何效果,换成ECharts2的js文件才可以运行

    myChart.setOption(option);
    var picInfo = myChart.getImage();
    
    //用来展示是否成功
    onload=function f(){
      document.getElementById("pic").appendChild(picInfo);
      //document.getElementById("pic").innerHTML = picInfo;
    }

    3.用ECharts实例方法getDataURL(实现图片自动保存)

    myChart.setOption(option);
    var picInfo = myChart.getDataURL();
    
    //getDataURL仍然要放在setOption方法生成一个简单的图形之后,现在我们得到的picInfo是一串base64信息,我们可以将picInfo用Ajax传递到后台处理

    4.后台保存图片

    方法1.参考:https://docs.microsoft.com/zh-cn/dotnet/api/system.drawing.image.save?view=netframework-4.7.2#System_Drawing_Image_Save_System_String_(需要版本要求较高)

    方法2:

    /// <summary>
            /// 无损保存图片
            /// </summary>
            /// <param name="imgResult">图片</param>
            /// <param name="Path">保存的路径</param>
            /// <param name="ImageType">图片的类型,image/jpeg,image/png,image/gif,image/tiff,image/bmp</param>
            /// <returns></returns>
            public bool SaveImage(Image imgResult, string Path, string ImageType)
            {
                EncoderParameter p;
                EncoderParameters ps;
                try
                {
                    ps = new EncoderParameters(1);
    
                    p = new EncoderParameter(System.Drawing.Imaging.Encoder.Quality, 100L);
                    ps.Param[0] = p;
    
                    ImageCodecInfo ii = GetCodecInfo(ImageType);
                    imgResult.Save(Path, ii, ps);
                    imgResult.Dispose();
                }
                catch (Exception ex)
                {
                    return false;
                }
                return true;
            }
    
            /// <summary>
            /// 获取图片的编码类型
            /// </summary>
            /// <param name="mimeType"></param>
            /// <returns></returns>
            public ImageCodecInfo GetCodecInfo(string mimeType)
            {
                ImageCodecInfo[] CodecInfo = ImageCodecInfo.GetImageEncoders();
                foreach (ImageCodecInfo ici in CodecInfo)
                {
                    if (ici.MimeType == mimeType) return ici;
                }
                return null;
            }

     参考:https://www.jianshu.com/p/f5359864fa4f

  • 相关阅读:
    正则表达式收藏
    c#mvc实现登录
    jQuery获取URL中的参数
    TortoiseSVN新人使用指南
    CheckBox获取一组及全选
    day45
    day44
    day43
    day43
    day42
  • 原文地址:https://www.cnblogs.com/zhang1f/p/11093779.html
Copyright © 2011-2022 走看看