zoukankan      html  css  js  c++  java
  • Highcharts动态获取值

    <script type="text/javascript">
            $(document).ready(function (){
            var options = {
                    chart: {
                        renderTo: 'container',
                        defaultSeriesType: 'spline', //图表类型 line, spline, area, areaspline, column, bar, pie , column,scatter
                        inverted: false //左右显示,默认上下正向。假如设置为true,则横纵坐标调换位置
                    },
                    xAxis: {
                       categories:[],
                        title: {text: '时间'}  //x轴坐标标题  labels:纵柱标尺
                    },
                    yAxis: {
                        title: {text: '点击量'},  //Y轴坐标标题  labels:纵柱标尺
                        min:0
                    },
                    tooltip: {
                        formatter: function() {
                            //当鼠标悬置数据点时的格式化提示
                            return '总人数:' + Highcharts.numberFormat(this.y, 1)+'人<br/>当前时间:'+ this.x ;
                        }
                    },
                    credits: {
                        enabled: false
                    },
                    plotOptions: {
                        column: {
                            pointPadding: 0.2,  //图表柱形的
                            borderWidth: 0      //图表柱形的粗细
                        },bar: {
                            dataLabels: {
                                enabled: false
                            }
                        }
                    },
                    title: { text: '指定时间点击量统计图'}, //图表主标题
                 series:[]
                };
                 $("#btn").click(function(){
                   $.post("/tgSpreadServlet",{page:"dayget",sdate:$("#sdate").val(),edate:$("#edate").val(),surl:$("#sUrl").val()},function(data){
                  var sd=$("#sdate").val();
                   var ed=$("#edate").val();
                   //计算相差天数
                   var datediff=DateDiff(sd, ed);
                   for(var i=0;i<datediff;i++){
                     var s=AddDays(sd,i);
                     options.xAxis.categories.push(s);
                   }
                  data=eval("("+data+")");
                  options.series.push(data);
                  var chart=new Highcharts.Chart(options);
                  });
                });
                          
            });

     </cript>

  • 相关阅读:
    微信小程序学习随笔
    SqlServer索引假脱机的解决
    web服务器出现大量CLOSE_WAIT连接的前因后果
    SqlServer和mysql字段拼接方法
    使用beego创建员工加班调休系统
    在c#程序中初步使用redis
    使用golang实现批量发送面试邀请邮件
    记c# rabbitmq的使用
    项目中使用mongodb的尝试
    手机集成支付宝支付功能的注意事项
  • 原文地址:https://www.cnblogs.com/nickhan/p/4221791.html
Copyright © 2011-2022 走看看