highcharts 开启panning后还是不支持移动端滑动的浏览图表吗?
highcharts
和highstocks
开启 panning 后还是不支持移动端滑动浏览并且highstocks
的导航条和滚动条在移动端也同样只能识别点击,不能滑动。
红色框:图表内容;希望能直接来回滑动红框内区域,浏览其余数据.
蓝色框:导航条.
绿色框:滚动条.
html代码:
<div id="container"></div>
<script type="text/javascript" src="/public/javascripts/jquery.min.js" charset="utf-8"></script>
<script src="/public/javascripts/highstock.js"></script>
js代码:
$("#container").highcharts({
chart: {
type: 'line',
style: {
fontFamily: '微软雅黑'
},
panning: true,
zoomType: null,
pinchType: null
},
loading:{
hideDuration: 1000,
showDuration: 1000
},
title: {
text: '当月销售额明细',
floating: true,
align: 'left',
x: 0,
y: 20,
style: {
"fontSize": ".2150rem",
color: '#1d1d26'
}
},
tooltip: {
shared: true,
enabled:false
},
rangeSelector : {
selected : 1
},
scrollbar: {
enabled: true
},
navigator : {
enabled : true
},
plotOptions: {
series: {
dataLabels: {
align: 'center',
enabled: true
}
}
},
legend: {
align: 'right',
verticalAlign: 'top',
x: 0,
y: 20
},
yAxis: {
allowDecimals: false,
title: {
text: null
}
},
xAxis: {
type:'linear',
lables:{
step:2,
staggerLines: 1
},
allowDecimals: false,
// categories: [1, 2, 3, 4, 5, 6, 7],
crosshair: false,
max:3
},
series: [{
name: '销售额(万元)',
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6]
}]
});
示例:http://code.hcharts.cn/line01...
移动端示例:http://code.hcharts.cn/line01...
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
默认是需要两根手指拖动,设置一根手指的方法followTouchMove:false
我也正在尝试这个方法,还没测试,你可以看看是不是这个问题