zoukankan      html  css  js  c++  java
  • python+selenium自动化报告HTMLTestRunner增加饼图展示

      之前在上一篇随笔中说了怎么在HTMLTestRunner报告中增加截图功能,现在再结合上一篇随笔再在HTMLTestRunner报告中增加饼图,最后结果展示如下:

     具体步骤如下:

    1、在HTMLTestRunner文档中找到以下位置,再添加上<div id='container_tu' style="height: 215px; 68%%;float: left;"></div>

     2、再找到HTMLTestRunner的以下位置,加上float: left;

    3、再找到以下位置,添加:

    #container_tu{
    height: 150px;
    68%;
    float: left;
    }

     4、把以下代码放到HTMLTestRunner中的REPORT_TMPL的最后面如下

    <!-- /*新增部分Start*/ -->

    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
    <script type="text/javascript">
    var dom = document.getElementById("container_tu");
    var myChart = echarts.init(dom);
    var app = {};

    app.title = '环形图';

    var option = {
    tooltip: {
    trigger: 'item',
    formatter: "{a} <br/>{b}: {c} ({d}%%)"
    },
    color:['red','#c60','#6c6','#bbe2e8'],
    legend: {
    orient: 'horizontal',
    x: 'left',
    data: ['失败', '未通过', '通过']
    },
    series: [{
    name: '',
    type: 'pie',
    radius: ['30%%', '70%%'],
    avoidLabelOverlap: false,
    label: {
    normal: {
    show: false,
    position: 'center'
    },
    emphasis: {
    show: true,
    textStyle: {
    fontSize: '30',
    fontWeight: 'bold'
    }
    }
    },
    labelLine: {
    normal: {
    show: false
    }
    },
    data: [

    {
    value: %(error)s,
    name: '失败'
    },
    {
    value: %(fail)s,
    name: '未通过'
    },
    {
    value: %(Pass)s,
    name: '通过'
    },

    ]
    }]
    };
    if(option && typeof option === "object") {
    myChart.setOption(option, true);
    }
    </script>
    <!-- #/*新增部分End*/ -->
  • 相关阅读:
    时间戳(UnixTimestamp)与 《2038年问题》
    端口相关命令
    Ubuntu中的在文件中查找和替换命令
    A Reusable Aspect for Memory Profiling
    acc文件的运行
    A Reusable Aspect for Memory Allocation Checking
    ACC常用语句
    aspectC++常用命令
    c++调用DOS命令,不显示黑屏
    fopen文件目录问题
  • 原文地址:https://www.cnblogs.com/lldk/p/14147069.html
Copyright © 2011-2022 走看看