0
Ich versuche NVDS.js für HTML eingerückten Baum zu verwenden, aber nichts rendert auf der Webseite. Unten ist der Code, den ich verwende. Bitte helfen Sie zu erkennen, ob es einen Fehler im Code oder etwas anderes gibt.NVD3.js eingerückten Baum Problem
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="novus-nvd3-05cfaaf/build/nv.d3.css" rel="stylesheet" type="text/css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.2/d3.min.js" charset="utf-8"></script>
<script src="novus-nvd3-05cfaaf/build/nv.d3.js"></script>
<style>
#chart {
width: 500px;
margin-left: 20px;
}
</style>
</head>
<body>
<div id="chart">
</div>
<script>
var chart;
nv.addGraph(function() {
\t chart = nv.models.indentedTree()
\t .tableClass('table table-striped')
\t .columns([
\t {
\t key: 'key',
\t label: 'Name',
\t showCount: true,
\t width: '75%',
\t type: 'text',
\t classes: function(d) { return d.url ? 'clickable name' : 'name' },
\t click: function(d) {
\t if (d.url) window.location.href = d.url;
\t }
\t },
\t {
\t key: 'type',
\t label: 'Type',
\t width: '25%',
\t type: 'text'
\t }
\t ]);
\t var testData = testData();
\t d3.select('#chart').datum(testData).call(chart);
\t
\t return chart;
\t });
\t function testData() {
\t return [{
\t key: 'NVD3',
\t url: 'http://novus.github.com/nvd3',
\t values: [
\t {
\t key: "Charts",
\t _values: [
\t {
\t key: "Simple Line",
\t type: "Historical",
\t url: "http://novus.github.com/nvd3/ghpages/line.html"
\t },
\t {
\t key: "Scatter/Bubble",
\t type: "Snapshot",
\t url: "http://novus.github.com/nvd3/ghpages/scatter.html"
\t },
\t {
\t key: "Stacked/Stream/Expanded Area",
\t type: "Historical",
\t url: "http://novus.github.com/nvd3/ghpages/stackedArea.html"
\t },
\t {
\t key: "Discrete Bar",
\t type: "Snapshot",
\t url: "http://novus.github.com/nvd3/ghpages/discreteBar.html"
\t },
\t {
\t key: "Grouped/Stacked Multi-Bar",
\t type: "Snapshot/Historical",
\t url: "http://novus.github.com/nvd3/ghpages/multiBar.html"
\t },
\t {
\t key: "Horizontal Grouped Bar",
\t type: "Snapshot",
\t url: "http://novus.github.com/nvd3/ghpages/multiBarHorizontal.html"
\t },
\t {
\t key: "Line and Bar Combo",
\t type: "Historical",
\t url: "http://novus.github.com/nvd3/ghpages/linePlusBar.html"
\t },
\t {
\t key: "Cumulative Line",
\t type: "Historical",
\t url: "http://novus.github.com/nvd3/ghpages/cumulativeLine.html"
\t },
\t {
\t key: "Line with View Finder",
\t type: "Historical",
\t url: "http://novus.github.com/nvd3/ghpages/lineWithFocus.html"
\t }
\t ]
\t },
\t {
\t key: "Chart Components",
\t _values: [
\t {
\t key: "Legend",
\t type: "Universal",
\t url: "http://novus.github.com/nvd3/examples/legend.html"
\t }
\t ]
\t }
\t ]
\t }];
\t }
</script>
</body>
</html>