我有这个问题,我正在尝试使用"数据"我从SPARQL查询中得到一个如下所示的图:
如果我先下载.json文件,然后用它来制作图表,我就可以这样做,但不是这样。
<?xml version="1.0" encoding="ISO-8859-1" ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">
<head>
<title>Contratos Zaragoza</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="d3/d3.min.js"></script>
<style>
.boton{margin-top:1em;}
</style>
</head>
<body>
<script src="js/jquery-1.10.2.min.js"></script>
<p id="grafico"></p>
</body>
</html>
这里的问题应该是javascript:
<script type="text/javascript">
var SPARQL_ENDPOINT = 'http://datos.zaragoza.es/sparql';
var query = 'PREFIX pproc: <http://contsem.unizar.es/def/sector- publico/pproc#>\
PREFIX dcterms: <http://purl.org/dc/terms/>\
SELECT DISTINCT ?CIF COUNT(?Titulo) as ?Contratos \
WHERE {\
?uri a <http://contsem.unizar.es/def/sector-publico/pproc#Contract>.\
?uri dcterms:title ?Titulo.\
?uri <http://purl.org/procurement/public-contracts#tender> ?a.\
?a <http://purl.org/procurement/public-contracts#supplier> ?empresaid.\
?empresaid <http://www.w3.org/ns/org#identifier> ?CIF.\
}\
ORDER BY desc(?Contratos)\
LIMIT 50';
$.getJSON(SPARQL_ENDPOINT + '?query=' + encodeURIComponent(query) + '&format=application%2Fsparql-results%2Bjson&timeout=0')
.success(function(data) {
var diameter = 1300,
format = d3.format(",d");
var color = d3.scale.ordinal()
.domain(["Sqoop", "Pig", "Apache", "a", "b", "c", "d", "e", "f", "g"])
.range(["steelblue", "pink", "lightgreen", "violet", "orangered", "green", "orange", "skyblue", "gray", "aqua"]);
var bubble = d3.layout.pack()
.sort(null)
.size([diameter, diameter])
.padding(10);
var svg = d3.select("#chart").append("svg")
.attr("width", diameter)
.attr("height", diameter)
.attr("class", "bubble");
var node = svg.selectAll(".node")
.data(bubble.nodes(classes(data.results))
.filter(function (d) {
return !d.children;
}))
.enter().append("g")
.attr("class", "node")
.attr("transform", function (d) {
return "translate(" + d.x + "," + d.y + ")";
});
node.append("title")
.text(function(d) { return d.className.value + ": " + d.value; });
node.append("circle")
.attr("r", function (d) {
return d.r;
})
.style("fill", function (d, i) {
return color(i);
});
node.append("text")
.attr("dy", ".3em")
.style("text-anchor", "middle")
.text(function(d) { return d.className.value + ": " + d.value; });
// Returns a flattened hierarchy containing all leaf nodes under the root.
function classes(root) {
var classes = [];
function recurse(name, node) {
if (node.bindings) node.bindings.forEach(function (child) {
recurse(node.CIF, child);
});
else classes.push({
packageName: name,
className: node.CIF,
value: node.Contratos.value
});
}
recurse(null, root);
return {
children: classes
};
}
d3.select(self.frameElement).style("height", diameter + "px");
});
</script>
我不明白为什么它不起作用,因为在这两种情况下对象都是相同的。
任何评论都会非常有用。