2017-05-16 4 views
0

Ich verwende Dygraph 2.0. Ich habe eine csv mit wiederholten x-Werten und wenn ich setAnnotations Funktion mit diesem x-Wert Zeichnung wiederholt Annotation aufrufen.Dygraph setAnnotations mit wiederholten x Werten

Beispiel CSV:

x,val1,val2,val3 
0,1,1,3 
1,2,3,5 
1,3,3,3 
2,4,5,5 
3,1,2,2 

Wenn I Annotation festgelegt auf x = 1, 2 dygraph zeichnen Annotation. Ich muss bekannt, ob eine Möglichkeit gibt, die sagen dygraph, dass nur eine Anmerkung

+0

Könnten Sie ein jsfiddle mit Ihrem Code hochladen? –

+0

Dies ist das Beispiel in jsfiddle: http://jsfiddle.net/maikelf/wn43LLv7/ beachten Sie, dass zwei Annotation erscheint, denn x = 1 ist zweimal bei Daten – maikelm

+0

Haben Sie gedacht, wenn es Sinn hat? Ich habe festgestellt, dass die Graphen nicht gut Plot sind, wenn es zwei Punkte in der gleichen x-Achse gibt, weil die Linien aus dem zweiten Punkt, der nicht die Wahrheit ist. –

Antwort

2
Zeichnung

Ich bin sicher, es ist nicht die beste Option, aber jetzt ist die Lösung, die ich herausgefunden haben und vielleicht klappt es für Sie

http://jsfiddle.net/wn43LLv7/1/

$(document).ready(function() { 
 
    
 
var csv = [[0,1,1,2],[1,2,3,3],[1.0001,4,4,4],[2,2,2,2]]; 
 

 
    var g = new Dygraph(
 
     document.getElementById('graph'), 
 
     csv, 
 
     { 
 
      labels: ['x', 'val1', 'val2', 'val3' ] 
 
     } 
 
    ); 
 
g.ready(function() { 
 
    g.setAnnotations([ 
 
    { 
 
     series: "val2", 
 
     x: "1", 
 
     shortText: "A" 
 
    } 
 
    ]); 
 
    }); 
 
    })
.thinborder { border-width: 1px; border-spacing: 0px; border-style: solid; border-color: black; border-collapse: collapse; } 
 

 
.thinborder td, #workarea #independent-series .thinborder th { border-width: 1px; padding: 5px; border-style: solid; border-color: black; } 
 

 
.dygraph-annotation 
 
{ 
 
     font-size: 14px; 
 
    left: 217.5px; 
 
    top: 79.1111px; 
 
    width: 16px; 
 
    height: 16px; 
 
    position: absolute; 
 
    background-color: red; 
 
    border-color: rgb(64, 0, 128); 
 
    color: white !important; 
 
    padding: 5px; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://dygraphs.com/dygraph.js"></script> 
 
<div id="graph" style="float: right; margin-right: 50px; width: 400px; height: 300px;"></div>

+0

nett, ist ein guter Trick. Die perfekte Situation ist, dass kein x-Wert wiederholt wird. Aber jetzt habe ich diese Situation. Danke, löst mein Problem – maikelm

Verwandte Themen