我有这样的系列[[5,3,2,5,7,16,4,15,13,19,6],这个系列是在另一个文件(json.txt)[10,2,1] ,4,6,12,11,17,13,26,11]。我想为第一个系列提供绿色,为第二个系列提供红色,我该如何使用jqplot。我想绘制条形图。
<!DOCTYPE html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="te/jquery.jqplot.js"></script>
<script type="text/javascript" src="te/plugins/jqplot.barRenderer.js"></script>
<script type="text/javascript" src="te/plugins/jqplot.json2.js"></script>
<link rel="stylesheet" type="text/css" href="te/jquery.jqplot.css" />
<script language="javascript" type="text/javascript" src="te/plugins/jqplot.categoryAxisRenderer.js"></script>
<script type="text/javascript" src="te/plugins/jqplot.json2.js"></script>
<script>
$(document).ready(function(){
// Our ajax data renderer which here retrieves a text file.
// it could contact any source and pull data, however.
// The options argument isn't used in this renderer.
var ajaxDataRenderer = function(url, plot, options) {
var ret = null;
$.ajax({
// have to use synchronous here, else the function
// will return before the data is fetched
async: false,
url: url,
dataType:"json",
success: function(data) {
ret = data;
}
});
return ret;
};
// The url for our json data
var jsonurl = "json.txt";
// passing in the url string as the jqPlot data argument is a handy
// shortcut for our renderer. You could also have used the
// "dataRendererOptions" option to pass in the url.
var plot2 = $.jqplot('chart2', jsonurl,{
title: "AJAX JSON Data Renderer",
seriesColors:['#000000', '#ffffff'],
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions: {
// Set varyBarColor to tru to use the custom colors on the bars.
varyBarColor: true
}
},
axes:{
xaxis:{
renderer: $.jqplot.CategoryAxisRenderer
}
},
dataRenderer: ajaxDataRenderer,
dataRendererOptions: {
unusedOptionalUrl: jsonurl
}
});
});
</script>
</head>
<body>
<div id="chart2" style="height:400px;width:100%; "></div>
</body>
</html>
我没有获得一个系列的绿色和另一个系列的红色。