// Define the id of your board in BOARDID
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
This example is licensed under a Creative Commons Attribution 4.0 International License.
Please note that you have to mention The Center of Mobile Learning with Digital Technology in the credits.
/*
This example is licensed under a
Creative Commons Attribution 4.0 International License.
https://creativecommons.org/licenses/by/4.0/
Please note that you have to mention
The Center of Mobile Learning with Digital Technology
in the credits.
*/
const BOARDID = 'your_div_id'; // Insert your id here!
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
<div id="board-0-wrapper" class="jxgbox-wrapper " style="width: 100%; ">
<div id="board-0" class="jxgbox" style="aspect-ratio: 1 / 1; width: 100%;" data-ar="1 / 1"></div>
</div>
<script type = "text/javascript">
/*
This example is licensed under a
Creative Commons Attribution 4.0 International License.
https://creativecommons.org/licenses/by/4.0/
Please note that you have to mention
The Center of Mobile Learning with Digital Technology
in the credits.
*/
const BOARDID = 'board-0';
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
</script>
<jsxgraph width="100%" aspect-ratio="1 / 1" title="A 5-circle incidence theorem" description="This construction was copied from JSXGraph examples database: https://jsxgraph.uni-bayreuth.de/share/" useGlobalJS="false">
/*
This example is licensed under a
Creative Commons Attribution 4.0 International License.
https://creativecommons.org/licenses/by/4.0/
Please note that you have to mention
The Center of Mobile Learning with Digital Technology
in the credits.
*/
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
</jsxgraph>
/*
This example is licensed under a
Creative Commons Attribution 4.0 International License.
https://creativecommons.org/licenses/by/4.0/
Please note that you have to mention
The Center of Mobile Learning with Digital Technology
in the credits.
*/
const BOARDID = 'your_div_id'; // Insert your id here!
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
<div id="board-0-wrapper" class="jxgbox-wrapper " style="width: 100%; ">
<div id="board-0" class="jxgbox" style="aspect-ratio: 1 / 1; width: 100%;" data-ar="1 / 1"></div>
</div>
<script type = "text/javascript">
/*
This example is licensed under a
Creative Commons Attribution 4.0 International License.
https://creativecommons.org/licenses/by/4.0/
Please note that you have to mention
The Center of Mobile Learning with Digital Technology
in the credits.
*/
const BOARDID = 'board-0';
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
</script>
<jsxgraph width="100%" aspect-ratio="1 / 1" title="A 5-circle incidence theorem" description="This construction was copied from JSXGraph examples database: https://jsxgraph.uni-bayreuth.de/share/" useGlobalJS="false">
/*
This example is licensed under a
Creative Commons Attribution 4.0 International License.
https://creativecommons.org/licenses/by/4.0/
Please note that you have to mention
The Center of Mobile Learning with Digital Technology
in the credits.
*/
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 5, -5],
keepaspectratio: true
});
var A = [],
s = [],
B = [],
c = [],
r = [],
k;
var attA = {
name: '',
strokeColor: '#7355ff',
fillColor: '#7355ff'
};
A[0] = board.create('point', [2.5, -3], attA);
A[1] = board.create('point', [2, 4], attA);
A[2] = board.create('point', [-2.5, 3], attA);
A[3] = board.create('point', [-4, -2], attA);
A[4] = board.create('point', [0, -4], attA);
for (k = 0; k < 5; k++) {
s[k] = board.create('segment', [A[k], A[(k + 2) % 5]], {
strokeColor: 'blue',
strokeWidth: 1
});
}
var attB = {
name: '',
strokeColor: '#EA0000',
fillColor: '#EA0000'
};
for (k = 0; k < 5; k++) {
B[k] = board.create('intersection', [s[k], s[(k - 1 + 5) % 5], 0], attB);
}
var attC = {
strokeColor: '#aaaaaa',
strokeWidth: 1
};
for (k = 0; k < 5; k++) {
c[k] = board.create('circle', [A[k], B[k], A[(k + 1) % 5]], attC);
}
var attR = {
strokeColor: '#ff0000',
strokeWidth: 2
};
for (k = 0; k < 5; k++) {
r[k] = board.create('radicalaxis', [c[k], c[(k - 1 + 5) % 5]], attR);
}
</jsxgraph>