2016-09-13 57 views
1

Vis.js双y轴上的数据范围问题

<head> 
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type"> 
    <meta content="utf-8" http-equiv="encoding"> 
    <title>Graph2d | Basic Example</title> 

    <style type="text/css"> 
    body, html { 
     font-family: sans-serif; 
    } 
    </style> 

    <link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.15.1/vis.min.css" rel="stylesheet" type="text/css" /> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.15.1/vis.min.js"></script> 

<body> 
<h2>Graph2d | Basic Example</h2> 
<br /> 
<div id="visualization"></div> 
<script type="text/javascript"> 
    var container = document.getElementById('visualization'); 
    var names = ['graph1', 'graph2']; 
    var groups = new vis.DataSet(); 
    groups.add({ 
     id: 0, 
     className: '', 
     options: { 
      yAxisOrientation: 'left', 
      drawPoints: { 
       style: 'point' // square, circle 
      } 
     }}); 
    groups.add({ 
     id: 1, 
     className: '', 
     options: { 
      yAxisOrientation: 'right', // right, left 
      drawPoints: { 
       style: 'circle' // square, circle 
      } 
     }}); 

    var items = [ 
    {x: new Date(1469626499397), y: 110, group: 0}, 
    {x: new Date(1469626499497), y: 125, group: 0}, 
    {x: new Date(1469626499597), y: 130, group: 0}, 
    {x: new Date(1469626499697), y: 210, group: 0}, 
    {x: new Date(1469626499897), y: 115, group: 0}, 
    {x: new Date(1469626499997), y: 130, group: 0}, 
    {x: new Date(1469626499397), y: 1, group: 1}, 
    {x: new Date(1469626499597), y: 2, group: 1}, 
    {x: new Date(1469626499697), y: 3, group: 1}, 
    {x: new Date(1469626499797), y: 10, group: 1}, 
    {x: new Date(1469626499897), y: 15, group: 1}, 
    {x: new Date(1469626499997), y: 10, group: 1} 
    ]; 

    var dataset = new vis.DataSet(items); 
    var options = { 
    height:500, 
    //graphHeight:1500, 
      drawPoints: true, 
     dataAxis: { 
      right: { 
       range: {min:-1, max:20} 
      }, 
      left: { 
       range: {min:100, max:250} 
      }, 
      icons:true 
     }, 
    }; 
    var graph2d = new vis.Graph2d(container, dataset, groups, options); 
</script> 
</body> 
</html> 

http://i.stack.imgur.com/5Ug11.png 在图像中,右侧y轴的未显示网格线小于5和大于12

我面对这里的问题是右侧y轴没有适当地采集数据范围,并且即使右侧数据范围以最小值1和最大值15开始也隐藏图形。

对不起,我的英语。

回答

1

看起来像这个问题在vis.js版本4.13.0以上看到。 双Y轴正如期待在4.12.0版本中发挥作用。