function chartData() {
var app_id = $('.app_id').attr('app_id');
var gener_id = $('.gener_id').attr('gener_id');
var pop_id = $('.listType li.active').attr('pop_id');
var date = $(".realTimeDate li.active span").attr("date");
$.ajax({
url:'/app/rankChange',
type:'post',
data:{
app_id:app_id,
gener_id:gener_id,
pop_id:pop_id,
date:date,
},
success:function (data) {
chartLoad(data.data)
},
dataType:'json'
})
} var arr = [];
var arr1 = [];
function chartLoad(data){
var gener_name = $(".gener_id").text();
console.log(data); for(var i=0;i<data.rank_app_list.length;i++){
console.log(data.rank_total_list[i]);
arr.push(data.rank_app_list[i]);
i = i+2;
}
for(var k=0;k<data.rank_total_list.length;k++){
console.log(data.rank_total_list[k]);
arr1.push(data.rank_total_list[k]);
k = k+2;
}
$('#container').highcharts({
//tooltip控制折线图
tooltip:{
shared: true,//控制多个产品共同显示内容
crosshairs: true,//让y轴坐标显示
},
credits: {
enabled: false//去掉链接
},
exporting:{
enabled:false //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为true
},
//折线图颜色
colors:['#33CC99','#FF6565'],
title: {
text: '排名趋势'
},
xAxis:{
// gridLineWidth : 1
// inverted: Boolean
categories: ["0:00","3:00","6:00","9:00","12:00","15:00","18:00","21:00","00:00"],
showFirstLabel: true,
reversed: false
},
yAxis:[
{
title: {
text: '应用榜排名'
},
reversed: true
},
{
title: {
text: gener_name+'排名'
},
reversed: true,
opposite: true
}
],
legend: {
layout: 'vertical',
layout: 'horizontal',
align: 'center',
verticalAlign: 'bottom',
x: 0,
y: 0
},
plotOptions: {
series: {
label: {
connectorAllowed: true,
},
pointStart: 1,//时间刻度值 X轴坐标
}
},
series: [{
yAxis:0,
name: '应用总榜',
data: arr1
}, {
yAxis:1,
name: gener_name,
data: arr
}],
responsive: {
rules: [{
condition: {
maxWidth: 300
},
chartOptions: {
legend: {
layout: 'horizontal',
align: 'center',
verticalAlign: 'bottom'
}
}
}]
}
});
}
chartData()

  

highcharts控制X刻度值整数调整的更多相关文章

  1. CSS 控制table 滑动及调整列宽等问题总结

    一. 通过css控制table y方向上滚动 html中没有滚动条,可以根据overflow属性的scroll来对table显示不完全的内容进行滚动. 只是y方向上滚动,很简单,只要设置div的hei ...

  2. 利用PhantomJS搭建Highcharts export服务

    利用PhantomJS搭建Highcharts export服务 一直在使用Highcharts做web图表的展示, 但是当发送定时的报表邮件的遇到了这个问题. 为了保证邮件图表和web页图表样式一致 ...

  3. JS数值输入控制

    在html文本框录入数值时,可用如下方法进行控制判断. 整数:<input type="text" name="aaa" onkeypress=" ...

  4. C#控制文本框(TextBox)只能输入正数,负数,小数

    由于项目需要,需要写一个TextBox文本框,此文本框需要满足:只能输入正数,负数和小数.比如:3,0.3,-4,-0.4等等.        在网上找了许多正则表达式都不好用,由于本人又对正则表达式 ...

  5. 如何在 HTML 中调整图像大小?

    了解在 HTML 中调整图像大小的不同技术.何时应避免在浏览器端调整大小,以及在 Web 上操作和提供图像的正确方法. 如果您的图像不适合布局,您可以在 HTML 中调整其大小.在 HTML 中调整图 ...

  6. MPlayer

    名称   mplayer − 电影播放器 mencoder − 电影编解码器 概要   mplayer [选项] [文件|URL|播放列表|−] mplayer [选项] 文件1 [指定选项] [文件 ...

  7. .Net23种设计模式

    C#常见的设计模式 一.概要: 模式分为三种,设计模式.体系结构模式与惯用法.其中惯用法是一种语言紧密相关的模式,例如,定界加锁模式其实是一种惯用法. 在C#项目开发过程中,很多情况下您已经使用了某些 ...

  8. Introducing DataFrames in Apache Spark for Large Scale Data Science(中英双语)

    文章标题 Introducing DataFrames in Apache Spark for Large Scale Data Science 一个用于大规模数据科学的API——DataFrame ...

  9. Java之BigDecimal

    转载请注明源出处:http://www.cnblogs.com/lighten/p/6963836.html 1.前言 编程人员都应该知道计算机计算浮点数是不精确的,结果是近似数值,当然具体值还是和计 ...

随机推荐

  1. Oracle中的rowid rownum

    1. rowid和rownum都是虚列 2. rowid是物理地址,用于定位oracle中具体数据的物理存储位置 3. rownum则是sql的输出结果排序,从下面的例子可以看出其中的区别. rowi ...

  2. docker for windows 中挂载文件到容器

    docker for windows版本: 宿主机:windows10 场景: 容器是基于microsoft/donet的webapi 想把宿主机的文件挂载到容器中,比方说:a.txt 命令如下: d ...

  3. 【bzoj2882】工艺

    题目描述: 小敏和小燕是一对好朋友. 他们正在玩一种神奇的游戏,叫Minecraft. 他们现在要做一个由方块构成的长条工艺品.但是方块现在是乱的,而且由于机器的要求,他们只能做到把这个工艺品最左边的 ...

  4. 01 Netty是什么?

    01 Netty是什么? IO编程 我们简化下场景:客户端每隔两秒发送一个带有时间戳的 "hello world" 给服务端,服务端收到之后打印. 为了方便演示,下面例子中,服务端 ...

  5. sh_01_判断年龄

    sh_01_判断年龄 # 1. 定义一个整数变量记录年龄 age = 15 # 2. 判断是否满了18岁 if age >= 18: # 3. 如果满了18岁,可以进网吧嗨皮 print(&qu ...

  6. 【PowerOJ1744&网络流24题】方格取数问题(最小割)

    题意: n,m<=30 思路: [问题分析] 二分图点权最大独立集,转化为最小割模型,从而用最大流解决. [建模方法] 首先把棋盘黑白染色,使相邻格子颜色不同,所有黑色格子看做二分图X集合中顶点 ...

  7. Http请求状态大全

    一.HTTP状态码分类 HTTP状态码由三个十进制数字组成,第一个十进制数字定义了状态码的类型,后两个数字没有分类的作用.HTTP状态码共分为5种类型: 分类 分类描述 1** 信息 服务器收到请求, ...

  8. 使用chooseImage上传图片,不压缩,使用原图

    参考文章: https://help.aliyun.com/document_detail/92883.html

  9. IDEA插件之自动查找bug工具

    打开idea 插件搜索界面 输入 FindBugs-IDEA,安装完成后重启,选中要查找的包,右键找到对应的 FindBugs就可以开始进行自动扫描了

  10. vue-router 2.0 跳转之router.push()

    router.push(location) 除了使用 创建 a 标签来定义导航链接,我们还可以借助 router 的实例方法,通过编写代码来实现. router.push(location) 想要导航 ...