• .net 下新版highcharts本地导出图片bug处理


    最近公司要用到highcharts这个插件来生成图表,所以我花了点时间研究了下。

        现在最新的版本是3.0.2,这js插件居多优点就不比多说了,demo官网上也很详细。但是优点不爽的地方是,导出图片这个功能是通过请求官网的服务器地址下载的,这个就有点不爽了,因为很多系统要求的环境是不联网就能使用的,本人英语很挫,开始不知道官网的下载页面,下面会提供第三方的解决办法,自己在Google大神上面找了很久,最后找到了一个外国人写的一Demo,Highcharts-export-module-asp.net-master.zip 。当时,心中窃喜,妈的踏破铁鞋无觅处,得来全不费工夫,果断下载,看效果。

       

        两个地方有点瑕疵。

            左上角那东西是什么玩意。

            我选择取消Tokyo的导出,居然还是有四条线。

        咋办?!不能用。

        先试试连官网导出有木有同样的问题,结果官网一切ok.

        然后Google下,没有发现有人遇到同样的情况。So…..自己分析。

    1. 先看看请求的数据是不是一样的,先用本地的导出服务,记录下请求的参数。
    2. 在把请求改成官网的地址,记录下参数,一对比,一样的。
    3. 既然参数一样,那就试试不同的情况,先把所有的线都导出,记录参数,然后去掉一根线,导出,记录下参数。

                                         这里发现了内容有些不一样:       

                                                   所有线导出,在svg这里xml里,有个 class="highcharts-series-group"的g 节点下面的子节点g 的属性 visibility="visible",而去掉一根线的话,这个值是hidden,ok这里的问题找到了,第三方的Demo对这个属性没有做区分处理。

        还有一个bug,经分析得知,那是属性class="highcharts-tooltip"的g节点,这个分析没有其他办法,只有一个个节点去删,然后保存看效果。

        OK!!!

        所有问题都已找到,下面要做的无非就是对xml做筛选,然后remove掉这几个特殊属性的节点,代码如下:

        在Tek4.Highcharts.Exporting. Exporter下的CreateSvgDocument

    方法中增加如下代码:

     1 XmlDocument xml = new XmlDocument();
     2 
     3             xml.LoadXml(this.Svg);
     4 
     5             XmlNodeList nodeListAllg = xml.GetElementsByTagName("g");
     6 
     7             Dictionary<int, XmlNode[,]> dic = new Dictionary<int, XmlNode[,]>();
     8 
     9             int i = 0;
    10 
    11             foreach (XmlNode xNod in nodeListAllg)
    12 
    13             {
    14 
    15                 i++;
    16 
    17                 XmlNode xmlvisibility = xNod.Attributes.GetNamedItem("class");
    18 
    19                 if (xmlvisibility != null && xmlvisibility.Value == "highcharts-series-group")
    20 
    21                 {
    22 
    23  
    24 
    25                     foreach (XmlNode xNod2 in xNod.ChildNodes)
    26 
    27                     {
    28 
    29                         i++;
    30 
    31                         XmlNode xmlvisibility1 = xNod2.Attributes.GetNamedItem("visibility");
    32 
    33                         if (xmlvisibility1 != null && xmlvisibility1.Value == "hidden")
    34 
    35                         {
    36 
    37                             XmlNode[,] xmln = new XmlNode[1, 2];
    38 
    39                             xmln[0, 0] = xNod;
    40 
    41                             xmln[0, 1] = xNod2;
    42 
    43                             dic.Add(i, xmln);
    44 
    45                         }
    46 
    47                     }
    48 
    49                 }
    50 
    51                 else if (xmlvisibility != null && xmlvisibility.Value == "highcharts-tooltip")
    52 
    53                 {
    54 
    55                     XmlNode[,] xmln = new XmlNode[1, 2];
    56 
    57                     xmln[0, 0] = xml.FirstChild;
    58 
    59                     xmln[0, 1] = xNod;
    60 
    61                     dic.Add(i, xmln);
    62 
    63                 }
    64 
    65  
    66 
    67             }
    68 
    69             foreach (KeyValuePair<int, XmlNode[,]> a in dic) {
    70 
    71                 a.Value[0, 0].RemoveChild(a.Value[0, 1]);
    72 
    73             }
    74 
    75  
    76 
    77             this.Svg = xml.OuterXml;
    78 
    79  
    View Code

    经测试,ok.

    不知道还有没有其他办法解决,如果有,请告之。

    刚开始研究highcharts 不知道支不支持在服务端传数据实体,直接在服务的生成图片。望大神赐教。

  • 相关阅读:
    tail,more查看日志(定点和翻页)
    Python:浅拷贝和深拷贝
    mybatis sql查子list
    mybatis在insert中获取到id
    mvn安装jar到本地仓库
    微信支付wxpay -- 移动端app第二章节 -- java 后端代码
    微信支付wxpay -- 移动端app第一章节 -- 注意点
    java字符串大小写转化
    Zxing图片右下角生成二维码
    switchTap、navigateTo、switchTap
  • 原文地址:https://www.cnblogs.com/youngerliu/p/3177252.html
Copyright © 2020-2023  润新知