结合散射和customBars在Dygraphs

我试图建立一个dygraphs 2系列的一种类型：分散另一种类型：errorBars但看起来它只能显示任意一个：结合散射和customBars在Dygraphs

这是我的代码：

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" src="dygraph.js"></script> 
<link rel="stylesheet" src="dygraph.css" /> 
</head> 
<body> 

<div id="container" style="width:1000px; height:600px;"></div> 
<script type="text/javascript"> 

new Dygraph(
document.getElementById("container"), 
    [ 
     [new Date("2016/2/3"), [1,3,6], [4]], 
     [new Date("2016/3/3"), [1,3,6], [3]], 
     [new Date("2016/4/3"), [1,3,6], [1]], 
     [new Date("2016/5/3"), [1,3,6], [2]], 
     [new Date("2016/6/3"), [1,3,6], [6]], 
     [new Date("2016/7/3"), [1,3,6], [5]] 
    ], 
{ 
    labels: [ "Date", "SD" , "Scatter"], 
    showRangeSelector: true, 
    customBars: true, 
    drawPoints: true, 
    series: { 
     "SD" : { 

     }, 
     "Scatter" : { 
      customBars: false, 
      strokeWidth: 0.0 
     } 
    }, 
    includeZero: true 

} 
); 
</script> 
</body> 
</html>

如果customBars被注释掉，它会显示散点图。如果不是，它显示自定义栏。从来没有。这里是picture

这里是JSfiddle

任何帮助将不胜感激！谢谢！

来源

2017-04-18 Justine

嗨@Justine，我不能运行的jsfiddle为引用库未设置dygraphs。你正在使用哪个版本？您能否修复JSfiddle以便能够运行您的示例。问候 –

好吧，我已经添加了外部资源https://cdnjs.cloudflare.com/ajax/libs/dygraph/2.0.0/dygraph.css和https://cdnjs.cloudflare.com/ajax/libs/dygraph/ 2.0.0/dygraph.js，它现在正在工作。我会尽力找到一个解决方案;） –

我不确定是否可以将自定义条形图与非自定义条形图混合在一起。但我已经找到了解决您的问题的下一个解决方案。为什么不将自定义栏作为没有自定义栏区的自定义栏创建。下面我给你解决问题。

我希望这可能是你的解决方案;）

new Dygraph(
 
    document.getElementById("container"), 
 
\t [ 
 
\t  [new Date("2016/2/3"), [1,3,6], [4,4,4]], 
 
\t  [new Date("2016/3/3"), [1,3,6], [3,3,3]], 
 
\t  [new Date("2016/4/3"), [1,3,6], [1,1,1]], 
 
\t  [new Date("2016/5/3"), [1,3,6], [2,2,2]], 
 
\t  [new Date("2016/6/3"), [1,3,6], [6,6,6]], 
 
\t  [new Date("2016/7/3"), [1,3,6], [5,5,5]] 
 
\t ], 
 
\t { 
 
     labels: [ "Date", "SD" , "Scatter"], 
 
     showRangeSelector: true, 
 
     customBars: true, 
 
     drawPoints: true, 
 
      
 
\t \t \t series: { 
 
\t \t \t \t "SD" : { 
 
\t \t \t \t \t 
 
\t \t \t \t }, 
 
\t \t \t \t "Scatter" : { 
 
\t \t \t \t \t strokeWidth: 1 
 
\t \t \t \t } 
 
\t \t \t }, 
 
\t \t \t includeZero: true 
 
\t \t \t 
 
\t \t } 
 
\t);

<link href="https://cdnjs.cloudflare.com/ajax/libs/dygraph/2.0.0/dygraph.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/dygraph/2.0.0/dygraph.js"></script> 
 
<div id="container" style="width:1000px; height:600px;"></div>

来源

2017-04-18 12:42:50

您无法为每个系列设置'customBars'（即数据格式），这是正确的。您的解决方法是最佳选择。见https://github.com/danvk/dygraphs/issues/319 – danvk

明白了！谢谢soooooo多！：D – Justine

欢迎@Justine。如果你认为答案是正确的，你会如此投票并将其标记为正确的？谢谢！ –

结合散射和customBars在Dygraphs

回答

相关问题