【问题标题】:Vis.js dual y axis data range issueVis.js双y轴数据范围问题
【发布时间】:2016-09-13 07:37:11
【问题描述】:

<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 开始。

对不起我的英语。

【问题讨论】:

    标签: javascript graph vis.js


    【解决方案1】:

    似乎这个问题出现在 vis.js 版本 4.13.0 以后。 双 y 轴在 4.12.0 版本中按预期工作。

    【讨论】:

      猜你喜欢
      • 2020-04-05
      • 2013-04-29
      • 1970-01-01
      • 2022-10-23
      • 2018-04-01
      • 2017-01-13
      • 2018-10-09
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多