1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
<html>
<head>
<title>JSXGraph example</title>
<link rel="stylesheet" type="text/css" href="../distrib/jsxgraph.css" />
<script type="text/javascript" src="../distrib/jsxgraphcore.js"></script>
</head>
<body>
<div id="jxgbox" class="jxgbox" style="width:900px; height:600px;"></div>
<!-- Drawing area -->
<div id="debug" style="display:none;"></div>
<script type="text/javascript">
/* <![CDATA[ */
var dataArr = [30,16,14,10,10,8,6,6];
var board = JXG.JSXGraph.initBoard('jxgbox', {showNavigation:false, showCopyright:true, originX: 120, originY: 400, unitX: 50, unitY: 50});
board.containerObj.style.backgroundColor = 'black';
board.options.text.strokeColor = 'white';
board.suspendUpdate();
var a = board.createElement('chart', dataArr,
{chartStyle:'pie',
colors:['#0F408D','#6F1B75','#CA147A','#DA2228','#E8801B','#FCF302','#8DC922','#15993C','#87CCEE','#0092CE'],
fillOpacity:0.8, center:[5,2], strokeColor:'black', highlightStrokeColor:'black', strokeWidth:4,
labels:['War games','Sport games', 'Old games','Strategy games', '3D games', 'Puzzle games','Board games', 'I do not play games'],
highlightColors:['#E46F6A','#F9DF82','#F7FA7B','#B0D990','#69BF8E','#BDDDE4','#92C2DF','#637CB0','#AB91BC','#EB8EBF'],
highlightOnSector:true,
highlightBySize:true,
gradient:'linear'
}
);
board.unsuspendUpdate();
/* ]]> */
</script>
</body>
</html>
|
