zoukankan      html  css  js  c++  java
  • highstock 的tooltip框里面的内容 保留两位小数的办法

    $("#flux_chart_container").highcharts('               
               },
               borderWidth : 1,
               borderRadius : 10,           
               spacingTop : 2,
    spacingBottom : 3,
    spacingLeft : 1,
    spacingRight : 3
    },
    credits:{
    enabled : false
    },
    title: {
    text: title + " 流量明细"
    },
    legend: {
    enabled: true,
    layout: 'vertical',
               labelFormatter: function() {
                if(this.name=='入流量'){
                   return this.name +' 均值:' + Highcharts.numberFormat(datas.avginput,2) + ' kbps 峰值:' + Highcharts.numberFormat(datas.maxinput,2) + ' kbps';
                   }else if(this.name=='出流量'){
                   return this.name +' 均值:' + Highcharts.numberFormat(datas.avgoutput,2) + ' kbps 峰值:' + Highcharts.numberFormat(datas.maxoutput,2) + ' kbps';
                   }else{
                   return this.name;
                   }
               }
           },
    /*xAxis: {
    categories : categories,
    labels: {
                   step: step,
                   staggerLines : 2
               }
    },*/
    yAxis: [{
    title: {
    text: "流量(kbps)"
    },
    tickPixelInterval:20,
    offset:90,
    labels: {
                   formatter: function() {
                       return Highcharts.numberFormat(this.value,2) +' kbps';
                   }
               },
    min:0
    }],
    plotOptions : {
    series : {
    marker: {
                            enabled: false
                            }
    }
    },
                pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                    '<td style="padding:0"><b>{point.y:.2f} kps</b></td></tr>',
                footerFormat: '</table>',
                shared: true,
                useHTML: true
    },
    series:[{name:'入流量',tooltip:{valueSuffix:'Kbps'},data : inputs},{name:'出流量',tooltip:{valueSuffix:'Kbps'},data : outputs}]
    //,{name:'入端口利用率',yAxis: 1,tooltip:{valueSuffix:'%'},data : intportur},{name:'出端口利用率',yAxis: 1,tooltip:{valueSuffix:'%'},data : outportur}

    });



    ========================================highchart的使用和对比=====================

    function initReport(chartId,chartTitle,chartCategories,chartY,chartSeries) {
    var chart = new Highcharts.Chart({
    chart: {
    renderTo: chartId,
    zoomType: 'x',
    style: {
    color: '#000000',
                   fontFamily: '楷体'
               }
    },
    title: {
    text: chartTitle,
    style: { 
                   fontWeight: 'bold'
               }
    },
    xAxis: {
    categories: chartCategories,
    labels: {
    rotation:340,
    y:35,
    style: {
                       color: 'black',
                       fontSize: 12,
                       fontFamily: '微软雅黑'
                   }
               }
    },
    yAxis: [{
    title: {
    text: "流量(kbps)"
    },
    tickPixelInterval:20,
    labels: {//highchart Y 轴保留两位小数点的办法
                   formatter: function() {
                       return Highcharts.numberFormat(this.value,2) +' kbps';
                   }
               },
    min:0
    }],
    tooltip: {
    crosshairs: [{color:'blue',dashStyle: 'dot'},{color:'blue',dashStyle: 'dot'}],
    shared: true
    },
    plotOptions : {
    column: {//控制柱状宽度
           pointPadding: 0.2,
           borderWidth: 0,
           pointWidth: 30
       },
    series : {
    marker: {
                            enabled: false
                            },
    cursor: 'pointer',
    point : {
    events : {
    click: function(event) {
    queryPortFlux(this.options.portid);
                       }
                   }
    }
    }
    },
    credits:{
    enabled : false
    },
    series: chartSeries,
    navigation: {
               buttonOptions: {
                   enabled: false
               }
            }
           });
    reportCharts.push(chart);
    }

  • 相关阅读:
    Java 将Clob字段转换成String字符串
    Java BigDecimal详解
    java循环创建对象应该在循环体内还是循环体外
    Java 通过身份证获取生日和性别
    Java将数据进行分组处理
    Java 2进制和16进制的转换
    Map-HashMap 与 IF 判断内存占用对比
    Groovy脚本-通用SQL开关
    Oracle用户、授权、角色管理
    【docker随笔系列】安装sqlserver
  • 原文地址:https://www.cnblogs.com/ZDPPU/p/5993776.html
Copyright © 2011-2022 走看看