Skip to content

Commit

Permalink
add editor hint to README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
andreas-web committed May 21, 2024
1 parent 070ef91 commit 695b6c7
Showing 1 changed file with 22 additions and 19 deletions.
41 changes: 22 additions & 19 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,26 +30,29 @@ To find out more about the installation, you can also [read on here](#installing

## Usage

1. In a Moodle course you can add a board to different types of content, i.e.:
- `Add an activity or resource -> Page`
- `Add an activity or resource -> Link`
- `Add an activity or resource -> Quiz`
- ...
2. Write content. At the position the construction should appear, create a construction by:
* switching to the code input, i.e. to "HTML source editor"
* inserting a `<jsxgraph>` tag with all required parameters
* Each <code><div\></code> that contains a JSXGraph board needs a unique ID on the page. This ID is generated automatically. Reference it within the JavaScript using the constant <code>BOARDID</code>.

Example:

```html
<jsxgraph width="500" aspect-ratio="1/1">
var brd = JXG.JSXGraph.initBoard(BOARDID, {boundingbox:[-5,5,5,-5], axis:true});
var p = brd.create('point', [1,2]);
</jsxgraph>
```
In a Moodle course you can add a board to different types of content, i.e.: `Page`, `Link`, `Quiz`, ...

At the position the construction should appear, create a construction by:
* switching to the code input, i.e. to "HTML source editor" **(*)**
* inserting a `<jsxgraph>` tag with all required parameters
* Each <code><div\></code> that contains a JSXGraph board needs a unique ID on the page. This ID is generated automatically. Reference it within the JavaScript using the constant <code>BOARDID</code>.

**(*) Important notice:**
Please note that some Moodle editors remove the `<jsxgraph>` tag when saving.
As a result, the construction may not be displayed correctly or at all.
You should therefore always use the "Plain text editor".
Some also report that the "Atto HTML editor" works, too.

Example:

```html
<jsxgraph width="500" aspect-ratio="1/1">
var brd = JXG.JSXGraph.initBoard(BOARDID, {boundingbox:[-5,5,5,-5], axis:true});
var p = brd.create('point', [1,2]);
</jsxgraph>
```

Get many examples for constructions at [jsxgraph.org/share](https://jsxgraph.org/share). There you can export them to the JSXGraph Moodle filter format.
Get many examples for constructions at [https://jsxgraph.org/share](https://jsxgraph.org/share). There you can export them to the JSXGraph Moodle filter format.

***For tag attributes and global settings have a look at [Attributes and settings](#attributes-and-settings) in this documentation.***

Expand Down

0 comments on commit 695b6c7

Please sign in to comment.