我是初学者尝试使用DOjo的图表示例。这是我从这个论坛中选择的代码。我能够看到图表,但根本无法看到图例......
小部件声明中的错误或某些文件是否丢失? 虽然我的系统中的所有文件都是可用的但是我完全失去了..
dojo.require("dojox.charting.Chart2D");
dojo.require("dojox.charting.Chart2D");
dojo.require("dojox.charting.themes.PlotKit.blue");
dojo.require("dojox.charting.widget.Legend");
dojo.require("dojox.layout.FloatingPane");
dojo.require("dojox.charting.themes.MiamiNice");
dojo.require("dojo.colors");
makeCharts = function() {
var chart1 = new dojox.charting.Chart2D("simplechart");
chart1.addPlot("default", {
type: "StackedColumns",
markers: true,
tension: 3,
shadows: {
dx: 2,
dy: 2,
dw: 2
}
});
chart1.addAxis("x", {
labels: [{
value: 1,
text: '18-Mar'
}, {
value: 2,
text: '19-Mar'
}, {
value: 3,
text: '20-Mar'
}, {
value: 4,
text: '21-Mar'
}, {
value: 5,
text: '22-Mar'
}, {
value: 6,
text: '23-Mar'
}]
});
chart1.addAxis("y", {
vertical: true
});
chart1.addSeries("Four", [196, 209, 77, 218, 48, 243]);
chart1.addSeries("One", [266, 158, 131, 228, 217, 262]);
chart1.addSeries("Three", [296, 214, 267, 80, 40, 225]);
chart1.addSeries("Two", [207, 264, 115, 227, 193, 27]);
chart1.setTheme(dojox.charting.themes.MiamiNice);
chart1.render();
var legend = new dojox.charting.widget.Legend({
chart: chart1,
horizontal: true
}, "legend");
};
dojo.addOnLoad(makeCharts);
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/resources/dojo.css">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dijit/themes/tundra/tundra.css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dojo/dojo.xd.js" data-dojo-config="isDebug: true, parseOnLoad: true"></script>
<body class="tundra">
<div id="simplechart" style="width: 350px; height: 150px;"></div>
请帮助......
答案 0 :(得分:4)
我添加了一些这样的代码
<div id="legend"></div>
根据此代码
<div id="simplechart" style="width: 350px; height: 150px;"></div>
我得到了这张照片。
你需要吗?
(我的英语不强,对不起。)
答案 1 :(得分:0)
dojox.charting.widget.Legend需要一个容器节点(如div)。 在您的情况下,添加:
<div id="legend"></div>
之后:
<div id="simplechart" style="width: 350px; height: 150px;"></div>
应该这样做。