Hi
I try using radar chart but I am facing a problem with min and max
values of my data.
I set the axis range from 0 to 10 and the min and max values of my
data are 1 and 9. The radar chart displays the point with value 1 as
if it would be a 0 value and the point with value 9 as if it would be
10...
I set the range with chxl option but it does not seem to work. Thus my
chart seems to display wrong values.
Is there an option I did not find or that i wrongly set that can avoid
this or is it a bug ?
Here is the code below.
<code>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/
>
<title>
test radar chart
</title>
<script type="text/javascript" src="http://www.google.com/jsapi";></
script>
<script type="text/javascript">
google.load('visualization', '1', {packages: ['imagechart']});
</script>
<script type="text/javascript">
function drawVisualization() {
var options = {};
// Chart API chart type 'rs' is radar chart
options.cht = 'rs';
// title
options.chtt = "Data";
// set the line colors
options.colors = ['#00FF00' , '#454545'];
// fill the area under the lines
options.fill = false;
// labels
options.chxl="0:|ii1|ii2|ii3|ii4|ii5";
options.chxt="x,y";
// setting range from 0 to 10
options.chxr="1,0,10,2";
dataTable = new google.visualization.DataTable();
dataTable.addColumn('string');
dataTable.addColumn('number');
dataTable.addColumn('number');
dataTable.addRows(6);
//var pi = '\u03C0';
//not working well, used chxl option instead
//dataTable.setValue(0, 0, 'i1');
//dataTable.setValue(1, 0, 'i2');
//dataTable.setValue(2, 0, 'i3');
//dataTable.setValue(3, 0, 'i4');
//dataTable.setValue(4, 0, 'i5');
dataTable.setValue(0, 1, 3);
dataTable.setValue(1, 1, 5);
dataTable.setValue(2, 1, 3);
dataTable.setValue(3, 1, 4);
// minimum value
dataTable.setValue(4, 1, 1);
dataTable.setValue(5, 1, 3);
// max value 9
dataTable.setValue(0, 2, 9);
dataTable.setValue(1, 2, 8);
dataTable.setValue(2, 2, 7);
dataTable.setValue(3, 2, 6);
dataTable.setValue(4, 2, 5);
dataTable.setValue(5, 2, 9);
var chart = new
google.visualization.ImageChart(document.getElementById('visualization'));
chart.draw(dataTable, options);
}
google.setOnLoadCallback(drawVisualization);
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="visualization" style="width: 300px; height: 300px;"></
div>
</body>
</code>
Another thing I am wondering is how to "close" the lines, i set one
more row with the same value as the first row. It seems to work fine.
Is there another cleaner way ?
Thanks
--
You received this message because you are subscribed to the Google Groups
"Google Chart API" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-chart-api?hl=en.
