console 命令行工具 X clear

console

var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [-1, 4, 7, -1] });
var A = board.create('point', [0, 0], { name: 'A', fixed: true, size: 1 });
var B = board.create('point', [4, 0], { name: 'B', fixed: true, size: 1 });
var D = board.create('point', [2, 3], { name: 'D', fixed: true, size: 1 });
var C = board.create('parallelpoint', [A, B, D], { name: 'C', size: 1 });
var par = board.create('polygon', [A, B, C, D], { color: 'blue', fillOpacity: 0 });
var Q = board.create('point', [
    function () { return D.X(); },
    function () {
        return A.Y();
    }], { name: 'Q', visible: false });
//创建一个隐藏点，这个这是一个垂直点。

var tra = board.create('polygon', [Q, B, C, D], { color: 'blue', withLines: false, fillOpacity: 0.3 });
//创建Q, B,C,D，然后设置为蓝色，这个是移除A、D、Q后的图形

var M = board.create('point', [0, 0], { name: 'M', visible: false });
var N = board.create('point', [function () { return M.X() + 2; }, function () { return M.Y(); }], { name: 'N', visible: false })
var P = board.create('point', [function () { return M.X() + 2; }, function () { return M.Y() + 3; }], { name: 'P', visible: false })
var tri = board.create('polygon', [M, N, P], { color: 'blue', withLines: false, fillOpacity: 0.3 });
//生成一个可以跟着M点运动的三角形，原理是，其它几个点，都以M为基准进行设置的。

var button1 = board.create('button', [-0.5, 3, 'Forth', function () { M.moveTo([4, 0], 1000); }]);
var button2 = board.create('button', [-0.5, 2.5, 'Back', function () { M.moveTo([0, 0], 1000); }]);

<!DOCTYPE HTML>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>JSXGraph template</title>
	<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
	<link href="https://cdn.jsdelivr.net/npm/jsxgraph/distrib/jsxgraph.css" rel="stylesheet" type="text/css" />
	<script src="https://cdn.jsdelivr.net/npm/jsxgraph/distrib/jsxgraphcore.js" type="text/javascript" charset="UTF-8">

	</script>
	<!-- The next line is optional: MathJax -->
	<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script" async>

	</script>
</head>

<body>

	<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div>

</body>

</html>