在HTML页面中包含JSXGraph
要使用JSxGraph需要两个文件一个js文件为核心库一个css为样式文件下载地址为
- jsxgraphcore.js from http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js
- jsxgraph.css from http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css
当然你也可以在官网上下载http://jsxgraph.uni-bayreuth.de/wp/ 在这里面找到download
本地页面引入可以使用以下代码
<head>
<link rel="stylesheet" type="text/css" href="jsxgraph.css" />
<script type="text/javascript" src="jsxgraphcore.js"></script>
</head>在线页面引入可以使用以下代码
<head>
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
</head>创建座标轴面板示例
<div id="box" class="jxgbox" style="width:500px; height:500px;"></div>
<script type="text/javascript">
var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-10, 10, 10, -10], axis:true});
</script>完整代码如下<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="css/jsxgraph.css" />
<script type="text/javascript" src="js/jsxgraphcore.js"></script>
</head>
<div id="box" class="jxgbox" style="width:500px; height:500px;"></div>
<script type="text/javascript">
var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-10, 10, 10, -10], axis:true ,showCopyright:false});
</script>