Difference between revisions of "Reference:GeoGebra Apps Embedding"

From GeoGebra Manual
Jump to: navigation, search
Line 1: Line 1:
This page describes how to embed GeoGebra Apps into your website. For more information on how to interact with embedded apps, please see the  [https://wiki.geogebra.org/en/Reference:GeoGebra_Apps_API GeoGebra Apps API] documentation.  
+
This page describes how to embed GeoGebra Apps into your website. For more information on how to interact with embedded apps, please see the  [[Reference:GeoGebra_Apps_AP GeoGebra Apps API]] documentation.  
  
 
=Quick Start=
 
=Quick Start=

Revision as of 01:20, 21 January 2018

This page describes how to embed GeoGebra Apps into your website. For more information on how to interact with embedded apps, please see the Reference:GeoGebra_Apps_AP GeoGebra Apps API documentation.

Quick Start

In order to embed GeoGebra apps into your page, you need to include the following three parts in your web page:

1 The javascript library deployggb.js needs to be included with this tag:

    <script src="https://cdn.geogebra.org/apps/deployggb.js"></script>

2 Create an element for the GeoGebra app on your page:

    <div id="ggb-element"></div> 

3 Configure and insert the app:

<script>  
    var ggbApp= new GGBApplet({appName: "graphing", width:800, height:600, showToolBar:true, showAlgebraInput:true, showMenuBar:true }, true);
    window.addEventListener("load", function() { 
        ggbApp.inject('ggb-element');
    });
</script>

Simply change the appName from "graphing" to "geometry" or "3d" to get one of our other apps. You can customize our apps by using parameter, see Reference:GeoGebra_App_Parameters for the list of all parameters.

Live Examples

The following examples and their html source code show how to use GeoGebra apps both embedded in your page or as popup apps:

GeoGebra Apps API

The following examples show how you can interact with embedded apps through the GeoGebra Apps API:

Offline and Self-Hosted Solution

We suggest you use use the GeoGebra Apps from our global and super-fast server network cdn.geogebra.org as shown above, but in case you prefer to host and update the GeoGebra apps yourself, you can download our GeoGebra Math Apps Bundle The embed codes are almost the same as above, with two differences: the tag for including deployggb.js needs to be changed to

    <script src="GeoGebra/deployggb.js"></script>

and you need to include the following line below the definition of ggb

    ggb.setHTML5Codebase('GeoGebra/HTML5/5.0/web3d/');
© 2024 International GeoGebra Institute