Jsxgraph fiddle
by pratheeshrussellacs
HTML
<script src="https://jsxgraph.org/distrib/jsxgraphcore.js"></script>
<link rel="stylesheet" href="https://jsxgraph.org/distrib/jsxgraph.css">
<div id="jxgbox" style="width: 450px; height: 450px;"></div>
JavaScript
let board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-13, 10, 10, -10], axis:true, keepAspectRatio:true});
var p1 = board.create('point', [0, 0]);
var p2 = board.create('point', [1.0, 1.0]);
var p3 = board.create('point', [3, 0]);
var p4= board.create('point', [3, 5],);
let l1 = board.create('line', [p1,p2],{dash:4});
let l2 = board.create('line', [p3,p4],{dash:4});
var p1x = board.create('point', [-5, 5],{fixed:true});
var p2x = board.create('point', [5, 5],{fixed:true});
var p3x = board.create('point', [5,-5],{fixed:true});
var p4x = board.create('point', [-5,-5],{fixed:true});
var pol = board.create('polygon', [p1x, p2x, p3x, p4x],{borders:{strokecolor:"green"},fillcolor:"white",highlightfillcolor:"white",fixed:true,});