2017-04-19 3 views
0

Angenommen, ich habe zwei Datensätze, data1 und data2, aber ich möchte Punkte/Kreise auf data2 verbergen. Wie kann ich es tun?c3.js: Wie kann man Punkte für bestimmte Datensätze ausblenden?

var chart = c3.generate({ 
    data: { 
     columns: [ 
      ['data1', 30, 200, 100, 400, 150, 250], 
      ['data2', 50, 20, 10, 40, 15, 25] 
     ] 
    } 

}) 
+0

Eine ähnliche Frage bereits [hier] gestellt (https://stackoverflow.com/questions/27116623/c3-js-show-hide-points-undependently-for-a-data-series), sollte es Ihr Problem lösen . –

Antwort

0

Nicht eine js Lösung, sondern für alle Punkte c3 fügt eine Klasse auf dem Element-Wrapper-Gruppe als c3-circles-data1c3-circles-data2 für die jeweiligen Etiketten, die Sie für Sie Daten mit dem Label Daten2 verwenden können, die Sie in CSS-Anzeige keine verlängern wie:

#chart .c3-circles-data2{ 
    display:none 
} 

Probe FIDDLE

+0

Danke. Mein Problem wurde gelöst. –

2

Probieren Sie diese mit CSS: Source Here. c3-circles-data2 und c3-circles-data1 sind die Klassen, die von c3 für die angegebenen Schlüssel wie data1, data2 generiert werden.

var chart = c3.generate({ 
 
    data: { 
 
     columns: [ 
 
      ['data1', 30, 200, 100, 400, 150, 250], 
 
      ['data2', 50, 20, 10, 40, 15, 25] 
 
     ] 
 
    } 
 
})
#chart .c3-circles-data2 { 
 
    display: none; 
 
}
<link href="https://unpkg.com/[email protected]/c3.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> 
 
<script src="https://unpkg.com/[email protected]/c3.js"></script> 
 
<div class='chart'> 
 
<div id='chart'></div> 
 
</div>

HINWEIS: falls in Sie Punkte sowohl aus der Serie entfernen möchten, können Sie

point: { show: false }

nach Daten hinzufügen.

+0

Danke .. Es hat geholfen. –