      1 /*
      2     Copyright 2008-2022
      3         Matthias Ehmann,
      4         Michael Gerhaeuser,
      5         Carsten Miller,
      6         Bianca Valentin,
      7         Alfred Wassermann,
      8         Peter Wilfahrt
      9
     10     This file is part of JSXGraph.
     11
     12     JSXGraph is free software dual licensed under the GNU LGPL or MIT License.
     13
     14     You can redistribute it and/or modify it under the terms of the
     15
     16       * GNU Lesser General Public License as published by
     17         the Free Software Foundation, either version 3 of the License, or
     18         (at your option) any later version
     19       OR
     20       * MIT License: https://github.com/jsxgraph/jsxgraph/blob/master/LICENSE.MIT
     21
     22     JSXGraph is distributed in the hope that it will be useful,
     23     but WITHOUT ANY WARRANTY; without even the implied warranty of
     24     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
     25     GNU Lesser General Public License for more details.
     26
     27     You should have received a copy of the GNU Lesser General Public License and
     28     the MIT License along with JSXGraph. If not, see <http://www.gnu.org/licenses/>
     29     and <http://opensource.org/licenses/MIT/>.
     30  */
     31
     32
     33 /*global JXG:true, define: true*/
     34 /*jslint nomen: true, plusplus: true*/
     35
     36 /* depends:
     37  jxg
     38  base/constants
     39  math/math
     40  utils/color
     41  utils/type
     42  */
     43
     44 define([
     45     'jxg', 'base/constants', 'math/math', 'utils/color', 'utils/type'
     46 ], function (JXG, Const, Mat, Color, Type) {
     47
     48     "use strict";
     49
     50     /**
     51      * Options Namespace
     52      * @description These are the default options of the board and of all geometry elements.
     53      * @namespace
     54      * @name JXG.Options
     55      */
     56     JXG.Options = {
     57         jc: {
     58             enabled: true,
     59             compile: true
     60         },
     61
     62         /*
     63          * Options that are used directly within the board class
     64          */
     65         board: {
     66             /**#@+
     67              * @visprop
     68              */
     69
     70             //updateType: 'hierarchical', // 'all'
     71
     72             /**
     73              * Bounding box of the visible area in user coordinates.
     74              * It is an array consisting of four values:
     75              * [x<sub>1</sub>, y<sub>1</sub>, x<sub>2</sub>, y<sub>2</sub>]
     76              *
     77              * The canvas will be spanned from the upper left corner (<sub>1</sub>, y<sub>1</sub>)
     78              * to the lower right corner (x<sub>2</sub>, y<sub>2</sub>).
     79              *
     80              * @name JXG.Board#boundingbox
     81              * @type Array
     82              * @default [-5, 5, 5, -5]
     83              * @example
     84              * var board = JXG.JSXGraph.initBoard('jxgbox', {
     85              *         boundingbox: [-5, 5, 5, -5],
     86              *         axis: true
     87              *     });
     88              */
     89             boundingBox: [-5, 5, 5, -5],
     90
     91             /**
     92              * Maximal bounding box of the visible area in user coordinates.
     93              * It is an array consisting of four values:
     94              * [x<sub>1</sub>, y<sub>1</sub>, x<sub>2</sub>, y<sub>2</sub>]
     95              *
     96              * The bounding box of the canvas must be inside of this maximal
     97              * boundings box.
     98              * @name JXG.Board#maxboundingbox
     99              * @type Array
    100              * @see JXG.Board#boundingbox
    101              * @default [-Infinity, Infinity, Infinity, -Infinity]
    102              *
    103              * @example
    104              * var board = JXG.JSXGraph.initBoard('jxgbox', {
    105              *         boundingbox: [-5, 5, 5, -5],
    106              *         maxboundingbox: [-8, 8, 8, -8],
    107              *         pan: {enabled: true},
    108              *         axis: true
    109              *     });
    110              *
    111              * </pre><div id="JXG065e2750-217c-48ed-a52b-7d7df6de7055" class="jxgbox" style="width: 300px; height: 300px;"></div>
    112              * <script type="text/javascript">
    113              *     (function() {
    114              *         var board = JXG.JSXGraph.initBoard('JXG065e2750-217c-48ed-a52b-7d7df6de7055', {
    115              *             showcopyright: false, shownavigation: false,
    116              *             boundingbox: [-5,5,5,-5],
    117              *             maxboundingbox: [-8,8,8,-8],
    118              *             pan: {enabled: true},
    119              *             axis:true
    120              *         });
    121              *
    122              *     })();
    123              *
    124              * </script><pre>
    125              *
    126              */
    127             maxBoundingBox: [-Infinity, Infinity, Infinity, -Infinity],
    128
    129             /**
    130              * Additional zoom factor multiplied to {@link JXG.Board#zoomX} and {@link JXG.Board#zoomY}.
    131              *
    132              * @name JXG.Board#zoomFactor
    133              * @type Number
    134              * @default 1.0
    135              */
    136             zoomFactor: 1,
    137
    138             /**
    139              * Zoom factor in horizontal direction.
    140              *
    141              * @name JXG.Board#zoomX
    142              * @see JXG.Board#zoomY
    143              * @type Number
    144              * @default 1.0
    145              */
    146             zoomX: 1,
    147
    148             /**
    149              * Zoom factor in vertical direction.
    150              *
    151              * @name JXG.Board#zoomY
    152              * @see JXG.Board#zoomX
    153              * @type Number
    154              * @default 1.0
    155              */
    156             zoomY: 1,
    157
    158             /**
    159              * Title string for the board.
    160              * Primarily used in an invisible text element which is adressed by
    161              * the attribute 'aria-labelledby' from the JSXGraph container.
    162              * JSXGraph creates a new div-element with id "{containerid}_ARIAlabel"
    163              * containing this string.
    164              *
    165              * @name JXG.Board#title
    166              * @see JXG.Board#description
    167              * @type String
    168              * @default ''
    169              *
    170              */
    171             title: '',
    172
    173             /**
    174              * Description string for the board.
    175              * Primarily used in an invisible text element which is adressed by
    176              * the attribute 'aria-describedby' from the JSXGraph container.
    177              * JSXGraph creates a new div-element with id "{containerid}_ARIAdescription"
    178              * containing this string.
    179              *
    180              * @name JXG.Board#description
    181              * @see JXG.Board#title
    182              * @type String
    183              * @default ''
    184              *
    185              */
    186             description: '',
    187
    188             /**
    189              * Show copyright string in canvas.
    190              *
    191              * @name JXG.Board#showCopyright
    192              * @type Boolean
    193              * @default true
    194              */
    195             showCopyright: true,
    196
    197             /**
    198              * Show default axis.
    199              * If shown, the horizontal axis can be accessed via JXG.Board.defaultAxes.x, the
    200              * vertical axis can be accessed via JXG.Board.defaultAxes.y.
    201              * Both axes have a sub-element "defaultTicks".
    202              *
    203              * Value can be Boolean or an object containing axis attributes.
    204              *
    205              * @name JXG.Board#axis
    206              * @type Boolean
    207              * @default false
    208              */
    209             axis: false,
    210
    211             /**
    212              * Attributes for the default axes in case of the attribute
    213              * axis:true in {@link JXG.JSXGraph#initBoard}.
    214              *
    215              * @name JXG.Board#defaultAxes
    216              * @type Object
    217              * @default {x: {name:'x'}, y: {name: 'y'}}
    218              *
    219              */
    220             defaultAxes: {
    221                 x: {
    222                     name: 'x',
    223                     ticks: {
    224                         label: {
    225                             visible: 'inherit',
    226                             anchorX: 'middle',
    227                             anchorY: 'top',
    228                             fontSize: 12,
    229                             offset: [0, -3]
    230                         },
    231                         drawZero: false,
    232                         visible: 'inherit'
    233                     }
    234                 },
    235                 y: {
    236                     name: 'y',
    237                     ticks: {
    238                         label: {
    239                             visible: 'inherit',
    240                             anchorX: 'right',
    241                             anchorY: 'middle',
    242                             fontSize: 12,
    243                             offset: [-6, 0]
    244                         },
    245                         tickEndings: [1, 0],
    246                         drawZero: false,
    247                         visible: 'inherit'
    248                     }
    249                 }
    250             },
    251
    252             /**
    253              * Display of navigation arrows and zoom buttons in the navigation bar.
    254              *
    255              * @name JXG.Board#showNavigation
    256              * @type Boolean
    257              * @default true
    258              */
    259             showNavigation: true,
    260
    261             /**
    262              * Display of zoom buttons in the navigation bar. To show zoom buttons, additionally
    263              * showNavigation has to be set to true.
    264              *
    265              * @name JXG.Board#showZoom
    266              * @type Boolean
    267              * @default true
    268              */
    269             showZoom: true,
    270
    271             /**
    272              * Show a button in the navigation bar to force reload of a construction.
    273              * Works only with the JessieCode tag.
    274              *
    275              * @name JXG.Board#showReload
    276              * @type Boolean
    277              * @default false
    278              */
    279             showReload: false,
    280
    281             /**
    282              * Show a button in the navigation bar to enable screenshots.
    283              *
    284              * @name JXG.Board#showScreenshot
    285              * @type Boolean
    286              * @default false
    287              */
    288             showScreenshot: false,
    289
    290             /**
    291              * Attributes to control the screenshot function.
    292              * The following attributes can be set:
    293              * <ul>
    294              *  <li>scale: scaling factor (default=1.0)
    295              *  <li>type: format of the screenshot image. Default: png
    296              *  <li>symbol: Unicode symbol which is shown in the navigation bar. Default: '\u2318'
    297              *  <li>css: CSS rules to format the div element containing the screen shot image
    298              *  <li>cssButton: CSS rules to format the close button of the div element containing the screen shot image
    299              * </ul>
    300              *
    301              * @name JXG.Board#screenshot
    302              * @type Object
    303              */
    304             screenshot: {
    305                 scale: 1.0,
    306                 type: 'png',
    307                 symbol: '\u2318', //'\u22b9', //'\u26f6',
    308                 css: 'background-color:#eeeeee; opacity:1.0; border:2px solid black; border-radius:10px; text-align:center',
    309                 cssButton:  'padding: 4px 10px; border: solid #356AA0 1px; border-radius: 5px; position: absolute; right: 2ex; top: 2ex; background-color: rgba(255, 255, 255, 0.3);'
    310             },
    311
    312             /**
    313              * Show a button in the navigation bar to start fullscreen mode.
    314              *
    315              * @name JXG.Board#showFullscreen
    316              * @type Boolean
    317              * @see JXG.Board#fullscreen
    318              * @default false
    319              */
    320             showFullscreen: false,
    321
    322             /**
    323              * Attribute(s) to control the fullscreen icon. The attribute "showFullscreen"
    324              * controls if the icon is shown.
    325              * The following attribute(s) can be set:
    326              * <ul>
    327              *  <li>symbol (String): Unicode symbol which is shown in the navigation bar. Default: '\u25a1'
    328              *  <li>id (String): Id of the HTML element which is brought to full screen or null if the JSXgraph div is taken.
    329              * It may be an outer div element, e.g. if the old aspect ratio trick is used. Default: null, i.e. use the JSXGraph div.
    330              * </ul>
    331              *
    332              * @example
    333              * var board = JXG.JSXGraph.initBoard('35bec5a2-fd4d-11e8-ab14-901b0e1b8723',
    334              *             {boundingbox: [-8, 8, 8,-8], axis: true,
    335              *             showcopyright: false,
    336              *             showFullscreen: true,
    337              *             fullscreen: {
    338              *                  symbol: '\u22c7'
    339              *              }
    340              *             });
    341              * var pol = board.create('polygon', [[0, 1], [3,4], [1,-4]], {fillColor: 'yellow'});
    342              *
    343              * </pre><div id="JXGa35bec5a2-fd4d-11e8-ab14-901b0e1b8723" class="jxgbox" style="width: 300px; height: 300px;"></div>
    344              * <script type="text/javascript">
    345              *     (function() {
    346              *         var board = JXG.JSXGraph.initBoard('JXGa35bec5a2-fd4d-11e8-ab14-901b0e1b8723',
    347              *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false,
    348              *              showFullscreen: true,
    349              *              fullscreen: {
    350              *                  symbol: '\u22c7'
    351              *                  }
    352              *             });
    353              *     var pol = board.create('polygon', [[0, 1], [3,4], [1,-4]], {fillColor: 'yellow'});
    354              *     })();
    355              *
    356              * </script><pre>
    357              *
    358              * @name JXG.Board#fullscreen
    359              * @see JXG.Board#showFullscreen
    360              * @type Object
    361              */
    362             fullscreen: {
    363                 symbol: '\u25a1', // '\u26f6' (not supported by MacOS), // '\u25a1'
    364                 id: null
    365             },
    366
    367             /**
    368              * Show a button which allows to clear all traces of a board.
    369              *
    370              * @name JXG.Board#showClearTraces
    371              * @type Boolean
    372              * @default false
    373              */
    374             showClearTraces: false,
    375
    376             /**
    377              * If set to true the bounding box might be changed such that
    378              * the ratio of width and height of the hosting HTML div is equal
    379              * to the ratio of width and height of the bounding box.
    380              *
    381              * This is necessary if circles should look like circles and not
    382              * like ellipses. It is recommended to set keepAspectRatio = true
    383              * for geometric applets. For function plotting keepAspectRatio = false
    384              * might be the better choice.
    385              *
    386              * @name JXG.Board#keepAspectRatio
    387              * @see JXG.Board#boundingbox
    388              * @see JXG.Board#setBoundingBox
    389              * @type Boolean
    390              * @default false
    391              */
    392             keepAspectRatio: false,
    393
    394             /**
    395              * If set true and
    396              * hasPoint() is true for both an element and it's label,
    397              * the element (and not the label) is taken as drag element.
    398              *
    399              * If set false and hasPoint() is true for both an element and it's label,
    400              * the label is taken (if it is on a higher layer than the element)
    401              *
    402              * @name JXG.Board#ignoreLabels
    403              * @type Booelan
    404              * @default true
    405              */
    406             ignoreLabels: true,
    407
    408             /**
    409              * Maximum number of digits in automatic label generation.
    410              * For example, if set to 1 automatic point labels end at "Z".
    411              * If set to 2, point labels end at "ZZ".
    412              *
    413              * @name JXG.Board#maxNameLength
    414              * @see JXG.Board#generateName
    415              * @type Number
    416              * @default 1
    417              */
    418             maxNameLength: 1,
    419
    420             /**
    421              * Supply the document object. Defaults to window.document
    422              *
    423              * @name JXG.Board#document
    424              * @type DOM object
    425              * @default false (meaning window.document)
    426              */
    427             document: false,
    428
    429             /**
    430              * If true the first element of the set JXG.board.objects having hasPoint==true is taken as drag element.
    431              *
    432              * @name JXG.Board#takeFirst
    433              * @type Boolean
    434              * @default false
    435              */
    436             takeFirst: false,
    437
    438             /**
    439             * If true, when read from a file or string - the size of the div can be changed by the construction text.
    440             *
    441             * @name JXG.Board#takeSizeFromFile
    442             * @type Boolean
    443             * @default false
    444             */
    445             takeSizeFromFile: false,
    446
    447             /**
    448              * Default rendering engine. Possible values are 'svg', 'canvas', 'vml', 'no', or 'auto'.
    449              * If the rendering engine is not available JSXGraph tries to detect a different engine.
    450              *
    451              * <p>
    452              * In case of 'canvas' it is advisable to call 'board.update()' after all elements have been
    453              * constructed. This ensures that all elements are drawn with their intended visual appearance.
    454              *
    455              * @name JXG.Board#renderer
    456              * @type String
    457              * @default 'auto'
    458              */
    459             renderer: 'auto',
    460
    461             /**
    462              * Time (in msec) between two animation steps. Used in
    463              * {@link JXG.CoordsElement#moveAlong}, {@link JXG.CoordsElement#moveTo} and
    464              * {@link JXG.CoordsElement#visit}.
    465              *
    466              * @name JXG.Board#animationDelay
    467              * @type Number
    468              * @default 35
    469              * @see JXG.CoordsElement#moveAlong
    470              * @see JXG.CoordsElement#moveTo
    471              * @see JXG.CoordsElement#visit
    472              */
    473             animationDelay: 35,
    474
    475             /**
    476              * Maximum frame rate of the board, i.e. maximum number of updates per second
    477              * triggered by move events.
    478              *
    479              * @name JXG.Board#maxFrameRate
    480              * @type Number
    481              * @default 40
    482              */
    483             maxFrameRate: 40,
    484
    485             /**
    486              * Allow user interaction by registering mouse, pointer and touch events.
    487              *
    488              * @name JXG.Board#registerEvents
    489              * @type Boolean
    490              * @default true
    491              */
    492             registerEvents: true,
    493
    494             /**
    495              * Change redraw strategy in SVG rendering engine.
    496              * <p>
    497              * This optimization seems to be <b>obsolete</b> in newer browsers (from 2021 on, at least)
    498              * and even slow down the constructions. Therefore, the default is set to 'none' since v1.2.4.
    499              * <p>
    500              * If set to 'svg', before every redrawing of the JSXGraph construction
    501              * the SVG sub-tree of the DOM tree is taken out of the DOM.
    502              *
    503              * If set to 'all', before every redrawing of the JSXGraph construction the
    504              * complete DOM tree is taken out of the DOM.
    505              * If set to 'none' the redrawing is done in-place.
    506              *
    507              * Using 'svg' or 'all' speeds up the update process considerably. The risk
    508              * is that if there is an exception, only a white div or window is left.
    509              *
    510              *
    511              * @name JXG.Board#minimizeReflow
    512              * @type String
    513              * @default 'none'
    514              */
    515             minimizeReflow: 'none',
    516
    517             /**
    518              * A number that will be added to the absolute position of the board used in mouse coordinate
    519              * calculations in {@link JXG.Board#getCoordsTopLeftCorner}.
    520              *
    521              * @name JXG.Board#offsetX
    522              * @see JXG.Board#offsetY
    523              * @type Number
    524              * @default 0
    525              */
    526             offsetX: 0,
    527
    528             /**
    529              * A number that will be added to the absolute position of the board used in mouse coordinate
    530              * calculations in {@link JXG.Board#getCoordsTopLeftCorner}.
    531              *
    532              * @name JXG.Board#offsetY
    533              * @see JXG.Board#offsetX
    534              * @type Number
    535              * @default 0
    536              */
    537             offsetY: 0,
    538
    539             /**
    540              * Control the possibilities for zoom interaction.
    541              *
    542              * Possible sub-attributes with default values are:
    543              * <pre>
    544              * zoom: {
    545              *   factorX: 1.25,  // horizontal zoom factor (multiplied to {@link JXG.Board#zoomX})
    546              *   factorY: 1.25,  // vertical zoom factor (multiplied to {@link JXG.Board#zoomY})
    547              *   wheel: true,     // allow zooming by mouse wheel or
    548              *   				   // by pinch-to-toom gesture on touch devices
    549              *   needShift: true,   // mouse wheel zooming needs pressing of the shift key
    550              *   min: 0.001,        // minimal values of {@link JXG.Board#zoomX} and {@link JXG.Board#zoomY}, limits zoomOut
    551              *   max: 1000.0,       // maximal values of {@link JXG.Board#zoomX} and {@link JXG.Board#zoomY}, limits zoomIn
    552              *
    553              *   pinchHorizontal: true, // Allow pinch-to-zoom to zoom only horizontal axis
    554              *   pinchVertical: true,   // Allow pinch-to-zoom to zoom only vertical axis
    555              *   pinchSensitivity: 7    // Sensitivity (in degrees) for recognizing horizontal or vertical pinch-to-zoom gestures.
    556              * }
    557              * </pre>
    558              *
    559              * Deprecated: zoom.eps which is superseded by zoom.min
    560              *
    561              * @name JXG.Board#zoom
    562              * @type Object
    563              * @default
    564              */
    565             zoom: {
    566                 enabled: true,
    567                 factorX: 1.25,
    568                 factorY: 1.25,
    569                 wheel: true,
    570                 needShift: true,
    571                 min: 0.0001,
    572                 max: 10000.0,
    573                 pinchHorizontal: true,
    574                 pinchVertical: true,
    575                 pinchSensitivity: 7
    576             },
    577
    578             /**
    579              * Control the possibilities for panning interaction (i.e. moving the origin).
    580              *
    581              * Possible sub-attributes with default values are:
    582              * <pre>
    583              * pan: {
    584              *   enabled: true   // Allow panning
    585              *   needTwoFingers: false, // panning is done with two fingers on touch devices
    586              *   needShift: true, // mouse panning needs pressing of the shift key
    587              * }
    588              * </pre>
    589              *
    590              * @name JXG.Board#pan
    591              * @type Object
    592              */
    593             pan: {
    594                 needShift: true,
    595                 needTwoFingers: false,
    596                 enabled: true
    597             },
    598
    599             /**
    600              * Control the possibilities for dragging objects.
    601              *
    602              * Possible sub-attributes with default values are:
    603              * <pre>
    604              * drag: {
    605              *   enabled: true   // Allow dragging
    606              * }
    607              * </pre>
    608              *
    609              * @name JXG.Board#drag
    610              * @type Object
    611              * @default {enabled: true}
    612              */
    613             drag: {
    614                 enabled: true
    615             },
    616
    617             /**
    618              * Control using the keyboard to change the construction.
    619              * <ul>
    620              * <li> enabled: true / false
    621              * <li> dx: horizontal shift amount per key press
    622              * <li> dy: vertical shift amount per key press
    623              * <li> panShift: zoom if shift key is pressed
    624              * <li> panCtrl: zoom if ctrl key is pressed
    625              * </ul>
    626              *
    627              * @example
    628              * var board = JXG.JSXGraph.initBoard("jxgbox", {boundingbox: [-5,5,5,-5],
    629              *     axis: true,
    630              *     showCopyright:true,
    631              *     showNavigation:true,
    632              *     keyboard: {
    633              *         enabled: true,
    634              *         dy: 30,
    635              *         panShift: true,
    636              *         panCtrl: false
    637              *     }
    638              * });
    639              *
    640              * </pre><div id="JXGb1d3aab6-ced2-4fe9-8fa5-b0accc8c7266" class="jxgbox" style="width: 300px; height: 300px;"></div>
    641              * <script type="text/javascript">
    642              *     (function() {
    643              *         var board = JXG.JSXGraph.initBoard('JXGb1d3aab6-ced2-4fe9-8fa5-b0accc8c7266',
    644              *             {boundingbox: [-5,5,5,-5],
    645              *         axis: true,
    646              *         showCopyright:true,
    647              *         showNavigation:true,
    648              *         keyboard: {
    649              *             enabled: true,
    650              *             dy: 30,
    651              *             panShift: true,
    652              *             panCtrl: false
    653              *         }
    654              *     });
    655              *
    656              *     })();
    657              *
    658              * </script><pre>
    659              *
    660              *
    661              * @see JXG.Board#keyDownListener
    662              * @see JXG.Board#keyFocusInListener
    663              * @see JXG.Board#keyFocusOutListener
    664              *
    665              * @name JXG.Board#keyboard
    666              * @type Object
    667              * @default {enabled: true, dx: 10, dy:10, panShift: true, panCtrl: false}
    668              */
    669             keyboard: {
    670                 enabled: true,
    671                 dx: 10,
    672                 dy: 10,
    673                 panShift: true,
    674                 panCtrl: false
    675             },
    676
    677             /**
    678              * Control if JSXGraph reacts to resizing of the JSXGraph container element
    679              * by the user / browser.
    680              * The attribute "throttle" determines the minimal time in msec between to
    681              * resize calls.
    682              *
    683              * @see JXG.Board#startResizeObserver
    684              * @see JXG.Board#resizeListener
    685              *
    686              * @name JXG.Board#resize
    687              * @type Object
    688              * @default {enabled: true, throttle: 10}
    689              *
    690              * @example
    691              *     var board = JXG.JSXGraph.initBoard('jxgbox', {
    692              *         boundingbox: [-5,5,5,-5],
    693              *         keepAspectRatio: true,
    694              *         axis: true,
    695              *         resize: {enabled: true, throttle: 200}
    696              *     });
    697              *
    698              * </pre><div id="JXGb55d4608-5d71-4bc3-b332-18c15fbda8c3" class="jxgbox" style="width: 300px; height: 300px;"></div>
    699              * <script type="text/javascript">
    700              *     (function() {
    701              *         var board = JXG.JSXGraph.initBoard('JXGb55d4608-5d71-4bc3-b332-18c15fbda8c3', {
    702              *             boundingbox: [-5,5,5,-5],
    703              *             keepAspectRatio: true,
    704              *             axis: true,
    705              *             resize: {enabled: true, throttle: 200}
    706              *         });
    707              *
    708              *     })();
    709              *
    710              * </script><pre>
    711              *
    712              *
    713              */
    714             resize: {
    715                 enabled: true,
    716                 throttle: 10
    717             },
    718
    719             /**
    720              * Element which listens to move events of the pointing device.
    721              * This allows to drag elements of a JSXGraph construction outside of the board.
    722              * Especially, on mobile devices this enhances the user experience.
    723              * However, it is recommended to allow dragging outside of the JSXGraph board only
    724              * in certain constructions where users may not "loose" points outside of the board.
    725              * Then points may become unreachable.
    726              * <p>
    727              * A situation where dragging outside of the board is uncritical is for example if
    728              * only sliders are used to interact with the construction.
    729              * <p>
    730              * Possible values for this attributes are:
    731              * <ul>
    732              * <li> an element specified by document.getElementById('some id');
    733              * <li> null: to use the JSXgraph container div element
    734              * <li> document
    735              * </ul>
    736              *
    737              * @name JXG.Board#moveTarget
    738              * @type HTML node or document
    739              * @default null
    740              *
    741              * @example
    742              *     var board = JXG.JSXGraph.initBoard('jxgbox', {
    743              *         boundingbox: [-5,5,5,-5],
    744              *         axis: true,
    745              *         moveTarget: document
    746              *     });
    747              *
    748              * </pre><div id="JXG973457e5-c63f-4516-8570-743f2cc560e1" class="jxgbox" style="width: 300px; height: 300px;"></div>
    749              * <script type="text/javascript">
    750              *     (function() {
    751              *         var board = JXG.JSXGraph.initBoard('JXG973457e5-c63f-4516-8570-743f2cc560e1',
    752              *             {boundingbox: [-5,5,5,-5],
    753              *             axis: true,
    754              *             moveTarget: document
    755              *         });
    756              *
    757              *     })();
    758              *
    759              * </script><pre>
    760              *
    761              *
    762              */
    763             moveTarget: null,
    764
    765             /**
    766              * Control the possibilities for a selection rectangle.
    767              * Starting a selection event triggers the "startselecting" event.
    768              * When the mouse pointer is released, the "stopselecting" event is fired.
    769              * The "stopselecting" event must be supplied by the user.
    770              * <p>
    771              * Possible sub-attributes with default values are:
    772              * <pre>
    773              * selection: {
    774              *   enabled: false,
    775              *   name: 'selectionPolygon',
    776              *   needShift: false,  // mouse selection needs pressing of the shift key
    777              *   needCtrl: true,    // mouse selection needs pressing of the shift key
    778              *   withLines: false,  // Selection polygon has border lines
    779              *   vertices: {
    780              *       visible: false
    781              *   },
    782              *   fillColor: '#ffff00',
    783              *   visible: false      // Initial visibility. Should be set to false always
    784              * }
    785              * </pre>
    786              *
    787              * @example
    788              * board.on('stopselecting', function(){
    789              *     var box = board.stopSelectionMode(),
    790              *     // bbox has the coordinates of the selectionr rectangle.
    791              *     // Attention: box[i].usrCoords have the form [1, x, y], i.e.
    792              *     // are homogeneous coordinates.
    793              *     bbox = box[0].usrCoords.slice(1).concat(box[1].usrCoords.slice(1));
    794              *     // Set a new bounding box
    795              *     board.setBoundingBox(bbox, false);
    796              * });
    797              *
    798              * @name JXG.Board#selection
    799              * @see JXG.Board#startselecting
    800              * @see JXG.Board#stopselecting
    801              * @see JXG.Board#mousestartselecting
    802              * @see JXG.Board#pointerstartselecting
    803              * @see JXG.Board#touchstartselecting
    804              * @see JXG.Board#mousestopselecting
    805              * @see JXG.Board#pointerstopselecting
    806              * @see JXG.Board#touchstopselecting
    807              * @type Object
    808              * @default
    809              */
    810             selection: {
    811                 enabled: false,
    812                 name: 'selectionPolygon',
    813                 needShift: false,
    814                 needCtrl: true,
    815                 withLines: false,
    816                 vertices: {
    817                     visible: false
    818                 },
    819                 fillColor: '#ffff00',
    820                 visible: false
    821             },
    822
    823             /**
    824              * If true, the infobox is shown on mouse/pen over for all points
    825              * which have set their attribute showInfobox to 'inherit'.
    826              * If a point has set its attribute showInfobox to false or true,
    827              * that value will have priority over this value.
    828              *
    829              * @name JXG.Board#showInfobox
    830              * @see Point#showInfobox
    831              * @type Boolean
    832              * @default true
    833              */
    834             showInfobox: true
    835
    836             /**#@-*/
    837         },
    838
    839         /**
    840          * Options that are used by the navigation bar.
    841          *
    842          * Default values are
    843          * <pre>
    844          * JXG.Option.navbar: {
    845          *   strokeColor: '#333333',
    846          *   fillColor: 'transparent',
    847          *   highlightFillColor: '#aaaaaa',
    848          *   padding: '2px',
    849          *   position: 'absolute',
    850          *   fontSize: '14px',
    851          *   cursor: 'pointer',
    852          *   zIndex: '100',
    853          *   right: '5px',
    854          *   bottom: '5px'
    855          * },
    856          * </pre>
    857          * These settings are overruled by the CSS class 'JXG_navigation'.
    858          * @deprecated
    859          * @type Object
    860          * @name JXG.Options#navbar
    861          *
    862          */
    863         navbar: {
    864             strokeColor: '#333333', //'#aaaaaa',
    865             fillColor: 'transparent', //#f5f5f5',
    866             highlightFillColor: '#aaaaaa',
    867             padding: '2px',
    868             position: 'absolute',
    869             fontSize: '14px',
    870             cursor: 'pointer',
    871             zIndex: '100',
    872             right: '5px',
    873             bottom: '5px'
    874             //border: 'none 1px black',
    875             //borderRadius: '4px'
    876         },
    877
    878          /*
    879           *  Generic options used by {@link JXG.GeometryElement}
    880           */
    881         elements: {

    883
    884             /**#@+
    885              * @visprop
    886              */
    887
    888             /**
    889              * The stroke color of the given geometry element.
    890              * @type String
    891              * @name JXG.GeometryElement#strokeColor
    892              * @see JXG.GeometryElement#highlightStrokeColor
    893              * @see JXG.GeometryElement#strokeWidth
    894              * @see JXG.GeometryElement#strokeOpacity
    895              * @see JXG.GeometryElement#highlightStrokeOpacity
    896              * @default {@link JXG.Options.elements.color#strokeColor}
    897              */
    898             strokeColor: Color.palette.blue,
    899
    900             /**
    901              * The stroke color of the given geometry element when the user moves the mouse over it.
    902              * @type String
    903              * @name JXG.GeometryElement#highlightStrokeColor
    904              * @see JXG.GeometryElement#strokeColor
    905              * @see JXG.GeometryElement#strokeWidth
    906              * @see JXG.GeometryElement#strokeOpacity
    907              * @see JXG.GeometryElement#highlightStrokeOpacity
    908              * @default {@link JXG.Options.elements.color#highlightStrokeColor}
    909              */
    910             highlightStrokeColor: '#c3d9ff',
    911
    912             /**
    913              * The fill color of this geometry element.
    914              * @type String
    915              * @name JXG.GeometryElement#fillColor
    916              * @see JXG.GeometryElement#highlightFillColor
    917              * @see JXG.GeometryElement#fillOpacity
    918              * @see JXG.GeometryElement#highlightFillOpacity
    919              * @default {@link JXG.Options.elements.color#fillColor}
    920              */
    921             fillColor: Color.palette.red,
    922
    923             /**
    924              * The fill color of the given geometry element when the mouse is pointed over it.
    925              * @type String
    926              * @name JXG.GeometryElement#highlightFillColor
    927              * @see JXG.GeometryElement#fillColor
    928              * @see JXG.GeometryElement#fillOpacity
    929              * @see JXG.GeometryElement#highlightFillOpacity
    930              * @default {@link JXG.Options.elements.color#highlightFillColor}
    931              */
    932             highlightFillColor: 'none',
    933
    934             /**
    935              * Opacity for element's stroke color.
    936              * @type Number
    937              * @name JXG.GeometryElement#strokeOpacity
    938              * @see JXG.GeometryElement#strokeColor
    939              * @see JXG.GeometryElement#highlightStrokeColor
    940              * @see JXG.GeometryElement#strokeWidth
    941              * @see JXG.GeometryElement#highlightStrokeOpacity
    942              * @default {@link JXG.Options.elements#strokeOpacity}
    943              */
    944             strokeOpacity: 1,
    945
    946             /**
    947              * Opacity for stroke color when the object is highlighted.
    948              * @type Number
    949              * @name JXG.GeometryElement#highlightStrokeOpacity
    950              * @see JXG.GeometryElement#strokeColor
    951              * @see JXG.GeometryElement#highlightStrokeColor
    952              * @see JXG.GeometryElement#strokeWidth
    953              * @see JXG.GeometryElement#strokeOpacity
    954              * @default {@link JXG.Options.elements#highlightStrokeOpacity}
    955              */
    956             highlightStrokeOpacity: 1,
    957
    958             /**
    959              * Opacity for fill color.
    960              * @type Number
    961              * @name JXG.GeometryElement#fillOpacity
    962              * @see JXG.GeometryElement#fillColor
    963              * @see JXG.GeometryElement#highlightFillColor
    964              * @see JXG.GeometryElement#highlightFillOpacity
    965              * @default {@link JXG.Options.elements.color#fillOpacity}
    966              */
    967             fillOpacity: 1,
    968
    969             /**
    970              * Opacity for fill color when the object is highlighted.
    971              * @type Number
    972              * @name JXG.GeometryElement#highlightFillOpacity
    973              * @see JXG.GeometryElement#fillColor
    974              * @see JXG.GeometryElement#highlightFillColor
    975              * @see JXG.GeometryElement#fillOpacity
    976              * @default {@link JXG.Options.elements.color#highlightFillOpacity}
    977              */
    978             highlightFillOpacity: 1,
    979
    980             /**
    981              * Gradient type. Possible values are 'linear'. 'radial' or null.
    982              *
    983              * @example
    984              *     var a = board.create('slider', [[0, -0.2], [3.5, -0.2], [0, 0, 2 * Math.PI]], {name: 'angle'});
    985              *     var b = board.create('slider', [[0, -0.4], [3.5, -0.4], [0, 0, 1]], {name: 'offset1'});
    986              *     var c = board.create('slider', [[0, -0.6], [3.5, -0.6], [0, 1, 1]], {name: 'offset2'});
    987              *
    988              *     var pol = board.create('polygon', [[0, 0], [4, 0], [4,4], [0,4]], {
    989              *                 fillOpacity: 1,
    990              *                 fillColor: 'yellow',
    991              *                 gradient: 'linear',
    992              *                 gradientSecondColor: 'blue',
    993              *                 gradientAngle: function() { return a.Value(); },
    994              *                 gradientStartOffset: function() { return b.Value(); },
    995              *                 gradientEndOffset: function() { return c.Value(); },
    996              *                 hasInnerPoints: true
    997              *         });
    998              *
    999              * </pre><div id="JXG3d04b5fd-0cd4-4f49-8c05-4e9686cd7ff0" class="jxgbox" style="width: 300px; height: 300px;"></div>
    1000              * <script type="text/javascript">
    1001              *     (function() {
    1002              *         var board = JXG.JSXGraph.initBoard('JXG3d04b5fd-0cd4-4f49-8c05-4e9686cd7ff0',
    1003              *             {boundingbox: [-1.5, 4.5, 5, -1.5], axis: true, showcopyright: false, shownavigation: false});
    1004              *         var a = board.create('slider', [[0, -0.2], [3.5, -0.2], [0, 0, 2 * Math.PI]], {name: 'angle'});
    1005              *         var b = board.create('slider', [[0, -0.4], [3.5, -0.4], [0, 0, 1]], {name: 'offset1'});
    1006              *         var c = board.create('slider', [[0, -0.6], [3.5, -0.6], [0, 1, 1]], {name: 'offset2'});
    1007              *
    1008              *         var pol = board.create('polygon', [[0, 0], [4, 0], [4,4], [0,4]], {
    1009              *                     fillOpacity: 1,
    1010              *                     fillColor: 'yellow',
    1011              *                     gradient: 'linear',
    1012              *                     gradientSecondColor: 'blue',
    1013              *                     gradientAngle: function() { return a.Value(); },
    1014              *                     gradientStartOffset: function() { return b.Value(); },
    1015              *                     gradientEndOffset: function() { return c.Value(); },
    1016              *                     hasInnerPoints: true
    1017              *             });
    1018              *
    1019              *     })();
    1020              *
    1021              * </script><pre>
    1022              *
    1023              * @example
    1024              *     var cx = board.create('slider', [[0, -.2], [3.5, -.2], [0, 0.5, 1]], {name: 'cx, cy'});
    1025              *     var fx = board.create('slider', [[0, -.4], [3.5, -.4], [0, 0.5, 1]], {name: 'fx, fy'});
    1026              *     var o1 = board.create('slider', [[0, -.6], [3.5, -.6], [0, 0.0, 1]], {name: 'offset1'});
    1027              *     var o2 = board.create('slider', [[0, -.8], [3.5, -.8], [0, 1, 1]], {name: 'offset2'});
    1028              *     var r = board.create('slider', [[0, -1], [3.5, -1], [0, 0.5, 1]], {name: 'r'});
    1029              *     var fr = board.create('slider', [[0, -1.2], [3.5, -1.2], [0, 0, 1]], {name: 'fr'});
    1030              *
    1031              *     var pol = board.create('polygon', [[0, 0], [4, 0], [4,4], [0,4]], {
    1032              *                 fillOpacity: 1,
    1033              *                 fillColor: 'yellow',
    1034              *                 gradient: 'radial',
    1035              *                 gradientSecondColor: 'blue',
    1036              *                 gradientCX: function() { return cx.Value(); },
    1037              *                 gradientCY: function() { return cx.Value(); },
    1038              *                 gradientR: function() { return r.Value(); },
    1039              *                 gradientFX: function() { return fx.Value(); },
    1040              *                 gradientFY: function() { return fx.Value(); },
    1041              *                 gradientFR: function() { return fr.Value(); },
    1042              *                 gradientStartOffset: function() { return o1.Value(); },
    1043              *                 gradientEndOffset: function() { return o2.Value(); },
    1044              *                 hasInnerPoints: true
    1045              *     });
    1046              *
    1047              * </pre><div id="JXG6081ca7f-0d09-4525-87ac-325a02fe2225" class="jxgbox" style="width: 300px; height: 300px;"></div>
    1048              * <script type="text/javascript">
    1049              *     (function() {
    1050              *         var board = JXG.JSXGraph.initBoard('JXG6081ca7f-0d09-4525-87ac-325a02fe2225',
    1051              *             {boundingbox: [-1.5, 4.5, 5, -1.5], axis: true, showcopyright: false, shownavigation: false});
    1052              *         var cx = board.create('slider', [[0, -.2], [3.5, -.2], [0, 0.5, 1]], {name: 'cx, cy'});
    1053              *         var fx = board.create('slider', [[0, -.4], [3.5, -.4], [0, 0.5, 1]], {name: 'fx, fy'});
    1054              *         var o1 = board.create('slider', [[0, -.6], [3.5, -.6], [0, 0.0, 1]], {name: 'offset1'});
    1055              *         var o2 = board.create('slider', [[0, -.8], [3.5, -.8], [0, 1, 1]], {name: 'offset2'});
    1056              *         var r = board.create('slider', [[0, -1], [3.5, -1], [0, 0.5, 1]], {name: 'r'});
    1057              *         var fr = board.create('slider', [[0, -1.2], [3.5, -1.2], [0, 0, 1]], {name: 'fr'});
    1058              *
    1059              *         var pol = board.create('polygon', [[0, 0], [4, 0], [4,4], [0,4]], {
    1060              *                     fillOpacity: 1,
    1061              *                     fillColor: 'yellow',
    1062              *                     gradient: 'radial',
    1063              *                     gradientSecondColor: 'blue',
    1064              *                     gradientCX: function() { return cx.Value(); },
    1065              *                     gradientCY: function() { return cx.Value(); },
    1066              *                     gradientR: function() { return r.Value(); },
    1067              *                     gradientFX: function() { return fx.Value(); },
    1068              *                     gradientFY: function() { return fx.Value(); },
    1069              *                     gradientFR: function() { return fr.Value(); },
    1070              *                     gradientStartOffset: function() { return o1.Value(); },
    1071              *                     gradientEndOffset: function() { return o2.Value(); },
    1072              *                     hasInnerPoints: true
    1073              *         });
    1074              *
    1075              *     })();
    1076              *
    1077              * </script><pre>
    1078              *
    1079              *
    1080              * @type String
    1081              * @name JXG.GeometryElement#gradient
    1082              * @see JXG.GeometryElement#gradientSecondColor
    1083              * @see JXG.GeometryElement#gradientSecondOpacity
    1084              * @default null
    1085              */
    1086             gradient: null,
    1087
    1088             /**
    1089              * Second color for gradient.
    1090              * @type String
    1091              * @name JXG.GeometryElement#gradientSecondColor
    1092              * @see JXG.GeometryElement#gradient
    1093              * @see JXG.GeometryElement#gradientSecondOpacity
    1094              * @default '#ffffff'
    1095              */
    1096             gradientSecondColor: '#ffffff',
    1097
    1098             /**
    1099              * Opacity of second gradient color. Takes a value between 0 and 1.
    1100              * @type Number
    1101              * @name JXG.GeometryElement#gradientSecondOpacity
    1102              * @see JXG.GeometryElement#gradient
    1103              * @see JXG.GeometryElement#gradientSecondColor
    1104              * @default 1
    1105              */
    1106             gradientSecondOpacity: 1,
    1107
    1108             /**
    1109              * The gradientStartOffset attribute is a number (ranging from 0 to 1) which indicates where the first gradient stop is placed,
    1110              * see the SVG specification for more information.
    1111              * For linear gradients, this attribute represents a location along the gradient vector.
    1112              * For radial gradients, it represents a percentage distance from (fx,fy) to the edge of the outermost/largest circle.
    1113              * @type Number
    1114              * @name JXG.GeometryElement#gradientStartOffset
    1115              * @see JXG.GeometryElement#gradient
    1116              * @see JXG.GeometryElement#gradientEndOffset
    1117              * @default 0.0
    1118              */
    1119             gradientStartOffset: 0.0,
    1120
    1121             /**
    1122              * The gradientEndOffset attribute is a number (ranging from 0 to 1) which indicates where the second gradient stop is placed,
    1123              * see the SVG specification for more information.
    1124              * For linear gradients, this attribute represents a location along the gradient vector.
    1125              * For radial gradients, it represents a percentage distance from (fx,fy) to the edge of the outermost/largest circle.
    1126              * @type Number
    1127              * @name JXG.GeometryElement#gradientEndOffset
    1128              * @see JXG.GeometryElement#gradient
    1129              * @see JXG.GeometryElement#gradientStartOffset
    1130              * @default 1.0
    1131              */
    1132             gradientEndOffset: 1.0,
    1133
    1134
    1135             /**
    1136              * Angle (in radians) of the gradiant in case the gradient is of type 'linear'.
    1137              * If the angle is 0, the first color is on the left and the second color is on the right.
    1138              * If the angle is pi/4 the first color is on top and the second color at the
    1139              * bottom.
    1140              * @type Number
    1141              * @name JXG.GeometryElement#gradientAngle
    1142              * @see JXG.GeometryElement#gradient
    1143              * @default 0
    1144              */
    1145             gradientAngle: 0,
    1146
    1147             /**
    1148              * From the SVG specification: ‘cx’, ‘cy’ and ‘r’ define the largest (i.e., outermost) circle for the radial gradient.
    1149              * The gradient will be drawn such that the 100% gradient stop is mapped to the perimeter of this largest (i.e., outermost) circle.
    1150              * For radial gradients in canvas this is the value 'x1'.
    1151              * Takes a value between 0 and 1.
    1152              * @type Number
    1153              * @name JXG.GeometryElement#gradientCX
    1154              * @see JXG.GeometryElement#gradient
    1155              * @see JXG.GeometryElement#gradientCY
    1156              * @see JXG.GeometryElement#gradientR
    1157              * @default 0.5
    1158              */
    1159             gradientCX: 0.5,
    1160
    1161             /**
    1162              * From the SVG specification: ‘cx’, ‘cy’ and ‘r’ define the largest (i.e., outermost) circle for the radial gradient.
    1163              * The gradient will be drawn such that the 100% gradient stop is mapped to the perimeter of this largest (i.e., outermost) circle.
    1164              * For radial gradients in canvas this is the value 'y1'.
    1165              * Takes a value between 0 and 1.
    1166              * @type Number
    1167              * @name JXG.GeometryElement#gradientCY
    1168              * @see JXG.GeometryElement#gradient
    1169              * @see JXG.GeometryElement#gradientCX
    1170              * @see JXG.GeometryElement#gradientR
    1171              * @default 0.5
    1172              */
    1173             gradientCY: 0.5,
    1174
    1175             /**
    1176              * From the SVG specification: ‘cx’, ‘cy’ and ‘r’ define the largest (i.e., outermost) circle for the radial gradient.
    1177              * The gradient will be drawn such that the 100% gradient stop is mapped to the perimeter of this largest (i.e., outermost) circle.
    1178              * For radial gradients in canvas this is the value 'r1'.
    1179              * Takes a value between 0 and 1.
    1180              * @type Number
    1181              * @name JXG.GeometryElement#gradientR
    1182              * @see JXG.GeometryElement#gradient
    1183              * @see JXG.GeometryElement#gradientCX
    1184              * @see JXG.GeometryElement#gradientCY
    1185              * @default 0.5
    1186              */
    1187             gradientR: 0.5,
    1188
    1189             /**
    1190              * ‘fx’ and ‘fy’ define the focal point for the radial gradient.
    1191              * The gradient will be drawn such that the 0% gradient stop is mapped to (fx, fy).
    1192              * For radial gradients in canvas this is the value 'x0'.
    1193              * Takes a value between 0 and 1.
    1194              * @type Number
    1195              * @name JXG.GeometryElement#gradientFX
    1196              * @see JXG.GeometryElement#gradient
    1197              * @see JXG.GeometryElement#gradientFY
    1198              * @see JXG.GeometryElement#gradientFR
    1199              * @default 0.5
    1200              */
    1201             gradientFX: 0.5,
    1202
    1203             /**
    1204              * y-coordinate of the circle center for the second color in case of gradient 'radial'. (The attribute fy in SVG)
    1205              * For radial gradients in canvas this is the value 'y0'.
    1206              * Takes a value between 0 and 1.
    1207              * @type Number
    1208              * @name JXG.GeometryElement#gradientFY
    1209              * @see JXG.GeometryElement#gradient
    1210              * @see JXG.GeometryElement#gradientFX
    1211              * @see JXG.GeometryElement#gradientFR
    1212              * @default 0.5
    1213              */
    1214             gradientFY: 0.5,
    1215
    1216             /**
    1217              * This attribute defines the radius of the start circle of the radial gradient.
    1218              * The gradient will be drawn such that the 0% <stop> is mapped to the perimeter of the start circle.
    1219              * For radial gradients in canvas this is the value 'r0'.
    1220              * Takes a value between 0 and 1.
    1221              * @type Number
    1222              * @name JXG.GeometryElement#gradientFR
    1223              * @see JXG.GeometryElement#gradient
    1224              * @see JXG.GeometryElement#gradientFX
    1225              * @see JXG.GeometryElement#gradientFY
    1226              * @default 0.0
    1227              */
    1228             gradientFR: 0.0,
    1229
    1230             /**
    1231              * Transition duration (in milliseconds) for color and opacity
    1232              * changes. Works in SVG renderer, only.
    1233              * @type Number
    1234              * @name JXG.GeometryElement#transitionDuration
    1235              * @see JXG.GeometryElement#strokeColor
    1236              * @see JXG.GeometryElement#highlightStrokeColor
    1237              * @see JXG.GeometryElement#strokeOpacity
    1238              * @see JXG.GeometryElement#highlightStrokeOpacity
    1239              * @see JXG.GeometryElement#fillColor
    1240              * @see JXG.GeometryElement#highlightFillColor
    1241              * @see JXG.GeometryElement#fillOpacity
    1242              * @see JXG.GeometryElement#highlightFillOpacity
    1243              * @default {@link JXG.Options.elements#transitionDuration}
    1244              */
    1245             transitionDuration: 100,
    1246
    1247             /**
    1248              * Width of the element's stroke.
    1249              * @type Number
    1250              * @name JXG.GeometryElement#strokeWidth
    1251              * @see JXG.GeometryElement#strokeColor
    1252              * @see JXG.GeometryElement#highlightStrokeColor
    1253              * @see JXG.GeometryElement#strokeOpacity
    1254              * @see JXG.GeometryElement#highlightStrokeOpacity
    1255              * @default {@link JXG.Options.elements#strokeWidth}
    1256              */
    1257             strokeWidth: 2,
    1258
    1259             /**
    1260              * Width of the element's stroke when the mouse is pointed over it.
    1261              * @type Number
    1262              * @name JXG.GeometryElement#highlightStrokeWidth
    1263              * @see JXG.GeometryElement#strokeColor
    1264              * @see JXG.GeometryElement#highlightStrokeColor
    1265              * @see JXG.GeometryElement#strokeOpacity
    1266              * @see JXG.GeometryElement#highlightStrokeOpacity
    1267              * @see JXG.GeometryElement#highlightFillColor
    1268              * @default {@link JXG.Options.elements#strokeWidth}
    1269              */
    1270             highlightStrokeWidth: 2,
    1271
    1272             /**
    1273              * If true the element is fixed and can not be dragged around. The element
    1274              * will be repositioned on zoom and moveOrigin events.
    1275              * @type Boolean
    1276              * @default false
    1277              * @name JXG.GeometryElement#fixed
    1278              */
    1279             fixed: false,
    1280
    1281             /**
    1282              * If true the element is fixed and can not be dragged around. The element
    1283              * will even stay at its position on zoom and moveOrigin events.
    1284              * Only free elements like points, texts, curves can be frozen.
    1285              * @type Boolean
    1286              * @default false
    1287              * @name JXG.GeometryElement#frozen
    1288              */
    1289             frozen: false,
    1290
    1291             /**
    1292              * If true a label will display the element's name.
    1293              * @type Boolean
    1294              * @default false
    1295              * @name JXG.GeometryElement#withLabel
    1296              */
    1297             withLabel: false,
    1298
    1299             /**
    1300              * If false the element won't be visible on the board, otherwise it is shown.
    1301              * @type Boolean
    1302              * @name JXG.GeometryElement#visible
    1303              * @see JXG.GeometryElement#hideElement
    1304              * @see JXG.GeometryElement#showElement
    1305              * @default true
    1306              */
    1307             visible: true,
    1308
    1309             /**
    1310              * A private element will be inaccessible in certain environments, e.g. a graphical user interface.
    1311              * @default false
    1312              */
    1313             priv: false,
    1314
    1315             /**
    1316              * Display layer which will contain the element.
    1317              * @see JXG.Options#layer
    1318              * @default See {@link JXG.Options#layer}
    1319              */
    1320             layer: 0,
    1321
    1322             /**
    1323              * Determines the elements border-style.
    1324              * Possible values are:
    1325              * <ul><li>0 for a solid line</li>
    1326              * <li>1 for a dotted line</li>
    1327              * <li>2 for a line with small dashes</li>
    1328
    1329
    1330              * <li>3 for a line with medium dashes</li>
    1331              * <li>4 for a line with big dashes</li>
    1332              * <li>5 for a line with alternating medium and big dashes and large gaps</li>
    1333              * <li>6 for a line with alternating medium and big dashes and small gaps</li></ul>
    1334              * @type Number
    1335              * @name JXG.GeometryElement#dash
    1336              * @default 0
    1337              */
    1338             dash: 0,
    1339
    1340             /**
    1341              * If true the element will get a shadow.
    1342              * @type Boolean
    1343              * @name JXG.GeometryElement#shadow
    1344              * @default false
    1345              */
    1346             shadow: false,
    1347
    1348             /**
    1349              * If true the element will be traced, i.e. on every movement the element will be copied
    1350              * to the background. Use {@link JXG.GeometryElement#clearTrace} to delete the trace elements.
    1351              *
    1352              * The calling of element.setAttribute({trace:false}) additionally
    1353              * deletes all traces of this element. By calling
    1354              * element.setAttribute({trace:'pause'})
    1355              * the removal of already existing traces can be prevented.
    1356              * @see JXG.GeometryElement#clearTrace
    1357              * @see JXG.GeometryElement#traces
    1358              * @see JXG.GeometryElement#numTraces
    1359              * @type Boolean|String
    1360              * @default false
    1361              * @name JXG.GeometryElement#trace
    1362              */
    1363             trace: false,
    1364
    1365             /**
    1366              * Extra visual properties for traces of an element
    1367              * @type Object
    1368              * @see JXG.GeometryElement#trace
    1369              * @name JXG.GeometryElement#traceAttributes
    1370              */
    1371             traceAttributes: {},
    1372
    1373             /**
    1374              *
    1375              * @type Boolean
    1376              * @default true
    1377              * @name JXG.GeometryElement#highlight
    1378              */
    1379             highlight: true,
    1380
    1381             /**
    1382              * If this is set to true, the element is updated in every update
    1383              * call of the board. If set to false, the element is updated only after
    1384              * zoom events or more generally, when the bounding box has been changed.
    1385              * Examples for the latter behaviour should be axes.
    1386              * @type Boolean
    1387              * @default true
    1388              * @see JXG.GeometryElement#needsRegularUpdate
    1389              * @name JXG.GeometryElement#needsRegularUpdate
    1390              */
    1391             needsRegularUpdate: true,
    1392
    1393             /**
    1394              * Snaps the element or its parents to the grid. Currently only relevant for points, circles,
    1395              * and lines. Points are snapped to grid directly, on circles and lines it's only the parent
    1396              * points that are snapped
    1397              * @type Boolean
    1398              * @default false
    1399              * @name JXG.GeometryElement#snapToGrid
    1400              */
    1401             snapToGrid: false,
    1402
    1403             /**
    1404              * Determines whether two-finger manipulation of this object may change its size.
    1405              * If set to false, the object is only rotated and translated.
    1406              * <p>
    1407              * In case the element is a horizontal or vertical line having ticks, "scalable:true"
    1408              * enables zooming of the board by dragging ticks lines. This feature is enabled,
    1409              * for the ticks element of the line element the attribute "fixed" has to be false
    1410              * and the line element's scalable attribute has to be true.
    1411              * <p>
    1412              * In case the element is a polygon or line and it has the attribute "scalable:false",
    1413              * moving the element with two fingers results in a rotation or translation.
    1414              *
    1415              * @type Boolean
    1416              * @default true
    1417              * @name JXG.GeometryElement#scalable
    1418              * @see JXG.Ticks#fixed
    1419              */
    1420             scalable: true,
    1421
    1422             /**
    1423              * If the element is dragged it will be moved on mousedown or touchstart to the
    1424              * top of its layer. Works only for SVG renderer and for simple elements
    1425              * consisting of one SVG node.
    1426              * @example
    1427              * var li1 = board.create('line', [1, 1, 1], {strokeWidth: 20, dragToTopOfLayer: true});
    1428              * var li2 = board.create('line', [1, -1, 1], {strokeWidth: 20, strokeColor: 'red'});
    1429              *
    1430              * </pre><div id="JXG38449fee-1ab4-44de-b7d1-43caa1f50f86" class="jxgbox" style="width: 300px; height: 300px;"></div>
    1431              * <script type="text/javascript">
    1432              *     (function() {
    1433              *         var board = JXG.JSXGraph.initBoard('JXG38449fee-1ab4-44de-b7d1-43caa1f50f86',
    1434              *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false, shownavigation: false});
    1435              *     var li1 = board.create('line', [1, 1, 1], {strokeWidth: 20, dragToTopOfLayer: true});
    1436              *     var li2 = board.create('line', [1, -1, 1], {strokeWidth: 20, strokeColor: 'red'});
    1437              *
    1438              *     })();
    1439              *
    1440              * </script><pre>
    1441              *
    1442              * @type Boolean
    1443              * @default false
    1444              * @name JXG.GeometryElement#dragToTopOfLayer
    1445              */
    1446             dragToTopOfLayer: false,
    1447
    1448             /**
    1449              * Precision options for JSXGraph elements.
    1450              * This attributes takes either the value 'inherit' or an object of the form:
    1451              * <pre>
    1452              * precision: {
    1453              *      touch: 30,
    1454              *      mouse: 4,
    1455              *      pen: 4
    1456              * }
    1457              * </pre>
    1458              *
    1459              * In the first case, the global, JSXGraph-wide values of JXGraph.Options.precision
    1460              * are taken.
    1461              *
    1462              * @type {String|Object}
    1463              * @name JXG.GeometryElement#precision
    1464              * @see JXG.Options#precision
    1465              * @default 'inherit'
    1466              */
    1467             precision: 'inherit',
    1468
    1469             /*draft options */
    1470             draft: {
    1471                 /**
    1472                  * If true the element will be drawn in grey scale colors to visualize that it's only a draft.
    1473                  * @type Boolean
    1474                  * @name JXG.GeometryElement#draft
    1475                  * @default {@link JXG.Options.elements.draft#draft}
    1476                  */
    1477                 draft: false,
    1478                 strokeColor: '#565656',
    1479                 fillColor: '#565656',
    1480                 strokeOpacity: 0.8,
    1481                 fillOpacity: 0.8,
    1482                 strokeWidth: 1
    1483             },
    1484
    1485             /**
    1486              * @private
    1487              * By default, an element is not a label. Do not change this.
    1488              */
    1489             isLabel: false,
    1490
    1491             /**
    1492              * Controls if an element can get the focus with the tab key.
    1493              * See <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex">descriptiona at MDN</a>.
    1494              * The additional value null completely disables focus of an element.
    1495              * The value will be ignored if keyboard control of the board is not enabled or
    1496              * the element is fixed or not visible.
    1497              *
    1498              * @name JXG.GeometryElement#tabindex
    1499              * @type Number
    1500              * @default 0
    1501              * @see JXG.Board#keyboard
    1502              * @see JXG.GeometryElement#fixed
    1503              * @see JXG.GeometryElement#visible
    1504              */
    1505             tabindex: 0
    1506
    1507             // close the meta tag
    1508             /**#@-*/
    1509         },
    1510
    1511          /*
    1512           *  Generic options used by {@link JXG.Ticks}
    1513           */
    1514         ticks: {
    1515             /**#@+
    1516              * @visprop
    1517              */
    1518
    1519             /**
    1520              * A function that expects two {@link JXG.Coords}, the first one representing the coordinates of the
    1521              * tick that is to be labeled, the second one the coordinates of the center (the tick with position 0).
    1522              *
    1523              * @type function
    1524              * @name Ticks#generateLabelText
    1525              */
    1526             generateLabelText: null,
    1527
    1528             /**
    1529              * A function that expects two {@link JXG.Coords}, the first one representing the coordinates of the
    1530              * tick that is to be labeled, the second one the coordinates of the center (the tick with position 0).
    1531              *
    1532              * @deprecated Use {@link JGX.Options@generateLabelValue}
    1533              * @type function
    1534              * @name Ticks#generateLabelValue
    1535              */
    1536             generateLabelValue: null,
    1537
    1538             /**
    1539              * Draw labels yes/no
    1540              *
    1541              * @type Boolean
    1542              * @name Ticks#drawLabels
    1543              * @default false
    1544              */
    1545             drawLabels: false,
    1546
    1547             /**
    1548              * Attributes for the ticks labels
    1549              *
    1550              * @name Ticks#label
    1551              * @type Object
    1552              * @default {}
    1553              *
    1554              */
    1555             label: {
    1556             },
    1557
    1558             /**
    1559             * Format tick labels that were going to have scientific notation
    1560             * like 5.00e+6 to look like 5•10⁶.
    1561             *
    1562             * @example
    1563             * var board = JXG.JSXGraph.initBoard("jxgbox", {
    1564             *     boundingbox: [-500000, 500000, 500000, -500000],
    1565             *     axis: true,
    1566             *     defaultAxes: {
    1567             *         x: {
    1568             *             scalable: true,
    1569             *             ticks: {
    1570             *                 beautifulScientificTickLabels: true
    1571             *           },
    1572             *         },
    1573             *         y: {
    1574             *             scalable: true,
    1575             *             ticks: {
    1576             *                 beautifulScientificTickLabels: true
    1577             *           },
    1578             *         }
    1579             *     },
    1580             * });
    1581             *
    1582             * </pre><div id="JXGc1e46cd1-e025-4002-80aa-b450869fdaa2" class="jxgbox" style="width: 300px; height: 300px;"></div>
    1583             * <script type="text/javascript">
    1584             *     (function() {
    1585             *     var board = JXG.JSXGraph.initBoard('JXGc1e46cd1-e025-4002-80aa-b450869fdaa2', {
    1586             *         boundingbox: [-500000, 500000, 500000, -500000],
    1587             *         showcopyright: false, shownavigation: false,
    1588             *         axis: true,
    1589             *         defaultAxes: {
    1590             *             x: {
    1591             *                 scalable: true,
    1592             *                 ticks: {
    1593             *                     beautifulScientificTickLabels: true
    1594             *               },
    1595             *             },
    1596             *             y: {
    1597             *                 scalable: true,
    1598             *                 ticks: {
    1599             *                     beautifulScientificTickLabels: true
    1600             *               },
    1601             *             }
    1602             *         },
    1603             *     });
    1604             *
    1605             *     })();
    1606             *
    1607             * </script><pre>
    1608             *
    1609             * @name Ticks#beautifulScientificTickLabels
    1610             * @type Boolean
    1611             * @default false
    1612             */
    1613             beautifulScientificTickLabels: false,
    1614
    1615             /**
    1616              * Use the unicode character 0x2212, i.e. the HTML entity &minus; as minus sign.
    1617              * That is −1 instead of -1.
    1618              *
    1619              * @type Boolean
    1620              * @name Ticks#useUnicodeMinus
    1621              * @default true
    1622              */
    1623             useUnicodeMinus: true,
    1624
    1625             /**
    1626              * Determine the position of the tick with value 0. 'left' means point1 of the line, 'right' means point2,
    1627              * and 'middle' is equivalent to the midpoint of the defining points. This attribute is ignored if the parent
    1628              * line is of type axis.
    1629              *
    1630              * @type String
    1631              * @name Ticks#anchor
    1632              * @default 'left'
    1633              */
    1634             anchor: 'left',
    1635
    1636             /**
    1637              * Draw the zero tick, that lies at line.point1?
    1638              *
    1639              * @type Boolean
    1640              * @name Ticks#drawZero
    1641              * @default false
    1642              */
    1643             drawZero: false,
    1644
    1645             /**
    1646              * If the distance between two ticks is too big we could insert new ticks. If insertTicks
    1647              * is <tt>true</tt>, we'll do so, otherwise we leave the distance as is.
    1648              * This option is ignored if equidistant is false. In the example below the distance between
    1649              * two ticks is given as <tt>1</tt> but because insertTicks is set to true many ticks will
    1650              * be omitted in the rendering process to keep the display clear.
    1651              *
    1652              * @type Boolean
    1653              * @name Ticks#insertTicks
    1654              * @see Ticks#minTicksDistance
    1655              * @default false
    1656              * @example
    1657              * // Create an axis providing two coord pairs.
    1658              *   var p1 = board.create('point', [0, 0]);
    1659              *   var p2 = board.create('point', [50, 25]);
    1660              *   var l1 = board.create('line', [p1, p2]);
    1661              *   var t = board.create('ticks', [l1, 1], {
    1662              *      insertTicks: true,
    1663              *      majorHeight: -1,
    1664              *      label: {
    1665              *          offset: [4, -9]
    1666              *      },
    1667              *      drawLabels: true
    1668              *  });
    1669              * </pre><div class="jxgbox" id="JXG2f6fb842-40bd-4223-aa28-3e9369d2097f" style="width: 300px; height: 300px;"></div>
    1670              * <script type="text/javascript">
    1671              * (function () {
    1672              *   var board = JXG.JSXGraph.initBoard('JXG2f6fb842-40bd-4223-aa28-3e9369d2097f', {boundingbox: [-100, 70, 70, -100], showcopyright: false, shownavigation: false});
    1673              *   var p1 = board.create('point', [0, 0]);
    1674              *   var p2 = board.create('point', [50, 25]);
    1675              *   var l1 = board.create('line', [p1, p2]);
    1676              *   var t = board.create('ticks', [l1, 1], {insertTicks: true, majorHeight: -1, label: {offset: [4, -9]}, drawLabels: true});
    1677              * })();
    1678              * </script><pre>
    1679              */
    1680             insertTicks: false,
    1681
    1682             /**
    1683              * Minimum distance in pixel of equidistant ticks in case insertTicks==true.
    1684              * @name Ticks#minTicksDistance
    1685              * @type: Number
    1686              * @default: 10
    1687              * @see Ticks#insertTicks
    1688              */
    1689             minTicksDistance: 10,
    1690
    1691             /**
    1692              * Total height of a minor tick. If negative the full height of the board is taken.
    1693              *
    1694              * @type Number
    1695              * @name Ticks#minorHeight
    1696              * @default 4
    1697              */
    1698             minorHeight: 4,
    1699
    1700             /**
    1701              * Total height of a major tick. If negative the full height of the board is taken.
    1702              *
    1703              * @type Number
    1704              * @name Ticks#majorHeight
    1705              * @default 10
    1706              */
    1707             majorHeight: 10,
    1708
    1709             /**
    1710              * Decides in which direction finite ticks are visible. Possible values are either the constants
    1711              * 0=false or 1=true or a function returning 0 or 1.
    1712              *
    1713              * In case of [0,1] the tick is only visible to the right of the line. In case of
    1714              * [1,0] the tick is only visible to the left of the line.
    1715              *
    1716              * @type Array
    1717              * @name Ticks#tickEndings
    1718              * @default [1, 1]
    1719              */
    1720             tickEndings: [1, 1],
    1721
    1722             /**
    1723              * The number of minor ticks between two major ticks.
    1724              * @type Number
    1725              * @name Ticks#minorTicks
    1726              * @default 4
    1727              */
    1728             minorTicks: 4,
    1729
    1730             /**
    1731              * Scale the ticks but not the tick labels.
    1732              * @type Number
    1733              * @default 1
    1734              * @name Ticks#scale
    1735              * @see Ticks#scaleSymbol
    1736              */
    1737             scale: 1,
    1738
    1739             /**
    1740              * A string that is appended to every tick, used to represent the scale
    1741              * factor given in {@link Ticks#scaleSymbol}.
    1742              *
    1743              * @type String
    1744              * @default ''
    1745              * @name Ticks#scaleSymbol
    1746              * @see Ticks#scale
    1747              */
    1748             scaleSymbol: '',
    1749
    1750             /**
    1751              * User defined labels for special ticks. Instead of the i-th tick's position, the i-th string stored in this array
    1752              * is shown. If the number of strings in this array is less than the number of special ticks, the tick's position is
    1753              * shown as a fallback.
    1754              *
    1755              * @type Array
    1756              * @name Ticks#labels
    1757              * @default []
    1758              */
    1759             labels: [],
    1760
    1761             /**
    1762              * The maximum number of characters a tick label can use.
    1763              *
    1764              * @type Number
    1765              * @name Ticks#maxLabelLength
    1766              * @see Ticks#precision
    1767              * @default 5
    1768              */
    1769             maxLabelLength: 5,
    1770
    1771             /**
    1772              * If a label exceeds {@link Ticks#maxLabelLength} this determines the precision used to shorten the tick label.
    1773              * Replaced by the digits attribute.
    1774              *
    1775              * @type Number
    1776              * @name Ticks#precision
    1777              * @see Ticks#maxLabelLength
    1778              * @see Ticks#digits
    1779              * @deprecated
    1780              * @default 3
    1781              */
    1782             precision: 3,
    1783
    1784             /**
    1785              * If a label exceeds {@link Ticks#maxLabelLength} this determines the number of digits used to shorten the tick label.
    1786              *
    1787              * @type Number
    1788              * @name Ticks#digits
    1789              * @see Ticks#maxLabelLength
    1790              * @deprecated
    1791              * @default 3
    1792              */
    1793             digits: 3,
    1794
    1795             /**
    1796              * The default distance between two ticks. Please be aware that this value does not have
    1797              * to be used if {@link Ticks#insertTicks} is set to true.
    1798              *
    1799              * @type Number
    1800              * @name Ticks#ticksDistance
    1801              * @see Ticks#insertTicks
    1802              * @default 1
    1803              */
    1804             ticksDistance: 1,
    1805
    1806             /**
    1807              * Tick face for ticks of finite length.  By default (face: '|') this is a straight line.
    1808              * Possible other values are '<' and '>'. These faces are used in
    1809              * {@link JXG.Hatch} for hatch marking parallel lines.
    1810              * @type String
    1811              * @name{Ticks#face}
    1812              * @see hatch
    1813              * @default '|'
    1814              * @example
    1815              *   var p1 = board.create('point', [0, 3]);
    1816              *   var p2 = board.create('point', [1, 3]);
    1817              *   var l1 = board.create('line', [p1, p2]);
    1818              *   var t = board.create('ticks', [l1], {ticksDistance: 2, face: '>'});
    1819              *
    1820              * </pre><div id="JXG950a568a-1264-4e3a-b61d-b6881feecf4b" class="jxgbox" style="width: 300px; height: 300px;"></div>
    1821              * <script type="text/javascript">
    1822              *     (function() {
    1823              *         var board = JXG.JSXGraph.initBoard('JXG950a568a-1264-4e3a-b61d-b6881feecf4b',
    1824              *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false, shownavigation: false});
    1825              *       var p1 = board.create('point', [0, 3]);
    1826              *       var p2 = board.create('point', [1, 3]);
    1827              *       var l1 = board.create('line', [p1, p2]);
    1828              *       var t = board.create('ticks', [l1], {ticksDistance: 2, face: '>'});
    1829              *
    1830              *     })();
    1831              *
    1832              * </script><pre>
    1833              *
    1834              */
    1835             face: '|',
    1836
    1837             strokeOpacity: 1,
    1838             strokeWidth: 1,
    1839             strokeColor: '#000000',
    1840             highlightStrokeColor: '#888888',
    1841             fillColor: 'none',
    1842             highlightFillColor: 'none',
    1843             visible: 'inherit',
    1844
    1845             /**
    1846              * Whether line boundaries should be counted or not in the lower and upper bounds when
    1847              * creating ticks.
    1848              *
    1849              * @type Boolean
    1850              * @name Ticks#includeBoundaries
    1851              * @default false
    1852              */
    1853             includeBoundaries: false,
    1854
    1855             /**
    1856              * Set the ticks type.
    1857              * Possible values are 'linear' or 'polar'.
    1858              *
    1859              * @type String
    1860              * @name Ticks#type
    1861              * @default 'linear'
    1862              */
    1863             type: 'linear'
    1864
    1865             // close the meta tag
    1866             /**#@-*/
    1867         },
    1868
    1869          /*
    1870           *  Generic options used by {@link JXG.Hatch}
    1871           */
    1872         hatch: {
    1873             drawLabels: false,
    1874             drawZero: true,
    1875             majorHeight: 20,
    1876             anchor: 'middle',
    1877             face: '|',
    1878             strokeWidth: 2,
    1879             strokeColor: Color.palette.blue,
    1880             ticksDistance: 0.2
    1881         },
    1882
    1883         /**
    1884          * Precision options, defining how close a pointer device (mouse, finger, pen) has to be
    1885          * to an object such that the object is highlighted or can be dragged.
    1886          * These values are board-wide and can be overwritten for individual elements by
    1887          * changing their precision attribute.
    1888          *
    1889          * The default values are
    1890          * <pre>
    1891          * JXG.Options.precision: {
    1892          *   touch: 30,
    1893          *   touchMax: 100,
    1894          *   mouse: 4,
    1895          *   pen: 4,
    1896          *   epsilon: 0.0001,
    1897          *   hasPoint: 4
    1898          * }
    1899          * </pre>
    1900          *
    1901          * @type Object
    1902          * @name JXG.Options#precision
    1903          * @see JXG.GeometryElement#precision
    1904          */
    1905         precision: {
    1906             touch: 30,
    1907             touchMax: 100,
    1908             mouse: 4,
    1909             pen: 4,
    1910             epsilon: 0.0001, // Unused
    1911             hasPoint: 4
    1912         },
    1913
    1914         /**
    1915          * Default ordering of the layers.
    1916          * The numbering starts from 0 and the highest layer number is numlayers-1.
    1917          *
    1918          * The default values are
    1919          * <pre>
    1920          * JXG.Options.layer: {
    1921          *   numlayers: 20, // only important in SVG
    1922          *   text: 9,
    1923          *   point: 9,
    1924          *   glider: 9,
    1925          *   arc: 8,
    1926          *   line: 7,
    1927          *   circle: 6,
    1928          *   curve: 5,
    1929          *   turtle: 5,
    1930          *   polygon: 3,
    1931          *   sector: 3,
    1932          *   angle: 3,
    1933          *   integral: 3,
    1934          *   axis: 2,
    1935          *   ticks: 2,
    1936          *   grid: 1,
    1937          *   image: 0,
    1938          *   trace: 0
    1939          * }
    1940          * </pre>
    1941          * @type Object
    1942          * @name JXG.Options#layer
    1943          */
    1944         layer: {
    1945             numlayers: 20, // only important in SVG
    1946             unused9: 19,
    1947             unused8: 18,
    1948             unused7: 17,
    1949             unused6: 16,
    1950             unused5: 15,
    1951             unused4: 14,
    1952             unused3: 13,
    1953             unused2: 12,
    1954             unused1: 11,
    1955             unused0: 10,
    1956             text: 9,
    1957             point: 9,
    1958             glider: 9,
    1959             arc: 8,
    1960             line: 7,
    1961             circle: 6,
    1962             curve: 5,
    1963             turtle: 5,
    1964             polygon: 3,
    1965             sector: 3,
    1966             angle: 3,
    1967             integral: 3,
    1968             axis: 2,
    1969             ticks: 2,
    1970             grid: 1,
    1971             image: 0,
    1972             trace: 0
    1973         },
    1974
    1975         /* special angle options */
    1976         angle: {
    1977             /**#@+
    1978              * @visprop
    1979              */
    1980
    1981             withLabel: true,
    1982
    1983             /**
    1984              * Radius of the sector, displaying the angle.
    1985              * The radius can be given as number (in user coordinates)
    1986              * or as string 'auto'. In the latter case, the angle
    1987              * is set to an value between 20 and 50 px.
    1988              *
    1989              * @type {Number|String}
    1990              * @name Angle#radius
    1991              * @default 'auto'
    1992              * @visprop
    1993              */
    1994             radius: 'auto',
    1995
    1996             /**
    1997              * Display type of the angle field. Possible values are
    1998              * 'sector' or 'sectordot' or 'square' or 'none'.
    1999              *
    2000              * @type String
    2001              * @default 'sector'
    2002              * @name Angle#type
    2003              * @visprop
    2004              */
    2005             type: 'sector',
    2006
    2007             /**
    2008              * Display type of the angle field in case of a right angle. Possible values are
    2009              * 'sector' or 'sectordot' or 'square' or 'none'.
    2010              *
    2011              * @type String
    2012              * @default square
    2013              * @name Angle#orthoType
    2014              * @see Angle#orthoSensitivity
    2015              * @visprop
    2016              */
    2017             orthoType: 'square',
    2018
    2019             /**
    2020              * Sensitivity (in degrees) to declare an angle as right angle.
    2021              * If the angle measure is inside this distance from a rigth angle, the orthoType
    2022              * of the angle is used for display.
    2023              *
    2024              * @type Number
    2025              * @default 1.0
    2026              * @name Angle#orthoSensitivity
    2027              * @see Angle#orthoType
    2028              * @visprop
    2029              */
    2030             orthoSensitivity: 1.0,
    2031
    2032             fillColor: Color.palette.orange,
    2033             highlightFillColor: Color.palette.orange,
    2034             strokeColor: Color.palette.orange,
    2035             // fillColor: '#ff7f00',
    2036             // highlightFillColor: '#ff7f00',
    2037             // strokeColor: '#ff7f00',
    2038
    2039             fillOpacity: 0.3,
    2040             highlightFillOpacity: 0.3,
    2041
    2042             /**
    2043              * @deprecated
    2044              */
    2045             radiuspoint: {
    2046                 withLabel: false,
    2047                 visible: false,
    2048                 name: ''
    2049             },
    2050
    2051             /**
    2052              * @deprecated
    2053              */
    2054             pointsquare: {
    2055                 withLabel: false,
    2056                 visible: false,
    2057                 name: ''
    2058             },
    2059
    2060             dot: {
    2061                 visible: false,
    2062                 strokeColor: 'none',
    2063                 fillColor: '#000000',
    2064                 size: 2,
    2065                 face: 'o',
    2066                 withLabel: false,
    2067                 name: ''
    2068             },
    2069
    2070             label: {
    2071                 position: 'top',
    2072                 offset: [0, 0],
    2073                 strokeColor: Color.palette.blue
    2074             },
    2075
    2076             /**
    2077              * Attributes for sub-element arc. In general, the arc will run through the first point and
    2078              * thus will not have the same radius as the angle sector.
    2079              *
    2080              * @type Arc
    2081              * @name Angle#arc
    2082              * @default '{visible:false}'
    2083              */
    2084             arc: {
    2085                 visible: false,
    2086                 fillColor: 'none'
    2087             },
    2088
    2089             /**#@-*/
    2090         },
    2091
    2092         /* special arc options */
    2093         arc: {
    2094             /**#@+
    2095              * @visprop
    2096              */
    2097
    2098             /**
    2099              * Type of arc. Possible values are 'minor', 'major', and 'auto'.
    2100              *
    2101              * @type String
    2102              * @name Arc#selection
    2103              * @default 'auto'
    2104              */
    2105             selection: 'auto',
    2106
    2107             /**
    2108              * If <tt>true</tt>, moving the mouse over inner points triggers hasPoint.
    2109              *
    2110              * @see JXG.GeometryElement#hasPoint
    2111              * @name Arc#hasInnerPoints
    2112              * @type Boolean
    2113              * @default false
    2114              */
    2115             hasInnerPoints: false,
    2116
    2117             label: {
    2118                 anchorX: 'auto',
    2119                 anchorY: 'auto'
    2120             },
    2121             firstArrow: false,
    2122             lastArrow: false,
    2123             fillColor: 'none',
    2124             highlightFillColor: 'none',
    2125             strokeColor: Color.palette.blue,
    2126             highlightStrokeColor: '#c3d9ff',
    2127             useDirection: false,
    2128
    2129             /**
    2130              * Attributes for center point.
    2131              *
    2132              * @type Point
    2133              * @name Arc#center
    2134              */
    2135             center: {
    2136             },
    2137
    2138             /**
    2139              * Attributes for radius point.
    2140              *
    2141              * @type Point
    2142              * @name Arc#radiusPoint
    2143              */
    2144             radiusPoint: {
    2145             },
    2146
    2147             /**
    2148              * Attributes for angle point.
    2149              *
    2150              * @type Point
    2151              * @name Arc#anglePoint
    2152              */
    2153             anglePoint: {
    2154             }
    2155
    2156             /**#@-*/
    2157         },
    2158
    2159         /* special arrow options */
    2160         arrow: {
    2161             /**#@+
    2162              * @visprop
    2163              */
    2164
    2165             firstArrow: false,
    2166
    2167             lastArrow: {
    2168                 type: 1,
    2169                 highlightSize: 6,
    2170                 size: 6
    2171             }
    2172
    2173             /**#@-*/
    2174         },
    2175
    2176         /* special axis options */
    2177         axis: {
    2178             /**#@+
    2179              * @visprop
    2180              */
    2181
    2182             name: '',                            // By default, do not generate names for axes.
    2183             needsRegularUpdate: false,           // Axes only updated after zooming and moving of the origin.
    2184             strokeWidth: 1,
    2185             lastArrow: {
    2186                 type: 1,
    2187                 highlightSize: 8,
    2188                 size: 8
    2189             },
    2190             strokeColor: '#666666',
    2191             highlightStrokeWidth: 1,
    2192             highlightStrokeColor: '#888888',
    2193
    2194
    2195             /**
    2196              * Show / hide ticks.
    2197              *
    2198              * Deprecated. Suggested alternative is "ticks: {visible: false}"
    2199              *
    2200              * @type Boolean
    2201              * @name Axis#withTicks
    2202              * @default true
    2203              * @deprecated
    2204              */
    2205             withTicks: true,
    2206             straightFirst: true,
    2207             straightLast: true,
    2208             margin: -4,
    2209             withLabel: false,
    2210             scalable: false,
    2211
    2212             /**
    2213              * Attributes for ticks of the axis.
    2214              *
    2215              * @type Ticks
    2216              * @name Axis#ticks
    2217              */
    2218             ticks: {
    2219                 label: {
    2220                     offset: [4, -12 + 3],     // This seems to be a good offset for 12 point fonts
    2221                     parse: false,
    2222                     needsRegularUpdate: false,
    2223                     display: 'internal',
    2224                     visible: 'inherit',
    2225                     layer: 9
    2226                 },
    2227                 visible: 'inherit',
    2228                 needsRegularUpdate: false,
    2229                 strokeWidth: 1,
    2230                 strokeColor: '#666666',
    2231                 highlightStrokeColor: '#888888',
    2232                 drawLabels: true,
    2233                 drawZero: false,
    2234                 insertTicks: true,
    2235                 minTicksDistance: 5,
    2236                 minorHeight: 10,          // if <0: full width and height
    2237                 majorHeight: -1,          // if <0: full width and height
    2238                 tickEndings: [0, 1],
    2239                 minorTicks: 4,
    2240                 ticksDistance: 1,         // TODO doc
    2241                 strokeOpacity: 0.25
    2242             },
    2243
    2244             /**
    2245              * Attributes for first point the axis.
    2246              *
    2247              * @type Point
    2248              * @name Axis#point1
    2249              */
    2250             point1: {                  // Default values for point1 if created by line
    2251                 needsRegularUpdate: false,
    2252                 visible: false
    2253             },
    2254
    2255             /**
    2256              * Attributes for second point the axis.
    2257              *
    2258              * @type Point
    2259              * @name Axis#point2
    2260              */
    2261             point2: {                  // Default values for point2 if created by line
    2262                 needsRegularUpdate: false,
    2263                 visible: false
    2264             },
    2265
    2266             tabindex: -1,
    2267
    2268             /**
    2269              * Attributes for the axis label.
    2270              *
    2271              * @type Label
    2272              * @name Axis#label
    2273              */
    2274             label: {
    2275                 position: 'lft',
    2276                 offset: [10, 10]
    2277             }
    2278             /**#@-*/
    2279         },
    2280
    2281         /* special options for angle bisector of 3 points */
    2282         bisector: {
    2283             /**#@+
    2284              * @visprop
    2285              */
    2286
    2287             strokeColor: '#000000', // Bisector line
    2288
    2289             /**
    2290              * Attributes for the helper point of the bisector.
    2291              *
    2292              * @type Point
    2293              * @name Bisector#point
    2294              */
    2295             point: {               // Bisector point
    2296                 visible: false,
    2297                 fixed: false,
    2298                 withLabel: false,
    2299                 name: ''
    2300             }
    2301
    2302             /**#@-*/
    2303         },
    2304
    2305         /* special options for the 2 bisectors of 2 lines */
    2306         bisectorlines: {
    2307             /**#@+
    2308              * @visprop
    2309              */
    2310
    2311             /**
    2312              * Attributes for first line.
    2313              *
    2314              * @type Line
    2315              * @name Bisectorlines#line1
    2316              */
    2317             line1: {               //
    2318                 strokeColor: '#000000'
    2319             },
    2320
    2321             /**
    2322              * Attributes for second line.
    2323              *
    2324              * @type Line
    2325              * @name Bisectorlines#line2
    2326              */
    2327             line2: {               //
    2328                 strokeColor: '#000000'
    2329             }
    2330
    2331             /**#@-*/
    2332         },
    2333
    2334         /* special options for boxplot curves */
    2335         boxplot: {
    2336             /**#@+
    2337              * @visprop
    2338              */
    2339
    2340             /**
    2341              *  Direction of the box plot: 'vertical' or 'horizontal'
    2342              *
    2343              * @type String
    2344              * @name Boxplot#dir
    2345              * @default: 'vertical'
    2346              */
    2347             dir: 'vertical',
    2348
    2349             /**
    2350              * Relative width of the maximum and minimum quantile
    2351              *
    2352              * @type Number
    2353              * @name Boxplot#smallWidth
    2354              * @default: 0.5
    2355              */
    2356             smallWidth: 0.5,
    2357
    2358             strokeWidth: 2,
    2359             strokeColor: Color.palette.blue,
    2360             fillColor: Color.palette.blue,
    2361             fillOpacity: 0.2,
    2362             highlightStrokeWidth: 2,
    2363             highlightStrokeColor: Color.palette.blue,
    2364             highlightFillColor: Color.palette.blue,
    2365             highlightFillOpacity: 0.1
    2366
    2367             /**#@-*/
    2368         },
    2369
    2370         /* special button options */
    2371         button: {
    2372             /**#@+
    2373              * @visprop
    2374              */
    2375
    2376             /**
    2377              * Control the attribute "disabled" of the HTML button.
    2378              *
    2379              * @name disabled
    2380              * @memberOf Button.prototype
    2381              *
    2382              * @type Boolean
    2383              * @default false
    2384              */
    2385             disabled: false,
    2386
    2387             display: 'html'
    2388
    2389             /**#@-*/
    2390         },
    2391
    2392         /* special cardinal spline options */
    2393         cardinalspline: {
    2394             /**#@+
    2395              * @visprop
    2396              */
    2397
    2398              /**
    2399               * Controls if the data points of the cardinal spline when given as
    2400               * arrays should be converted into {@link JXG.Points}.
    2401               *
    2402               * @name createPoints
    2403               * @memberOf Cardinalspline.prototype
    2404               *
    2405               * @see Cardinalspline#points
    2406               *
    2407               * @type Boolean
    2408               * @default true
    2409               */
    2410             createPoints: true,
    2411
    2412             /**
    2413              * If set to true, the supplied coordinates are interpreted as
    2414              * [[x_0, y_0], [x_1, y_1], p, ...].
    2415              * Otherwise, if the data consists of two arrays of equal length,
    2416              * it is interpreted as
    2417              * [[x_o x_1, ..., x_n], [y_0, y_1, ..., y_n]]
    2418              *
    2419              * @name isArrayOfCoordinates
    2420              * @memberOf Cardinalspline.prototype
    2421              * @type Boolean
    2422              * @default false
    2423              */
    2424             isArrayOfCoordinates: false,
    2425
    2426             /**
    2427              * Attributes for the points generated by Cardinalspline in cases
    2428              * {@link createPoints} is set to true
    2429              *
    2430              * @name points
    2431              * @memberOf Cardinalspline.prototype
    2432              *
    2433              * @see Cardinalspline#createPoints
    2434              * @type Object
    2435              */
    2436             points: {
    2437                 strokeOpacity: 0.05,
    2438                 fillOpacity: 0.05,
    2439                 highlightStrokeOpacity: 1.0,
    2440                 highlightFillOpacity: 1.0,
    2441                 withLabel: false,
    2442                 name: '',
    2443                 fixed: false
    2444             }
    2445
    2446             /**#@-*/
    2447         },
    2448
    2449         /* special chart options */
    2450         chart: {
    2451             /**#@+
    2452              * @visprop
    2453              */
    2454
    2455             chartStyle: 'line',
    2456             colors: ['#B02B2C', '#3F4C6B', '#C79810', '#D15600', '#FFFF88', '#c3d9ff', '#4096EE', '#008C00'],
    2457             highlightcolors: null,
    2458             fillcolor: null,
    2459             highlightonsector: false,
    2460             highlightbysize: false,
    2461
    2462             fillOpacity: 0.6,
    2463             withLines:  false,
    2464
    2465             label: {
    2466             }
    2467             /**#@-*/
    2468         },
    2469
    2470         /* special html slider options */
    2471         checkbox: {
    2472             /**#@+
    2473              * @visprop
    2474              */
    2475
    2476             /**
    2477              * Control the attribute "disabled" of the HTML checkbox.
    2478              *
    2479              * @name disabled
    2480              * @memberOf Checkbox.prototype
    2481              *
    2482              * @type Boolean
    2483              * @default false
    2484              */
    2485             disabled: false,
    2486
    2487             /**
    2488              * Control the attribute "checked" of the HTML checkbox.
    2489              *
    2490              * @name checked
    2491              * @memberOf Checkbox.prototype
    2492              *
    2493              * @type Boolean
    2494              * @default false
    2495              */
    2496             checked: false,
    2497
    2498             display: 'html'
    2499
    2500             /**#@-*/
    2501         },
    2502
    2503         /*special circle options */
    2504         circle: {
    2505             /**#@+
    2506              * @visprop
    2507              */
    2508
    2509             /**
    2510              * If <tt>true</tt>, moving the mouse over inner points triggers hasPoint.
    2511              *
    2512              * @see JXG.GeometryElement#hasPoint
    2513              * @name Circle#hasInnerPoints
    2514              * @type Boolean
    2515              * @default false
    2516              */
    2517             hasInnerPoints: false,
    2518
    2519             fillColor: 'none',
    2520             highlightFillColor: 'none',
    2521             strokeColor: Color.palette.blue,
    2522             highlightStrokeColor: '#c3d9ff',
    2523
    2524             /**
    2525              * Attributes for center point.
    2526              *
    2527              * @type Point
    2528              * @name Circle#center
    2529              */
    2530             center: {
    2531                 visible: false,
    2532                 withLabel: false,
    2533                 fixed: false,
    2534
    2535                 fillColor: Color.palette.red,
    2536                 strokeColor: Color.palette.red,
    2537                 highlightFillColor: '#c3d9ff',
    2538                 highlightStrokeColor: '#c3d9ff',
    2539
    2540                 name: ''
    2541             },
    2542
    2543             /**
    2544              * Attributes for center point.
    2545              *
    2546              * @type Point
    2547              * @name Circle#center
    2548              */
    2549             point2: {
    2550                 visible: false,
    2551                 withLabel: false,
    2552                 fixed: false,
    2553                 name: ''
    2554             },
    2555
    2556             /**
    2557              * Attributes for circle label.
    2558              *
    2559              * @type Label
    2560              * @name Circle#label
    2561              */
    2562             label: {
    2563                 position: 'urt'
    2564             }
    2565             /**#@-*/
    2566         },
    2567
    2568         /* special options for circumcircle of 3 points */
    2569         circumcircle: {
    2570             /**#@+
    2571              * @visprop
    2572              */
    2573
    2574             fillColor: 'none',
    2575             highlightFillColor: 'none',
    2576             strokeColor: Color.palette.blue,
    2577             highlightStrokeColor: '#c3d9ff',
    2578
    2579             /**
    2580              * Attributes for center point.
    2581              *
    2582              * @type Point
    2583              * @name Circumcircle#center
    2584              */
    2585             center: {               // center point
    2586                 visible: false,
    2587                 fixed: false,
    2588                 withLabel: false,
    2589                 fillColor: Color.palette.red,
    2590                 strokeColor: Color.palette.red,
    2591                 highlightFillColor: '#c3d9ff',
    2592                 highlightStrokeColor: '#c3d9ff',
    2593                 name: ''
    2594             }
    2595             /**#@-*/
    2596         },
    2597
    2598         circumcirclearc: {
    2599             /**#@+
    2600              * @visprop
    2601              */
    2602
    2603             fillColor: 'none',
    2604             highlightFillColor: 'none',
    2605             strokeColor: Color.palette.blue,
    2606             highlightStrokeColor: '#c3d9ff',
    2607
    2608             /**
    2609              * Attributes for center point.
    2610              *
    2611              * @type Point
    2612              * @name CircumcircleArc#center
    2613              */
    2614             center: {
    2615                 visible: false,
    2616                 withLabel: false,
    2617                 fixed: false,
    2618                 name: ''
    2619             }
    2620             /**#@-*/
    2621         },
    2622
    2623         /* special options for circumcircle sector of 3 points */
    2624         circumcirclesector: {
    2625             /**#@+
    2626              * @visprop
    2627              */
    2628
    2629             useDirection: true,
    2630             fillColor: Color.palette.yellow,
    2631             highlightFillColor: Color.palette.yellow,
    2632             fillOpacity: 0.3,
    2633             highlightFillOpacity: 0.3,
    2634             strokeColor: Color.palette.blue,
    2635             highlightStrokeColor: '#c3d9ff',
    2636
    2637             /**
    2638              * Attributes for center point.
    2639              *
    2640              * @type Point
    2641              * @name Circle#point
    2642              */
    2643             point: {
    2644                 visible: false,
    2645                 fixed: false,
    2646                 withLabel: false,
    2647                 name: ''
    2648             }
    2649             /**#@-*/
    2650         },
    2651
    2652         /* special conic options */
    2653         conic: {
    2654             /**#@+
    2655              * @visprop
    2656              */
    2657
    2658             fillColor: 'none',
    2659             highlightFillColor: 'none',
    2660             strokeColor: Color.palette.blue,
    2661             highlightStrokeColor: '#c3d9ff',
    2662
    2663             /**
    2664              * Attributes for foci points.
    2665              *
    2666              * @type Point
    2667              * @name Conic#foci
    2668              */
    2669             foci: {
    2670                 // points
    2671                 fixed: false,
    2672                 visible: false,
    2673                 withLabel: false,
    2674                 name: ''
    2675             },
    2676
    2677             /**
    2678              * Attributes for center point.
    2679              *
    2680              * @type Point
    2681              * @name Conic#center
    2682              */
    2683             center: {
    2684                 visible: false,
    2685                 withLabel: false,
    2686                 name: ''
    2687             },
    2688
    2689             /**
    2690              * Attributes for five points defining the conic, if some of them are given as coordinates.
    2691              *
    2692              * @type Point
    2693              * @name Conic#point
    2694              */
    2695             point: {
    2696                 withLabel: false,
    2697                 name: ''
    2698             },
    2699
    2700             /**
    2701              * Attributes for parabola line in case the line is given by two
    2702              * points or coordinate pairs.
    2703              *
    2704              * @type Line
    2705              * @name Conic#line
    2706              */
    2707             line: {
    2708                 visible: false
    2709             }
    2710
    2711             /**#@-*/
    2712         },
    2713
    2714         /* special curve options */
    2715         curve: {
    2716             strokeWidth: 1,
    2717             strokeColor: Color.palette.blue,
    2718             fillColor: 'none',
    2719             fixed: true,
    2720
    2721             useQDT: false,
    2722
    2723             /**#@+
    2724              * @visprop
    2725              */
    2726
    2727             /**
    2728              * The data points of the curve are not connected with straight lines but with bezier curves.
    2729              * @name Curve#handDrawing
    2730              * @type Boolean
    2731              * @default false
    2732              */
    2733             handDrawing: false,
    2734
    2735             /**
    2736              * The curveType is set in {@link JXG.Curve#generateTerm} and used in {@link JXG.Curve#updateCurve}.
    2737              * Possible values are <ul>
    2738              * <li>'none'</li>
    2739              * <li>'plot': Data plot</li>
    2740              * <li>'parameter': we can not distinguish function graphs and parameter curves</li>
    2741              * <li>'functiongraph': function graph</li>
    2742              * <li>'polar'</li>
    2743              * <li>'implicit' (not yet)</li></ul>
    2744              * Only parameter and plot are set directly. Polar is set with {@link JXG.GeometryElement#setAttribute} only.
    2745              * @name Curve#curveType
    2746              * @type String
    2747              * @default null
    2748              */
    2749             curveType: null,
    2750
    2751             /**
    2752              * Apply Ramer-Douglas-Peuker smoothing.
    2753              *
    2754              * @type Boolean
    2755              * @name Curve#RDPsmoothing
    2756              * @default false
    2757              */
    2758             RDPsmoothing: false,     // Apply the Ramer-Douglas-Peuker algorithm
    2759
    2760             /**
    2761              * Number of points used for plotting triggered by up events
    2762              * (i.e. high quality plotting) in case
    2763              * {@link Curve#doAdvancedPlot} is false.
    2764              *
    2765              * @name Curve#numberPointsHigh
    2766              * @see Curve#doAdvancedPlot
    2767              * @type Number
    2768              * @default 1600
    2769              */
    2770             numberPointsHigh: 1600,  // Number of points on curves after mouseUp
    2771
    2772             /**
    2773              * Number of points used for plotting triggered by move events
    2774              * (i.e. lower quality plotting but fast) in case
    2775              * {@link Curve#doAdvancedPlot} is false.
    2776              *
    2777              * @name Curve#numberPointsLow
    2778              * @see Curve#doAdvancedPlot
    2779              * @type Number
    2780              * @default 400
    2781              */
    2782             numberPointsLow: 400,    // Number of points on curves after mousemove
    2783
    2784             /**
    2785              * If true use a recursive bisection algorithm.
    2786              * It is slower, but usually the result is better. It tries to detect jumps
    2787              * and singularities.
    2788              *
    2789              * @name Curve#doAdvancedPlot
    2790              * @type Boolean
    2791              * @default true
    2792              */
    2793             doAdvancedPlot: true,
    2794
    2795             /**
    2796              *
    2797              * Recursion depth used for plotting triggered by up events
    2798              * (i.e. high quality plotting) in case
    2799              * {@link Curve#doAdvancedPlot} is true.
    2800              *
    2801              * @name Curve#recursionDepthHigh
    2802              * @see Curve#doAdvancedPlot
    2803              * @type Number
    2804              * @default 17
    2805              */
    2806              recursionDepthHigh: 17,
    2807
    2808             /**
    2809              * Number of points used for plotting triggered by move events in case
    2810              * (i.e. lower quality plotting but fast)
    2811              * {@link Curve#doAdvancedPlot} is true.
    2812              *
    2813              * @name Curve#recursionDepthLow
    2814              * @see Curve#doAdvancedPlot
    2815              * @type Number
    2816              * @default 13
    2817              */
    2818              recursionDepthLow: 15,
    2819
    2820             /**
    2821              * If true use the algorithm by Gillam and Hohenwarter, which was default until version 0.98.
    2822              *
    2823              * @name Curve#doAdvancedPlotOld
    2824              * @see Curve#doAdvancedPlot
    2825              * @type Boolean
    2826              * @default false
    2827              * @deprecated
    2828              */
    2829             doAdvancedPlotOld: false,   // v1
    2830
    2831             /**
    2832              * Select the version of the plot algorithm.
    2833              * <ul>
    2834              * <li> Version 1 is very outdated
    2835              * <li> Version 2 is the default version in JSXGraph v0.99.*, v1.0, and v1.1, v1.2.0
    2836              * <li> Version 3 is an internal version that was never published in  a stable version.
    2837              * <li> Version 4 is available since JSXGraph v1.2.0
    2838              * </ul>
    2839              * Version 4 plots correctly logarithms if the function term is supplied as string (i.e. as JessieCode)
    2840              *
    2841              * @example
    2842              *   var c = board.create('functiongraph', ["log(x)"]);
    2843              *
    2844              * @name Curve#plotVersion
    2845              * @type Number
    2846              * @default 2
    2847              */
    2848             plotVersion: 2,
    2849
    2850             /**
    2851              * Attributes for circle label.
    2852              *
    2853              * @type Label
    2854              * @name Circle#label
    2855              */
    2856             label: {
    2857                 position: 'lft'
    2858             },
    2859
    2860             /**
    2861              * Configure arrow head at the start position for curve.
    2862              * Recommended arrow head type is 7.
    2863              *
    2864              * @name Curve#firstArrow
    2865              * @type Boolean / Object
    2866              * @default false
    2867              * @see Line#firstArrow for options
    2868              */
    2869             firstArrow: false,
    2870
    2871             /**
    2872              * Configure arrow head at the end position for curve.
    2873              * Recommended arrow head type is 7.
    2874              *
    2875              * @name Curve#lastArrow
    2876              * @see Line#lastArrow for options
    2877              * @type Boolean / Object
    2878              * @default false
    2879              */
    2880             lastArrow: false
    2881
    2882             /**#@-*/
    2883         },
    2884
    2885         /* special foreignObject options */
    2886         foreignobject: {
    2887
    2888             /**#@+
    2889              * @visprop
    2890              */
    2891             attractors: [],
    2892             fixed: true,
    2893             visible: true
    2894
    2895             /**#@-*/
    2896         },
    2897
    2898         glider: {
    2899             /**#@+
    2900              * @visprop
    2901              */
    2902
    2903             label: {}
    2904             /**#@-*/
    2905         },
    2906
    2907         /* special grid options */
    2908         grid: {
    2909             /**#@+
    2910              * @visprop
    2911              */
    2912
    2913             /* grid styles */
    2914             needsRegularUpdate: false,
    2915             hasGrid: false,
    2916             gridX: 1,
    2917             gridY: 1,
    2918             //strokeColor: '#c0c0c0',
    2919             strokeColor: '#c0c0c0',
    2920             strokeOpacity: 0.5,
    2921             strokeWidth: 1,
    2922             dash: 0,    // dashed grids slow down the iPad considerably
    2923             /* snap to grid options */
    2924
    2925             /**
    2926              * @deprecated
    2927              */
    2928             snapToGrid: false,
    2929             /**
    2930              * @deprecated
    2931              */
    2932             snapSizeX: 10,
    2933             /**
    2934              * @deprecated
    2935              */
    2936             snapSizeY: 10
    2937
    2938             /**#@-*/
    2939         },
    2940
    2941         group: {
    2942             needsRegularUpdate: true
    2943         },
    2944
    2945         /* special html slider options */
    2946         htmlslider: {
    2947             /**#@+
    2948              * @visprop
    2949              */
    2950
    2951             /**
    2952              *
    2953              * These affect the DOM element input type="range".
    2954              * The other attributes affect the DOM element div containing the range element.
    2955              */
    2956             widthRange: 100,
    2957             widthOut: 34,
    2958             step: 0.01,
    2959
    2960             frozen: true,
    2961             isLabel: false,
    2962             strokeColor: '#000000',
    2963             display: 'html',
    2964             anchorX: 'left',
    2965             anchorY: 'middle',
    2966             withLabel: false
    2967
    2968             /**#@-*/
    2969         },
    2970
    2971         /* special image options */
    2972         image: {
    2973             /**#@+
    2974              * @visprop
    2975              */
    2976
    2977             imageString: null,
    2978             fillOpacity: 1.0,
    2979             highlightFillOpacity: 0.6,
    2980
    2981
    2982             /**
    2983              * Defines the CSS class used by the image. CSS attributes defined in
    2984              * this class will overwrite the corresponding JSXGraph attributes, e.g.
    2985              * opacity.
    2986              * The default CSS class is defined in jsxgraph.css.
    2987              *
    2988              * @name Image#cssClass
    2989              *
    2990              * @see Image#highlightCssClass
    2991              * @type String
    2992              * @default 'JXGimage'
    2993              */
    2994             cssClass: 'JXGimage',
    2995
    2996             /**
    2997              * Defines the CSS class used by the image when highlighted.
    2998              * CSS attributes defined in this class will overwrite the
    2999              * corresponding JSXGraph attributes, e.g. highlightFillOpacity.
    3000              * The default CSS class is defined in jsxgraph.css.
    3001              *
    3002              * @name Image#highlightCssClass
    3003              *
    3004              * @see Image#cssClass
    3005              * @type String
    3006              * @default 'JXGimageHighlight'
    3007              */
    3008             highlightCssClass: 'JXGimageHighlight',
    3009
    3010             /**
    3011              * Image rotation in degrees.
    3012              *
    3013              * @name Image#rotate
    3014              * @type Number
    3015              * @default 0
    3016              */
    3017             rotate: 0,
    3018
    3019             /**
    3020              * Defines together with {@link Image#snapSizeY} the grid the image snaps on to.
    3021              * The image will only snap on user coordinates which are
    3022              * integer multiples to snapSizeX in x and snapSizeY in y direction.
    3023              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    3024              * of the default ticks of the default x axes of the board.
    3025              *
    3026              * @name Image#snapSizeX
    3027              *
    3028              * @see Point#snapToGrid
    3029              * @see Image#snapSizeY
    3030              * @see JXG.Board#defaultAxes
    3031              * @type Number
    3032              * @default 1
    3033              */
    3034             snapSizeX: 1,
    3035
    3036             /**
    3037              * Defines together with {@link Image#snapSizeX} the grid the image snaps on to.
    3038              * The image will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    3039              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    3040              * of the default ticks of the default y axes of the board.
    3041              *
    3042              * @name Image#snapSizeY
    3043              *
    3044              * @see Point#snapToGrid
    3045              * @see Image#snapSizeX
    3046              * @see JXG.Board#defaultAxes
    3047              * @type Number
    3048              * @default 1
    3049              */
    3050             snapSizeY: 1,
    3051
    3052             /**
    3053              * List of attractor elements. If the distance of the image is less than
    3054              * attractorDistance the image is made to glider of this element.
    3055              *
    3056              * @name Image#attractors
    3057              *
    3058              * @type Array
    3059              * @default empty
    3060              */
    3061             attractors: []
    3062
    3063             /**#@-*/
    3064         },
    3065
    3066         /* special options for incircle of 3 points */
    3067         incircle: {
    3068             /**#@+
    3069              * @visprop
    3070              */
    3071
    3072             fillColor: 'none',
    3073             highlightFillColor: 'none',
    3074             strokeColor: Color.palette.blue,
    3075             highlightStrokeColor: '#c3d9ff',
    3076
    3077             /**
    3078              * Attributes of circle center.
    3079              *
    3080              * @type Point
    3081              * @name Incircle#center
    3082              */
    3083             center: {               // center point
    3084                 visible: false,
    3085                 fixed: false,
    3086                 withLabel: false,
    3087                 fillColor: Color.palette.red,
    3088                 strokeColor: Color.palette.red,
    3089                 highlightFillColor: '#c3d9ff',
    3090                 highlightStrokeColor: '#c3d9ff',
    3091                 name: ''
    3092             }
    3093             /**#@-*/
    3094         },
    3095
    3096         inequality: {
    3097             /**#@+
    3098              * @visprop
    3099              */
    3100
    3101             fillColor: Color.palette.red,
    3102             fillOpacity: 0.2,
    3103             strokeColor: 'none',
    3104
    3105             /**
    3106              * By default an inequality is less (or equal) than. Set inverse to <tt>true</tt> will consider the inequality
    3107              * greater (or equal) than.
    3108              *
    3109              * @type Boolean
    3110              * @default false
    3111              * @name Inequality#inverse
    3112              * @visprop
    3113              */
    3114             inverse: false
    3115             /**#@-*/
    3116         },
    3117
    3118         infobox: {
    3119             /**#@+
    3120              * @visprop
    3121              */
    3122
    3123             fontSize: 12,
    3124             isLabel: false,
    3125             strokeColor: '#bbbbbb',
    3126             display: 'html',             // 'html' or 'internal'
    3127             anchorX: 'left',             //  'left', 'middle', or 'right': horizontal alignment
    3128                                          //  of the text.
    3129             anchorY: 'middle',           //  'top', 'middle', or 'bottom': vertical alignment
    3130                                          //  of the text.
    3131             cssClass: 'JXGinfobox',
    3132             rotate: 0,                   // works for non-zero values only in combination
    3133                                          // with display=='internal'
    3134             visible: true,
    3135             parse: false,
    3136             transitionDuration: 0,
    3137             needsRegularUpdate: false
    3138
    3139             /**#@-*/
    3140         },
    3141
    3142         /* special options for integral */
    3143         integral: {
    3144             /**#@+
    3145              * @visprop
    3146              */
    3147
    3148             axis: 'x',        // 'x' or 'y'
    3149             withLabel: true,    // Show integral value as text
    3150             fixed: true,
    3151             strokeWidth: 0,
    3152             strokeOpacity: 0,
    3153             fillColor: Color.palette.red,
    3154             fillOpacity: 0.3,
    3155             highlightFillColor: Color.palette.red,
    3156             highlightFillOpacity: 0.2,
    3157
    3158             /**
    3159              * Attributes of the (left) starting point of the integral.
    3160              *
    3161              * @type Point
    3162              * @name Integral#curveLeft
    3163              * @see Integral#baseLeft
    3164              */
    3165             curveLeft: {    // Start point
    3166                 visible: true,
    3167                 withLabel: false,
    3168                 color: Color.palette.red,
    3169                 fillOpacity: 0.8,
    3170                 layer: 9
    3171             },
    3172
    3173             /**
    3174              * Attributes of the (left) base point of the integral.
    3175              *
    3176              * @type Point
    3177              * @name Integral#baseLeft
    3178              * @see Integral#curveLeft
    3179              */
    3180             baseLeft: {    // Start point
    3181                 visible: false,
    3182                 fixed: false,
    3183                 withLabel: false,
    3184                 name: ''
    3185             },
    3186
    3187             /**
    3188              * Attributes of the (right) end point of the integral.
    3189              *
    3190              * @type Point
    3191              * @name Integral#curveRight
    3192              * @see Integral#baseRight
    3193              */
    3194             curveRight: {      // End point
    3195                 visible: true,
    3196                 withLabel: false,
    3197                 color: Color.palette.red,
    3198                 fillOpacity: 0.8,
    3199                 layer: 9
    3200             },
    3201
    3202             /**
    3203              * Attributes of the (right) base point of the integral.
    3204              *
    3205              * @type Point
    3206              * @name Integral#baseRight
    3207              * @see Integral#curveRight
    3208              */
    3209             baseRight: {      // End point
    3210                 visible: false,
    3211                 fixed: false,
    3212                 withLabel: false,
    3213                 name: ''
    3214             },
    3215
    3216             /**
    3217              * Attributes for integral label.
    3218              *
    3219              * @type Label
    3220              * @name Integral#label
    3221              */
    3222             label: {
    3223                 fontSize: 20
    3224             }
    3225             /**#@-*/
    3226         },
    3227
    3228         /* special input options */
    3229         input: {
    3230             /**#@+
    3231              * @visprop
    3232              */
    3233
    3234             /**
    3235              * Control the attribute "disabled" of the HTML input field.
    3236              *
    3237              * @name disabled
    3238              * @memberOf Input.prototype
    3239              *
    3240              * @type Boolean
    3241              * @default false
    3242              */
    3243             disabled: false,
    3244
    3245             /**
    3246              * Control the attribute "maxlength" of the HTML input field.
    3247              *
    3248              * @name maxlength
    3249              * @memberOf Input.prototype
    3250              *
    3251              * @type Number
    3252              * @default 524288 (as in HTML)
    3253              */
    3254             maxlength: 524288,
    3255
    3256             display: 'html'
    3257
    3258             /**#@-*/
    3259         },
    3260
    3261         /* special intersection point options */
    3262         intersection: {
    3263             /**#@+
    3264              * @visprop
    3265              */
    3266
    3267             /**
    3268              * Used in {@link JXG.Intersection}.
    3269              * This flag sets the behaviour of intersection points of e.g.
    3270              * two segments. If true, the intersection is treated as intersection of lines. If false
    3271              * the intersection point exists if the segments intersect setwise.
    3272              *
    3273              * @name Intersection.alwaysIntersect
    3274              * @type Boolean
    3275              * @default true
    3276              */
    3277             alwaysIntersect: true
    3278
    3279             /**#@-*/
    3280         },
    3281
    3282         /* special label options */
    3283         label: {
    3284             /**#@+
    3285              * @visprop
    3286              */
    3287
    3288             visible: 'inherit',
    3289             strokeColor: '#000000',
    3290             strokeOpacity: 1,
    3291             highlightStrokeOpacity: 0.666666,
    3292             highlightStrokeColor: '#000000',
    3293
    3294             fixed: true,
    3295
    3296             /**
    3297              * Possible string values for the position of a label for
    3298              * label anchor points are:
    3299              * <ul>
    3300              * <li> 'lft'
    3301              * <li> 'rt'
    3302              * <li> 'top'
    3303              * <li> 'bot'
    3304              * <li> 'ulft'
    3305              * <li> 'urt'
    3306              * <li> 'llft'
    3307              * <li> 'lrt'
    3308              * </ul>
    3309              * This is relevant for non-points: line, circle, curve.
    3310              *
    3311              * The names have been borrowed from <a href="https://www.tug.org/metapost.html">MetaPost</a>.
    3312              *
    3313              * @name Label#position
    3314              * @see Label#offset
    3315              * @type String
    3316              * @default 'urt'
    3317              */
    3318             position: 'urt',
    3319
    3320             /**
    3321              *  Label offset from label anchor.
    3322              *  The label anchor is determined by {@link Label#position}
    3323              *
    3324              * @name Label#offset
    3325              * @see Label#position
    3326              * @type Array
    3327              * @default [10,10]
    3328              */
    3329             offset: [10, 10],
    3330
    3331             /**
    3332              * Automatic position of label text. When called first, the positioning algorithm
    3333              * starts at the position defined by offset.
    3334              * The algorithm tries to find a position with the least number of
    3335              * overlappings with other elements, while retaining the distance
    3336              * to the anchor element.
    3337              *
    3338              * @name Label#autoPosition
    3339              * @see Label#offset
    3340              * @type Boolean
    3341              * @default false
    3342              *
    3343              * @example
    3344              * 	var p1 = board.create('point', [-2, 1], {id: 'A'});
    3345              * 	var p2 = board.create('point', [-0.85, 1], {
    3346              *      name: 'B', id: 'B', label:{autoPosition: true, offset:[10, 10]}
    3347              *  });
    3348              * 	var p3 = board.create('point', [-1, 1.2], {
    3349              *      name: 'C', id: 'C', label:{autoPosition: true, offset:[10, 10]}
    3350              *  });
    3351              *  var c = board.create('circle', [p1, p2]);
    3352              * 	var l = board.create('line', [p1, p2]);
    3353              *
    3354              * </pre><div id="JXG7d4dafe7-1a07-4d3f-95cb-bfed9d96dea2" class="jxgbox" style="width: 300px; height: 300px;"></div>
    3355              * <script type="text/javascript">
    3356              *     (function() {
    3357              *         var board = JXG.JSXGraph.initBoard('JXG7d4dafe7-1a07-4d3f-95cb-bfed9d96dea2',
    3358              *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false, shownavigation: false});
    3359              *     	var p1 = board.create('point', [-2, 1], {id: 'A'});
    3360              *     	var p2 = board.create('point', [-0.85, 1], {name: 'B', id: 'B', label:{autoPosition: true, offset:[10, 10]}});
    3361              *     	var p3 = board.create('point', [-1, 1.2], {name: 'C', id: 'C', label:{autoPosition: true, offset:[10, 10]}});
    3362              *      var c = board.create('circle', [p1, p2]);
    3363              *     	var l = board.create('line', [p1, p2]);
    3364              *
    3365              *     })();
    3366              *
    3367              * </script><pre>
    3368              *
    3369              *
    3370              */
    3371             autoPosition: false
    3372
    3373             /**#@-*/
    3374         },
    3375
    3376         /* special legend options */
    3377         legend: {
    3378             /**
    3379              * @visprop
    3380              */
    3381
    3382              /**
    3383               * Default style of a legend element. The only possible value is 'vertical'.
    3384               * @name: Legend#style
    3385               * @type String
    3386               * @default 'vertical'
    3387               */
    3388             style: 'vertical',
    3389
    3390             /**
    3391              * Label names of a legend element.
    3392              * @name: Legend#labels
    3393              * @type Array
    3394              * @default "['1', '2', '3', '4', '5', '6', '7', '8']"
    3395              */
    3396             labels: ['1', '2', '3', '4', '5', '6', '7', '8'],
    3397
    3398             /**
    3399              * (Circular) array of label colors.
    3400              * @name: Legend#colors
    3401              * @type Array
    3402              * @default "['#B02B2C', '#3F4C6B', '#C79810', '#D15600', '#FFFF88', '#c3d9ff', '#4096EE', '#008C00']"
    3403              */
    3404             colors: ['#B02B2C', '#3F4C6B', '#C79810', '#D15600', '#FFFF88', '#c3d9ff', '#4096EE', '#008C00'],
    3405
    3406             /**
    3407              * Height (in px) of one legend entry
    3408              * @name: Legend#rowHeight
    3409              * @type Number
    3410              * @default 20
    3411              *
    3412              */
    3413             rowHeight: 20,
    3414
    3415             strokeWidth: 5
    3416
    3417             /**#@-*/
    3418         },
    3419
    3420         /* special line options */
    3421         line: {
    3422             /**#@+
    3423              * @visprop
    3424              */
    3425
    3426             /**
    3427              * Configure the arrow head at the position of its first point or the corresponding
    3428              * intersection with the canvas border
    3429              *
    3430              * In case firstArrow is an object it has the sub-attributes:
    3431              * <pre>
    3432              * {
    3433              *      type: 1, // possible values are 1, 2, ..., 7. Default value is 1.
    3434              *      size: 6, // size of the arrow head. Default value is 6.
    3435              *               // This value is multiplied with the strokeWidth of the line
    3436              *               // Exception: for type=7 size is ignored
    3437              *      highlightSize: 6, // size of the arrow head in case the element is highlighted. Default value
    3438              * }
    3439              * </pre>
    3440              * type=7 is the default for curves if firstArrow: true
    3441              *
    3442              * @name Line#firstArrow
    3443              * @see Line#lastArrow
    3444              * @see Line#touchFirstPoint
    3445              * @type Boolean / Object
    3446              * @default false
    3447              */
    3448             firstArrow: false,
    3449
    3450             /**
    3451              * Configute the arrow head at the position of its second point or the corresponding
    3452              * intersection with the canvas border.
    3453              *
    3454              * In case lastArrow is an object it has the sub-attributes:
    3455              * <pre>
    3456              * {
    3457              *      type: 1, // possible values are 1, 2, ..., 7. Default value is 1.
    3458              *      size: 6, // size of the arrow head. Default value is 6.
    3459              *               // This value is multiplied with the strokeWidth of the line.
    3460              *               // Exception: for type=7 size is ignored
    3461              *      highlightSize: 6, // size of the arrow head in case the element is highlighted. Default value is 6.
    3462              * }
    3463              * </pre>
    3464              * type=7 is the default for curves if lastArrow: true
    3465              *
    3466              * @example
    3467              *     var p1 = board.create('point', [-5, 2], {size:1});
    3468              *     var p2 = board.create('point', [5, 2], {size:10});
    3469              *     var li = board.create('segment', ['A','B'],
    3470              *         {name:'seg',
    3471              *          strokeColor:'#000000',
    3472              *          strokeWidth:1,
    3473              *          highlightStrokeWidth: 5,
    3474              *          lastArrow: {type: 2, size: 8, highlightSize: 6},
    3475              *          touchLastPoint: true,
    3476              *          firstArrow: {type: 3, size: 8}
    3477              *         });
    3478              *
    3479              * </pre><div id="JXG184e915c-c2ef-11e8-bece-04d3b0c2aad3" class="jxgbox" style="width: 300px; height: 300px;"></div>
    3480              * <script type="text/javascript">
    3481              *     (function() {
    3482              *         var board = JXG.JSXGraph.initBoard('JXG184e915c-c2ef-11e8-bece-04d3b0c2aad3',
    3483              *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false, shownavigation: false});
    3484              *         var p1 = board.create('point', [-5, 2], {size:1});
    3485              *         var p2 = board.create('point', [5, 2], {size:10});
    3486              *         var li = board.create('segment', ['A','B'],
    3487              *             {name:'seg',
    3488              *              strokeColor:'#000000',
    3489              *              strokeWidth:1,
    3490              *              highlightStrokeWidth: 5,
    3491              *              lastArrow: {type: 2, size: 8, highlightSize: 6},
    3492              *              touchLastPoint: true,
    3493              *              firstArrow: {type: 3, size: 8}
    3494              *             });
    3495              *
    3496              *     })();
    3497              *
    3498              * </script>
    3499              *
    3500              * @name Line#lastArrow
    3501              * @see Line#firstArrow
    3502              * @see Line#touchLastPoint
    3503              * @type Boolean / Object
    3504              * @default false
    3505              */
    3506             lastArrow: false,
    3507
    3508
    3509             /**
    3510              * This number (pixel value) controls where infinite lines end at the canvas border. If zero, the line
    3511              * ends exactly at the border, if negative there is a margin to the inside, if positive the line
    3512              * ends outside of the canvas (which is invisible).
    3513              *
    3514              * @name: Line#margin
    3515              * @type Number
    3516              * @default 0
    3517              */
    3518             margin: 0,
    3519
    3520             /**
    3521              * If true, line stretches infinitely in direction of its first point.
    3522              * Otherwise it ends at point1.
    3523              *
    3524              * @name Line#straightFirst
    3525              * @see Line#straightLast
    3526              * @type Boolean
    3527              * @default true
    3528              */
    3529             straightFirst: true,
    3530
    3531             /**
    3532              * If true, line stretches infinitely in direction of its second point.
    3533              * Otherwise it ends at point2.
    3534              *
    3535              * @name Line#straightLast
    3536              * @see Line#straightFirst
    3537              * @type Boolean
    3538              * @default true
    3539              */
    3540             straightLast: true,
    3541
    3542             fillColor: 'none',               // Important for VML on IE
    3543             highlightFillColor: 'none',  // Important for VML on IE
    3544             strokeColor: Color.palette.blue,
    3545             highlightStrokeColor: '#c3d9ff',
    3546             withTicks: false,
    3547
    3548             /**
    3549              * Attributes for first defining point of the line.
    3550              *
    3551              * @type Point
    3552              * @name Line#point1
    3553              */
    3554             point1: {                  // Default values for point1 if created by line
    3555                 visible: false,
    3556                 withLabel: false,
    3557                 fixed: false,
    3558                 name: ''
    3559             },
    3560
    3561             /**
    3562              * Attributes for second defining point of the line.
    3563              *
    3564              * @type Point
    3565              * @name Line#point2
    3566              */
    3567             point2: {                  // Default values for point2 if created by line
    3568                 visible: false,
    3569                 withLabel: false,
    3570                 fixed: false,
    3571                 name: ''
    3572             },
    3573
    3574             /**
    3575              * Attributes for ticks of the line.
    3576              *
    3577              * @type Ticks
    3578              * @name Line#ticks
    3579              */
    3580             ticks: {
    3581                 drawLabels: true,
    3582                 label: {
    3583                     offset: [4, -12 + 3] // This seems to be a good offset for 12 point fonts
    3584                 },
    3585                 drawZero: false,
    3586                 insertTicks: false,
    3587                 minTicksDistance: 50,
    3588                 minorHeight: 4,          // if <0: full width and height
    3589                 majorHeight: -1,         // if <0: full width and height
    3590                 minorTicks: 4,
    3591                 defaultDistance: 1,
    3592                 strokeOpacity: 0.3,
    3593                 visible: 'inherit'
    3594             },
    3595
    3596             /**
    3597              * Attributes for the line label.
    3598              *
    3599              * @type Label
    3600              * @name Line#label
    3601              */
    3602             label: {
    3603                 position: 'llft'
    3604             },
    3605
    3606             /**
    3607              * If set to true, the point will snap to a grid defined by
    3608              * {@link Point#snapSizeX} and {@link Point#snapSizeY}.
    3609              *
    3610              * @see Point#snapSizeX
    3611              * @see Point#snapSizeY
    3612              * @type Boolean
    3613              * @name Line#snapToGrid
    3614              * @default false
    3615              */
    3616             snapToGrid: false,
    3617
    3618             /**
    3619              * Defines together with {@link Point#snapSizeY} the grid the point snaps on to.
    3620              * The point will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    3621              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    3622              * of the default ticks of the default x axes of the board.
    3623              *
    3624              * @see Point#snapToGrid
    3625              * @see Point#snapSizeY
    3626              * @see JXG.Board#defaultAxes
    3627              * @type Number
    3628              * @name Line#snapSizeX
    3629              * @default 1
    3630              */
    3631             snapSizeX: 1,
    3632
    3633             /**
    3634              * Defines together with {@link Point#snapSizeX} the grid the point snaps on to.
    3635              * The point will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    3636              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    3637              * of the default ticks of the default y axes of the board.
    3638              *
    3639              * @see Point#snapToGrid
    3640              * @see Point#snapSizeX
    3641              * @see JXG.Board#defaultAxes
    3642              * @type Number
    3643              * @name Line#snapSizeY
    3644              * @default 1
    3645              */
    3646             snapSizeY: 1,
    3647
    3648             /**
    3649              * If set to true and {@link Line#firstArrow} is set to true, the arrow head will just touch
    3650              * the circle line of the start point of the line.
    3651              *
    3652              * @see Line#firstArrow
    3653              * @type Boolean
    3654              * @name Line#touchFirstPoint
    3655              * @default false
    3656              */
    3657             touchFirstPoint: false,
    3658
    3659             /**
    3660              * If set to true and {@link Line#lastArrow} is set to true, the arrow head will just touch
    3661              * the circle line of the start point of the line.
    3662              * @see Line#firstArrow
    3663              * @type Boolean
    3664              * @name Line#touchLastPoint
    3665              * @default false
    3666              */
    3667             touchLastPoint: false,
    3668
    3669             /**
    3670              * Line endings (linecap) of a straight line.
    3671              * Possible values are:
    3672              * <ul>
    3673              * <li> 'butt',
    3674              * <li> 'round',
    3675              * <li> 'square'.
    3676              * </ul>
    3677              * Not available for VML renderer.
    3678              * [lineCap description]
    3679              * @name Line#lineCap
    3680              * @type String
    3681              * @default 'butt'
    3682              */
    3683             lineCap: 'butt'
    3684
    3685
    3686             /**#@-*/
    3687         },
    3688
    3689         /* special options for locus curves */
    3690         locus: {
    3691             /**#@+
    3692              * @visprop
    3693              */
    3694
    3695             translateToOrigin: false,
    3696             translateTo10: false,
    3697             stretch: false,
    3698             toOrigin: null,
    3699             to10: null
    3700             /**#@-*/
    3701         },
    3702
    3703         /* special cardinal spline options */
    3704         metapostspline: {
    3705             /**#@+
    3706              * @visprop
    3707              */
    3708
    3709              /**
    3710               * Controls if the data points of the cardinal spline when given as
    3711               * arrays should be converted into {@link JXG.Points}.
    3712               *
    3713               * @name createPoints
    3714               * @memberOf Metapostspline.prototype
    3715               *
    3716               * @see Metapostspline#points
    3717               *
    3718               * @type Boolean
    3719               * @default true
    3720               */
    3721             createPoints: true,
    3722
    3723             /**
    3724              * If set to true, the supplied coordinates are interpreted as
    3725              * [[x_0, y_0], [x_1, y_1], p, ...].
    3726              * Otherwise, if the data consists of two arrays of equal length,
    3727              * it is interpreted as
    3728              * [[x_o x_1, ..., x_n], [y_0, y_1, ..., y_n]]
    3729              *
    3730              * @name isArrayOfCoordinates
    3731              * @memberOf Metapostspline.prototype
    3732              * @type Boolean
    3733              * @default false
    3734              */
    3735             isArrayOfCoordinates: false,
    3736
    3737             /**
    3738              * Attributes for the points generated by Metapostspline in cases
    3739              * {@link createPoints} is set to true
    3740              *
    3741              * @name points
    3742              * @memberOf Metapostspline.prototype
    3743              *
    3744              * @see Metapostspline#createPoints
    3745              * @type Object
    3746              */
    3747             points: {
    3748                 strokeOpacity: 0.05,
    3749                 fillOpacity: 0.05,
    3750                 highlightStrokeOpacity: 1.0,
    3751                 highlightFillOpacity: 1.0,
    3752                 withLabel: false,
    3753                 name: '',
    3754                 fixed: false
    3755             }
    3756
    3757             /**#@-*/
    3758         },
    3759
    3760         /* special mirrorelement options */
    3761         mirrorelement: {
    3762             /**#@+
    3763              * @visprop
    3764              */
    3765
    3766             fixed: true,
    3767
    3768             /**
    3769              * Attributes of mirror point, i.e. the point along which the element is mirrored.
    3770              *
    3771              * @type Point
    3772              * @name mirrorelement#point
    3773              */
    3774             point: {},
    3775
    3776             /**
    3777              * Attributes of circle center, i.e. the center of the circle,
    3778              * if a circle is the mirror element and the transformation type is 'Euclidean'
    3779              *
    3780              * @type Point
    3781              * @name mirrorelement#center
    3782              */
    3783             center: {},
    3784
    3785             /**
    3786              * Type of transformation. Possible values are 'Euclidean', 'projective'.
    3787              *
    3788              * If the value is 'Euclidean', the mirror element of a circle is again a circle,
    3789              * otherwise it is a conic section.
    3790              *
    3791              * @type String
    3792              * @name mirrorelement#type
    3793              * @default 'Euclidean'
    3794              */
    3795             type: 'Euclidean'
    3796
    3797             /**#@-*/
    3798         },
    3799
    3800         // /* special options for Msector of 3 points */
    3801         // msector: {
    3802         //     strokeColor: '#000000', // Msector line
    3803         //     point: {               // Msector point
    3804         //         visible: false,
    3805         //         fixed: false,
    3806         //         withLabel: false,
    3807         //         name: ''
    3808         //     }
    3809         // },
    3810
    3811         /* special options for normal lines */
    3812         normal: {
    3813             /**#@+
    3814              * @visprop
    3815              */
    3816
    3817             strokeColor: '#000000', //  normal line
    3818
    3819             /**
    3820              * Attributes of helper point of normal.
    3821              *
    3822              * @type Point
    3823              * @name Normal#point
    3824              */
    3825             point: {
    3826                 visible: false,
    3827                 fixed: false,
    3828                 withLabel: false,
    3829                 name: ''
    3830             }
    3831             /**#@-*/
    3832         },
    3833
    3834         /* special options for orthogonal projection points */
    3835         orthogonalprojection: {
    3836             /**#@+
    3837              * @visprop
    3838              */
    3839
    3840
    3841             /**#@-*/
    3842         },
    3843
    3844         /* special options for parallel lines */
    3845         parallel: {
    3846             /**#@+
    3847              * @visprop
    3848              */
    3849
    3850             strokeColor: '#000000', // Parallel line
    3851
    3852             /**
    3853              * Attributes of helper point of normal.
    3854              *
    3855              * @type Point
    3856              * @name Parallel#point
    3857              */
    3858             point: {
    3859                 visible: false,
    3860                 fixed: false,
    3861                 withLabel: false,
    3862                 name: ''
    3863             },
    3864
    3865             label: {
    3866                 position: 'llft'
    3867             }
    3868             /**#@-*/
    3869         },
    3870
    3871         /* special perpendicular options */
    3872         perpendicular: {
    3873             /**#@+
    3874              * @visprop
    3875              */
    3876
    3877             strokeColor: '#000000', // Perpendicular line
    3878             straightFirst: true,
    3879             straightLast: true
    3880             /**#@-*/
    3881         },
    3882
    3883         /* special perpendicular options */
    3884         perpendicularsegment: {
    3885             /**#@+
    3886              * @visprop
    3887              */
    3888
    3889             strokeColor: '#000000', // Perpendicular segment
    3890             straightFirst: false,
    3891             straightLast: false,
    3892             point: {               // Perpendicular point
    3893                 visible: false,
    3894                 fixed: true,
    3895                 withLabel: false,
    3896                 name: ''
    3897             }
    3898             /**#@-*/
    3899         },
    3900
    3901         /* special point options */
    3902         point: {
    3903             /**#@+
    3904              * @visprop
    3905              */
    3906
    3907             withLabel: true,
    3908             label: {},
    3909
    3910             /**
    3911              * This attribute was used to determined the point layout. It was derived from GEONExT and was
    3912              * replaced by {@link Point#face} and {@link Point#size}.
    3913              *
    3914              * @name Point#style
    3915              *
    3916              * @see Point#face
    3917              * @see Point#size
    3918              * @type Number
    3919              * @default 5
    3920              * @deprecated
    3921              */
    3922             style: 5,
    3923
    3924             /**
    3925              * There are different point styles which differ in appearance.
    3926              * Posssible values are
    3927              * <table><tr><th>Value</th></tr>
    3928              * <tr><td>cross</td></tr>
    3929              * <tr><td>circle</td></tr>
    3930              * <tr><td>square</td></tr>
    3931              * <tr><td>plus</td></tr>
    3932              * <tr><td>diamond</td></tr>
    3933              * <tr><td>triangleUp</td></tr>
    3934              * <tr><td>triangleDown</td></tr>
    3935              * <tr><td>triangleLeft</td></tr>
    3936              * <tr><td>triangleRight</td></tr>
    3937              * </table>
    3938              *
    3939              * @name Point#face
    3940              *
    3941              * @type String
    3942              * @see JXG.Point#setStyle
    3943              * @default circle
    3944              */
    3945             face: 'o',
    3946
    3947             /**
    3948              * Size of a point, either in pixel or user coordinates.
    3949              * Means radius resp. half the width of a point (depending on the face).
    3950              *
    3951              * @name Point#size
    3952              *
    3953              * @see Point#face
    3954              * @see JXG.Point#setStyle
    3955              * @see Point#sizeUnit
    3956              * @type Number
    3957              * @default 3
    3958              */
    3959             size: 3,
    3960
    3961             /**
    3962              * Unit for size.
    3963              * Possible values are 'screen' and 'user.
    3964              *
    3965              * @name Point#sizeUnit
    3966              *
    3967              * @see Point#size
    3968              * @type String
    3969              * @default 'screen'
    3970              */
    3971             sizeUnit: 'screen',
    3972
    3973             strokeWidth: 2,
    3974
    3975             fillColor: Color.palette.red,
    3976             strokeColor: Color.palette.red,
    3977             highlightFillColor:'#c3d9ff',
    3978             highlightStrokeColor: '#c3d9ff',
    3979             // strokeOpacity: 1.0,
    3980             // fillOpacity: 1.0,
    3981             // highlightFillOpacity: 0.5,
    3982             // highlightStrokeOpacity: 0.5,
    3983
    3984             // fillColor: '#ff0000',
    3985             // highlightFillColor: '#eeeeee',
    3986             // strokeWidth: 2,
    3987             // strokeColor: '#ff0000',
    3988             // highlightStrokeColor: '#c3d9ff',
    3989
    3990             /**
    3991              * If true, the point size changes on zoom events.
    3992              *
    3993              * @type Boolean
    3994              * @name Point#zoom
    3995              * @default false
    3996              *
    3997              */
    3998             zoom: false,             // Change the point size on zoom
    3999
    4000             /**
    4001              * If true, the infobox is shown on mouse/pen over, if false not.
    4002              * If the value is 'inherit', the value of
    4003              * {@link JXG.Board#showInfobox} is taken.
    4004              *
    4005              * @name Point#showInfobox
    4006              * @see JXG.Board#showInfobox
    4007              * @type {Boolean|String} true | false | 'inherit'
    4008              * @default true
    4009              */
    4010             showInfobox: 'inherit',
    4011
    4012             /**
    4013              * Truncating rule for the digits in the infobox.
    4014              * <ul>
    4015              * <li>'auto': done automatically by JXG.autoDigits()
    4016              * <li>'none': no truncation
    4017              * <li>number: truncate after "number digits" with JXG.toFixed()
    4018              * </ul>
    4019              *
    4020              * @name Point#infoboxDigits
    4021              *
    4022              * @type String, Number
    4023              * @default 'auto'
    4024              * @see JXG#autoDigits
    4025              * @see JXG#toFixed
    4026              */
    4027             infoboxDigits: 'auto',
    4028
    4029             draft: false,
    4030
    4031             /**
    4032              * List of attractor elements. If the distance of the point is less than
    4033              * attractorDistance the point is made to glider of this element.
    4034              *
    4035              * @name Point#attractors
    4036              *
    4037              * @type Array
    4038              * @default empty
    4039              */
    4040             attractors: [],
    4041
    4042             /**
    4043              * Unit for attractorDistance and snatchDistance, used for magnetized points and for snapToPoints.
    4044              * Possible values are 'screen' and 'user'.
    4045              *
    4046              * @name Point#attractorUnit
    4047              *
    4048              * @see Point#attractorDistance
    4049              * @see Point#snatchDistance
    4050              * @see Point#snapToPoints
    4051              * @see Point#attractors
    4052              * @type String
    4053              * @default 'user'
    4054              */
    4055             attractorUnit: 'user',    // 'screen', 'user'
    4056
    4057             /**
    4058              * If the distance of the point to one of its attractors is less
    4059              * than this number the point will be a glider on this
    4060              * attracting element.
    4061              * If set to zero nothing happens.
    4062              *
    4063              * @name Point#attractorDistance
    4064              *
    4065              * @type Number
    4066              * @default 0.0
    4067              */
    4068             attractorDistance: 0.0,
    4069
    4070             /**
    4071              * If the distance of the point to one of its attractors is at least
    4072              * this number the point will be released from being a glider on the
    4073              * attracting element.
    4074              * If set to zero nothing happens.
    4075              *
    4076              * @name Point#snatchDistance
    4077              *
    4078              * @type Number
    4079              * @default 0.0
    4080              */
    4081             snatchDistance: 0.0,
    4082
    4083             /**
    4084              * If set to true, the point will snap to a grid of integer multiples of
    4085              * {@link Point#snapSizeX} and {@link Point#snapSizeY} (in user coordinates).
    4086              * <p>
    4087              * The coordinates of the grid points are either integer multiples of snapSizeX and snapSizeY
    4088              * (given in user coordinates, not pixels) or are the intersection points
    4089              * of the major ticks of the boards default axes in case that snapSizeX, snapSizeY are negative.
    4090              *
    4091              * @name Point#snapToGrid
    4092              *
    4093              * @see Point#snapSizeX
    4094              * @see Point#snapSizeY
    4095              * @type Boolean
    4096              * @default false
    4097              */
    4098             snapToGrid: false,
    4099
    4100             /**
    4101              * If set to true, the point will only snap to (possibly invisibly) grid points
    4102              * when within {@link Point#attractorDistance} of such a grid point.
    4103              * <p>
    4104              * The coordinates of the grid points are either integer multiples of snapSizeX and snapSizeY
    4105              * (given in user coordinates, not pixels) or are the intersection points
    4106              * of the major ticks of the boards default axes in case that snapSizeX, snapSizeY are negative.
    4107              *
    4108              * @name Point#attractToGrid
    4109              *
    4110              * @see Point#attractorDistance
    4111              * @see Point#attractorUnit
    4112              * @see Point#snapToGrid
    4113              * @see Point#snapSizeX
    4114              * @see Point#snapSizeY
    4115              * @type Boolean
    4116              * @default false
    4117              *
    4118              * @example
    4119              * board.create('point', [3, 3], { attractToGrid: true, attractorDistance: 10, attractorunit: 'screen' });
    4120              *
    4121              * </pre><div id="JXG397ab787-cd40-449c-a7e7-a3f7bab1d4f6" class="jxgbox" style="width: 300px; height: 300px;"></div>
    4122              * <script type="text/javascript">
    4123              *     (function() {
    4124              *         var board = JXG.JSXGraph.initBoard('JXG397ab787-cd40-449c-a7e7-a3f7bab1d4f6',
    4125              *             {boundingbox: [-1, 4, 7,-4], axis: true, showcopyright: false, shownavigation: false});
    4126              *     board.create('point', [3, 3], { attractToGrid: true, attractorDistance: 10, attractorunit: 'screen' });
    4127              *
    4128              *     })();
    4129              *
    4130              * </script><pre>
    4131              *
    4132              */
    4133             attractToGrid: false,
    4134
    4135             /**
    4136              * Defines together with {@link Point#snapSizeY} the grid the point snaps on to.
    4137              * It is given in user coordinates, not in pixels.
    4138              * The point will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    4139              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    4140              * of the default ticks of the default x axes of the board.
    4141              *
    4142              * @name Point#snapSizeX
    4143              *
    4144              * @see Point#snapToGrid
    4145              * @see Point#snapSizeY
    4146              * @see JXG.Board#defaultAxes
    4147              * @type Number
    4148              * @default 1
    4149              */
    4150             snapSizeX: 1,
    4151
    4152             /**
    4153              * Defines together with {@link Point#snapSizeX} the grid the point snaps on to.
    4154              * It is given in user coordinates, not in pixels.
    4155              * The point will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    4156              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    4157              * of the default ticks of the default y axes of the board.
    4158              *
    4159              * @name Point#snapSizeY
    4160              *
    4161              * @see Point#snapToGrid
    4162              * @see Point#snapSizeX
    4163              * @see JXG.Board#defaultAxes
    4164              * @type Number
    4165              * @default 1
    4166              */
    4167             snapSizeY: 1,
    4168
    4169             /**
    4170              * If set to true, the point will snap to the nearest point in distance of
    4171              * {@link Point#attractorDistance}.
    4172              *
    4173              * @name Point#snapToPoints
    4174              *
    4175              * @see Point#attractorDistance
    4176              * @type Boolean
    4177              * @default false
    4178              */
    4179             snapToPoints: false,
    4180
    4181             /**
    4182              * List of elements which are ignored by snapToPoints.
    4183              * @name Point#ignoredSnapToPoints
    4184              *
    4185              * @type Array
    4186              * @default empty
    4187              */
    4188             ignoredSnapToPoints: []
    4189
    4190             /**#@-*/
    4191         },
    4192
    4193         /* special polygon options */
    4194         polygon: {
    4195             /**#@+
    4196              * @visprop
    4197              */
    4198
    4199             /**
    4200              * If <tt>true</tt>, moving the mouse over inner points triggers hasPoint.
    4201              *
    4202              * @see JXG.GeometryElement#hasPoint
    4203              * @name Polygon#hasInnerPoints
    4204              * @type Boolean
    4205              * @default false
    4206              */
    4207             hasInnerPoints: false,
    4208
    4209             fillColor: Color.palette.yellow,
    4210             highlightFillColor: Color.palette.yellow,
    4211             // fillColor: '#00ff00',
    4212             // highlightFillColor: '#00ff00',
    4213             fillOpacity: 0.3,
    4214             highlightFillOpacity: 0.2,
    4215
    4216             /**
    4217              * Is the polygon bordered by lines?
    4218              *
    4219              * @type Boolean
    4220              * @name Polygon#withLines
    4221              * @default true
    4222              */
    4223             withLines: true,
    4224
    4225             /**
    4226              * Attributes for the polygon border lines.
    4227              *
    4228              * @type Line
    4229              * @name Polygon#borders
    4230              */
    4231             borders: {
    4232                 withLabel: false,
    4233                 strokeWidth: 1,
    4234                 highlightStrokeWidth: 1,
    4235                 // Polygon layer + 1
    4236                 layer: 5,
    4237                 label: {
    4238                     position: 'top'
    4239                 },
    4240                 visible: 'inherit'
    4241             },
    4242
    4243             /**
    4244              * Attributes for the polygon vertices.
    4245              *
    4246              * @type Point
    4247              * @name Polygon#vertices
    4248              */
    4249             vertices: {
    4250                 layer: 9,
    4251                 withLabel: false,
    4252                 name: '',
    4253                 strokeColor: Color.palette.red,
    4254                 fillColor: Color.palette.red,
    4255                 fixed: false,
    4256                 visible: 'inherit'
    4257             },
    4258
    4259             /**
    4260              * Attributes for the polygon label.
    4261              *
    4262              * @type Label
    4263              * @name Polygon#label
    4264              */
    4265             label: {
    4266                 offset: [0, 0]
    4267             }
    4268
    4269             /**#@-*/
    4270         },
    4271
    4272         /* special polygonal chain options
    4273         */
    4274         polygonalchain: {
    4275             /**#@+
    4276              * @visprop
    4277              */
    4278
    4279             fillColor: 'none',
    4280             highlightFillColor: 'none'
    4281
    4282             /**#@-*/
    4283         },
    4284
    4285         /* special prescribed angle options
    4286         * Not yet implemented. But angle.setAngle(val) is implemented.
    4287         */
    4288         prescribedangle: {
    4289             /**#@+
    4290              * @visprop
    4291              */
    4292
    4293             /**
    4294              * Attributes for the helper point of the prescribed angle.
    4295              *
    4296              * @type Point
    4297              * @name PrescribedAngle#anglePoint
    4298              */
    4299             anglePoint: {
    4300                 size: 2,
    4301                 visible: false,
    4302                 withLabel: false
    4303             }
    4304
    4305             /**#@-*/
    4306         },
    4307
    4308         /* special reflection options */
    4309         reflection: {
    4310             /**#@+
    4311              * @visprop
    4312              */
    4313
    4314             fixed: true,
    4315
    4316             /**
    4317              * Attributes of circle center, i.e. the center of the circle,
    4318              * if a circle is the mirror element and the transformation type is 'Euclidean'
    4319              *
    4320              * @type Point
    4321              * @name mirrorelement#center
    4322              */
    4323             center: {},
    4324
    4325             /**
    4326              * Type of transformation. Possible values are 'Euclidean', 'projective'.
    4327              *
    4328              * If the value is 'Euclidean', the reflected element of a circle is again a circle,
    4329              * otherwise it is a conic section.
    4330              *
    4331              * @type String
    4332              * @name reflection#type
    4333              * @default 'Euclidean'
    4334              */
    4335             type: 'Euclidean'
    4336
    4337             /**#@-*/
    4338         },
    4339
    4340         /* special regular polygon options */
    4341         regularpolygon: {
    4342             /**#@+
    4343              * @visprop
    4344              */
    4345
    4346             /**
    4347              * If <tt>true</tt>, moving the mouse over inner points triggers hasPoint.
    4348              * @see JXG.GeometryElement#hasPoint
    4349              *
    4350              * @name RegularPolygon#hasInnerPoints
    4351              * @type Boolean
    4352              * @default false
    4353              */
    4354             hasInnerPoints: false,
    4355             fillColor: Color.palette.yellow,
    4356             highlightFillColor: Color.palette.yellow,
    4357             fillOpacity: 0.3,
    4358             highlightFillOpacity: 0.2,
    4359
    4360             /**
    4361              * Is the polygon bordered by lines?
    4362              *
    4363              * @type Boolean
    4364              * @name RegularPolygon#withLines
    4365              * @default true
    4366              */
    4367             withLines: true,
    4368
    4369             /**
    4370              * Attributes for the polygon border lines.
    4371              *
    4372              * @type Line
    4373              * @name RegularPolygon#borders
    4374              */
    4375             borders: {
    4376                 withLabel: false,
    4377                 strokeWidth: 1,
    4378                 highlightStrokeWidth: 1,
    4379                 // Polygon layer + 1
    4380                 layer: 5,
    4381                 label: {
    4382                     position: 'top'
    4383                 }
    4384             },
    4385
    4386             /**
    4387              * Attributes for the polygon vertices.
    4388              *
    4389              * @type Point
    4390              * @name RegularPolygon#vertices
    4391              */
    4392             vertices: {
    4393                 layer: 9,
    4394                 withLabel: true,
    4395                 strokeColor: Color.palette.red,
    4396                 fillColor: Color.palette.red,
    4397                 fixed: false
    4398             },
    4399
    4400             /**
    4401              * Attributes for the polygon label.
    4402              *
    4403              * @type Label
    4404              * @name Polygon#label
    4405              */
    4406             label: {
    4407                 offset: [0, 0]
    4408             }
    4409
    4410             /**#@-*/
    4411         },
    4412
    4413         /* special options for riemann sums */
    4414         riemannsum: {
    4415             /**#@+
    4416              * @visprop
    4417              */
    4418
    4419             withLabel: false,
    4420             fillOpacity: 0.3,
    4421             fillColor: Color.palette.yellow
    4422
    4423             /**#@-*/
    4424         },
    4425
    4426         /* special sector options */
    4427         sector: {
    4428             /**#@+
    4429              * @visprop
    4430              */
    4431
    4432             fillColor: Color.palette.yellow,
    4433             highlightFillColor: Color.palette.yellow,
    4434             // fillColor: '#00ff00',
    4435             // highlightFillColor: '#00ff00',
    4436
    4437             fillOpacity: 0.3,
    4438             highlightFillOpacity: 0.3,
    4439             highlightOnSector: false,
    4440             highlightStrokeWidth: 0,
    4441
    4442             /**
    4443              * Type of sector. Possible values are 'minor', 'major', and 'auto'.
    4444              *
    4445              * @type String
    4446              * @name Sector#selection
    4447              * @default 'auto'
    4448              */
    4449             selection: 'auto',
    4450
    4451             /**
    4452              * Attributes for sub-element arc. It is only available, if the sector is defined by three points.
    4453              *
    4454              * @type Arc
    4455              * @name Sector#arc
    4456              * @default '{visible:false}'
    4457              */
    4458             arc: {
    4459                 visible: false,
    4460                 fillColor: 'none'
    4461             },
    4462
    4463             /**
    4464              * Attributes for helper point radiuspoint in case it is provided by coordinates.
    4465              *
    4466              * @type Point
    4467              * @name Sector#radiusPoint
    4468              */
    4469             radiusPoint: {
    4470                 visible: false,
    4471                 withLabel: false
    4472             },
    4473
    4474             /**
    4475              * Attributes for helper point center in case it is provided by coordinates.
    4476              *
    4477              * @type Point
    4478              * @name Sector#center
    4479              */
    4480             center: {
    4481                 visible: false,
    4482                 withLabel: false
    4483             },
    4484
    4485             /**
    4486              * Attributes for helper point anglepoint in case it is provided by coordinates.
    4487              *
    4488              * @type Point
    4489              * @name Sector#anglePoint
    4490              */
    4491             anglePoint: {
    4492                 visible: false,
    4493                 withLabel: false
    4494             },
    4495
    4496             /**
    4497              * Attributes for the sector label.
    4498              *
    4499              * @type Label
    4500              * @name Sector#label
    4501              */
    4502             label: {
    4503                 offset: [0, 0],
    4504                 anchorX: 'auto',
    4505                 anchorY: 'auto'
    4506             }
    4507
    4508             /**#@-*/
    4509         },
    4510
    4511         /* special segment options */
    4512         segment: {
    4513             /**#@+
    4514              * @visprop
    4515              */
    4516
    4517             label: {
    4518                 position: 'top'
    4519             }
    4520             /**#@-*/
    4521         },
    4522
    4523         semicircle: {
    4524             /**#@+
    4525              * @visprop
    4526              */
    4527
    4528             /**
    4529              * Attributes for center point of the semicircle.
    4530              *
    4531              * @type Point
    4532              * @name Semicircle#center
    4533              */
    4534             center: {
    4535                 visible: false,
    4536                 withLabel: false,
    4537                 fixed: false,
    4538                 fillColor: Color.palette.red,
    4539                 strokeColor: Color.palette.red,
    4540                 highlightFillColor:'#eeeeee',
    4541                 highlightStrokeColor: Color.palette.red,
    4542                 name: ''
    4543             }
    4544
    4545             /**#@-*/
    4546         },
    4547
    4548         /* special slider options */
    4549         slider: {
    4550             /**#@+
    4551              * @visprop
    4552              */
    4553
    4554             /**
    4555              * The slider only returns integer multiples of this value, e.g. for discrete values set this property to <tt>1</tt>. For
    4556              * continuous results set this to <tt>-1</tt>.
    4557              *
    4558              * @memberOf Slider.prototype
    4559              * @name snapWidth
    4560              * @type Number
    4561              */
    4562             snapWidth: -1,      // -1 = deactivated
    4563
    4564             /**
    4565              * The precision of the slider value displayed in the optional text.
    4566              * Replaced by the attribute "digits".
    4567              *
    4568              * @memberOf Slider.prototype
    4569              * @name precision
    4570              * @type Number
    4571              * @deprecated
    4572              * @see Slider#digits
    4573              * @default 2
    4574              */
    4575             precision: 2,
    4576
    4577             /**
    4578              * The number of digits of the slider value displayed in the optional text.
    4579              *
    4580              * @memberOf Slider.prototype
    4581              * @name digits
    4582              * @type Number
    4583              * @default 2
    4584              */
    4585             digits: 2,
    4586
    4587             firstArrow: false,
    4588             lastArrow: false,
    4589
    4590             /**
    4591              * Show slider ticks.
    4592              *
    4593              * @type Boolean
    4594              * @name Slider#withTicks
    4595              * @default true
    4596              */
    4597             withTicks: true,
    4598
    4599             /**
    4600              * Show slider label.
    4601              *
    4602              * @type Boolean
    4603              * @name Slider#withLabel
    4604              * @default true
    4605              */
    4606             withLabel: true,
    4607
    4608             /**
    4609              * If not null, this replaces the part "name = " in the slider label.
    4610              * Possible types: string, number or function.
    4611              * @type String
    4612              * @name suffixLabel
    4613              * @memberOf Slider.prototype
    4614              * @default null
    4615              * @see JXG.Slider#unitLabel
    4616              * @see JXG.Slider#postLabel
    4617              */
    4618             suffixLabel: null,
    4619
    4620             /**
    4621              * If not null, this is appended to the value in the slider label.
    4622              * Possible types: string, number or function.
    4623              * @type String
    4624              * @name unitLabel
    4625              * @memberOf Slider.prototype
    4626              * @default null
    4627              * @see JXG.Slider#suffixLabel
    4628              * @see JXG.Slider#postLabel
    4629              */
    4630             unitLabel: null,
    4631
    4632             /**
    4633              * If not null, this is appended to the value and to unitLabel in the slider label.
    4634              * Possible types: string, number or function.
    4635              * @type String
    4636              * @name postLabel
    4637              * @memberOf Slider.prototype
    4638              * @default null
    4639              * @see JXG.Slider#suffixLabel
    4640              * @see JXG.Slider#unitLabel
    4641              */
    4642             postLabel: null,
    4643
    4644             layer: 9,
    4645             showInfobox: false,
    4646             name: '',
    4647             visible: true,
    4648             strokeColor: '#000000',
    4649             highlightStrokeColor: '#888888',
    4650             fillColor: '#ffffff',
    4651             highlightFillColor: 'none',
    4652
    4653             /**
    4654              * Size of slider point.
    4655              *
    4656              * @type Number
    4657              * @name Slider#size
    4658              * @default 6
    4659              * @see Point#size
    4660              */
    4661             size: 6,
    4662
    4663             /**
    4664              * Attributes for first (left) helper point defining the slider position.
    4665              *
    4666              * @type Point
    4667              * @name Slider#point1
    4668              */
    4669             point1: {
    4670                 needsRegularUpdate: false,
    4671                 showInfobox: false,
    4672                 withLabel: false,
    4673                 visible: false,
    4674                 fixed: true,
    4675                 name: ''
    4676             },
    4677
    4678             /**
    4679              * Attributes for second (right) helper point defining the slider position.
    4680              *
    4681              * @type Point
    4682              * @name Slider#point2
    4683              */
    4684             point2: {
    4685                 needsRegularUpdate: false,
    4686                 showInfobox: false,
    4687                 withLabel: false,
    4688                 visible: false,
    4689                 fixed: true,
    4690                 name: ''
    4691             },
    4692
    4693             /**
    4694              * Attributes for the base line of the slider.
    4695              *
    4696              * @type Line
    4697              * @name Slider#baseline
    4698              */
    4699             baseline: {
    4700                 needsRegularUpdate: false,
    4701                 visible: 'inherit',
    4702                 fixed: true,
    4703                 scalable: false,
    4704                 tabindex: null,
    4705                 name: '',
    4706                 strokeWidth: 1,
    4707                 strokeColor: '#000000',
    4708                 highlightStrokeColor: '#888888'
    4709             },
    4710
    4711             /**
    4712              * Attributes for the ticks of the base line of the slider.
    4713              *
    4714              * @type Ticks
    4715              * @name Slider#ticks
    4716              */
    4717             ticks: {
    4718                 needsRegularUpdate: false,
    4719                 fixed: true,
    4720
    4721                 // Label drawing
    4722                 drawLabels: false,
    4723                 digits: 2,
    4724                 includeBoundaries: 1,
    4725                 drawZero: true,
    4726                 label: {
    4727                     offset: [-4, -14],
    4728                     display: 'internal'
    4729                 },
    4730
    4731                 minTicksDistance: 30,
    4732                 insertTicks: true,
    4733                 minorHeight: 4,         // if <0: full width and height
    4734                 majorHeight: 5,        // if <0: full width and height
    4735                 minorTicks: 0,
    4736                 defaultDistance: 1,
    4737                 strokeOpacity: 1,
    4738                 strokeWidth: 1,
    4739                 tickEndings: [0, 1],
    4740                 strokeColor: '#000000',
    4741                 visible: 'inherit'
    4742             },
    4743
    4744             /**
    4745              * Attributes for the highlighting line of the slider.
    4746              *
    4747              * @type Line
    4748              * @name Slider#highline
    4749              */
    4750             highline: {
    4751                 strokeWidth: 3,
    4752                 visible: 'inherit',
    4753                 fixed: true,
    4754                 tabindex: null,
    4755                 name: '',
    4756                 strokeColor: '#000000',
    4757                 highlightStrokeColor: '#888888'
    4758             },
    4759
    4760             /**
    4761              * Attributes for the slider label.
    4762              *
    4763              * @type Label
    4764              * @name Slider#label
    4765              */
    4766             label: {
    4767                 visible: 'inherit',
    4768                 strokeColor: '#000000'
    4769             },
    4770
    4771             /**
    4772              * If true, 'up' events on the baseline will trigger slider moves.
    4773              *
    4774              * @type: Boolean
    4775              * @name Slider#moveOnUp
    4776              * @default: true
    4777              */
    4778             moveOnUp: true
    4779
    4780             /**#@-*/
    4781         },
    4782
    4783         /* special options for comb */
    4784         comb: {
    4785             /**#@+
    4786              * @visprop
    4787              */
    4788
    4789             /**
    4790              * Frequency of comb elements.
    4791              *
    4792              * @type Number
    4793              * @name Comb#frequency
    4794              * @default 0.2
    4795              */
    4796             frequency: 0.2,
    4797
    4798             /**
    4799              * Width of the comb.
    4800              *
    4801              * @type Number
    4802              * @name Comb#width
    4803              * @default 0.4
    4804              */
    4805             width: 0.4,
    4806
    4807             /**
    4808              * Angle under which comb elements are positioned.
    4809              *
    4810              * @type Number
    4811              * @name Comb#angle
    4812              * @default 60 degrees
    4813              */
    4814             angle: Math.PI / 3,
    4815
    4816             /**
    4817              * Should the comb go right to left instead of left to right.
    4818              *
    4819              * @type Boolean
    4820              * @name Comb#reverse
    4821              * @default false
    4822              */
    4823             reverse: false,
    4824
    4825             /**
    4826              * Attributes for first defining point of the comb.
    4827              *
    4828              * @type Point
    4829              * @name Comb#point1
    4830              */
    4831             point1: {
    4832                 visible: false,
    4833                 withLabel: false,
    4834                 fixed: false,
    4835                 name: ''
    4836             },
    4837
    4838             /**
    4839              * Attributes for second defining point of the comb.
    4840              *
    4841              * @type Point
    4842              * @name Comb#point2
    4843              */
    4844             point2: {
    4845                 visible: false,
    4846                 withLabel: false,
    4847                 fixed: false,
    4848                 name: ''
    4849             },
    4850
    4851             /**
    4852              * Attributes for the curve displaying the comb.
    4853              *
    4854              * @type Curve
    4855              * @name Comb#curve
    4856              */
    4857             curve: {
    4858                 strokeWidth: 1,
    4859                 strokeColor: '#000000',
    4860                 fillColor: 'none'
    4861             }
    4862         },
    4863
    4864         /* special options for slope triangle */
    4865         slopetriangle: {
    4866             /**#@+
    4867              * @visprop
    4868              */
    4869
    4870             fillColor: Color.palette.red,
    4871             fillOpacity: 0.4,
    4872             highlightFillColor: Color.palette.red,
    4873             highlightFillOpacity: 0.3,
    4874
    4875             borders: {
    4876                 lastArrow: {
    4877                     type: 1,
    4878                     size: 6
    4879                 }
    4880             },
    4881
    4882             /**
    4883              * Attributes for the gliding helper point.
    4884              *
    4885              * @type Point
    4886              * @name Slopetriangle#glider
    4887              */
    4888             glider: {
    4889                 fixed: true,
    4890                 visible: false,
    4891                 withLabel: false
    4892             },
    4893
    4894             /**
    4895              * Attributes for the base line.
    4896              *
    4897              * @type Line
    4898              * @name Slopetriangle#baseline
    4899              */
    4900             baseline: {
    4901                 visible: false,
    4902                 withLabel: false,
    4903                 name: ''
    4904             },
    4905
    4906             /**
    4907              * Attributes for the base point.
    4908              *
    4909              * @type Point
    4910              * @name Slopetriangle#basepoint
    4911              */
    4912             basepoint: {
    4913                 visible: false,
    4914                 withLabel: false,
    4915                 name: ''
    4916             },
    4917
    4918             /**
    4919              * Attributes for the tangent.
    4920              * The tangent is constructed by slop triangle if the construction
    4921              * is based on a glider, solely.
    4922              *
    4923              * @type Line
    4924              * @name Slopetriangle#tangent
    4925              */
    4926             tangent: {
    4927                 visible: false,
    4928                 withLabel: false,
    4929                 name: ''
    4930             },
    4931
    4932             /**
    4933              * Attributes for the top point.
    4934              *
    4935              * @type Point
    4936              * @name Slopetriangle#toppoint
    4937              */
    4938             toppoint: {
    4939                 visible: false,
    4940                 withLabel: false,
    4941                 name: ''
    4942             },
    4943
    4944             /**
    4945              * Attributes for the slope triangle label.
    4946              *
    4947              * @type Label
    4948              * @name Slopetriangle#label
    4949              */
    4950             label: {
    4951                 visible: true
    4952             }
    4953             /**#@-*/
    4954         },
    4955
    4956         /* special options for step functions */
    4957         stepfunction: {
    4958             /**#@+
    4959              * @visprop
    4960              */
    4961
    4962             /**#@-*/
    4963         },
    4964
    4965         /* special tape measure options */
    4966         tapemeasure: {
    4967             /**#@+
    4968              * @visprop
    4969              */
    4970
    4971             strokeColor: '#000000',
    4972             strokeWidth: 2,
    4973             highlightStrokeColor: '#000000',
    4974
    4975             /**
    4976              * Show tape measure ticks.
    4977              *
    4978              * @type Boolean
    4979              * @name Tapemeasure#withTicks
    4980              * @default true
    4981              */
    4982             withTicks: true,
    4983
    4984             /**
    4985              * Show tape measure label.
    4986              *
    4987              * @type Boolean
    4988              * @name Tapemeasure#withLabel
    4989              * @default true
    4990              */
    4991             withLabel: true,
    4992
    4993             /**
    4994              * The precision of the tape measure value displayed in the optional text.
    4995              * Replaced by the attribute digits
    4996              *
    4997              * @memberOf Tapemeasure.prototype
    4998              * @name precision
    4999              * @type Number
    5000              * @deprecated
    5001              * @see Tapemeasure#digits
    5002              * @default 2
    5003              */
    5004             precision: 2,
    5005
    5006             /**
    5007              * The precision of the tape measure value displayed in the optional text.
    5008              * @memberOf Tapemeasure.prototype
    5009              * @name precision
    5010              * @type Number
    5011              * @default 2
    5012              */
    5013             digits: 2,
    5014
    5015             /**
    5016              * Attributes for first helper point defining the tape measure position.
    5017              *
    5018              * @type Point
    5019              * @name Tapemeasure#point1
    5020              */
    5021             point1: {
    5022                 visible: 'inherit',
    5023                 strokeColor: '#000000',
    5024                 fillColor: '#ffffff',
    5025                 fillOpacity: 0.0,
    5026                 highlightFillOpacity: 0.1,
    5027                 size: 6,
    5028                 snapToPoints: true,
    5029                 attractorUnit: 'screen',
    5030                 attractorDistance: 20,
    5031                 showInfobox: false,
    5032                 withLabel: false,
    5033                 name: ''
    5034             },
    5035
    5036             /**
    5037              * Attributes for second helper point defining the tape measure position.
    5038              *
    5039              * @type Point
    5040              * @name Tapemeasure#point2
    5041              */
    5042             point2: {
    5043                 visible: 'inherit',
    5044                 strokeColor: '#000000',
    5045                 fillColor: '#ffffff',
    5046                 fillOpacity: 0.0,
    5047                 highlightFillOpacity: 0.1,
    5048                 size: 6,
    5049                 snapToPoints: true,
    5050                 attractorUnit: 'screen',
    5051                 attractorDistance: 20,
    5052                 showInfobox: false,
    5053                 withLabel: false,
    5054                 name: ''
    5055             },
    5056
    5057             /**
    5058              * Attributes for the ticks of the tape measure.
    5059              *
    5060              * @type Ticks
    5061              * @name Tapemeasure#ticks
    5062              */
    5063             ticks: {
    5064                 drawLabels: false,
    5065                 drawZero: true,
    5066                 insertTicks: true,
    5067                 minorHeight: 8,
    5068                 majorHeight: 16,
    5069                 minorTicks: 4,
    5070                 tickEndings: [0, 1],
    5071                 defaultDistance: 0.1,
    5072                 strokeOpacity: 1,
    5073                 strokeWidth: 1,
    5074                 strokeColor: '#000000',
    5075                 visible: 'inherit'
    5076             },
    5077
    5078             /**
    5079              * Attributes for the tape measure label.
    5080              *
    5081              * @type Label
    5082              * @name Tapemeasure#label
    5083              */
    5084             label: {
    5085                 position: 'top'
    5086             }
    5087             /**#@-*/
    5088         },
    5089
    5090         /* special text options */
    5091         text: {
    5092             /**#@+
    5093              * @visprop
    5094              */
    5095
    5096             /**
    5097              * The font size in pixels.
    5098              *
    5099              * @name fontSize
    5100              * @memberOf Text.prototype
    5101              * @default 12
    5102              * @type Number
    5103              * @see Text#fontUnit
    5104              */
    5105             fontSize: 12,
    5106
    5107             /**
    5108              * CSS unit for the font size of a text element. Usually, this will be the default value 'px' but
    5109              * for responsive application, also 'vw', 'vh', vmax', 'vmin' or 'rem' might be useful.
    5110              *
    5111              * @name fontUnit
    5112              * @memberOf Text.prototype
    5113              * @default 'px'
    5114              * @type String
    5115              * @see Text#fontSize
    5116              *
    5117              * @example
    5118              * var txt = board.create('text', [2, 2, "hello"], {fontSize: 8, fontUnit: 'vmin'});
    5119              *
    5120              * </pre><div id="JXG2da7e972-ac62-416b-a94b-32559c9ec9f9" class="jxgbox" style="width: 300px; height: 300px;"></div>
    5121              * <script type="text/javascript">
    5122              *     (function() {
    5123              *         var board = JXG.JSXGraph.initBoard('JXG2da7e972-ac62-416b-a94b-32559c9ec9f9',
    5124              *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false, shownavigation: false});
    5125              *     var txt = board.create('text', [2, 2, "hello"], {fontSize: 8, fontUnit: 'vmin'});
    5126              *
    5127              *     })();
    5128              *
    5129              * </script><pre>
    5130              *
    5131              */
    5132             fontUnit: 'px',
    5133
    5134             /**
    5135              * Used to round texts given by a number.
    5136              *
    5137              * @name digits
    5138              * @memberOf Text.prototype
    5139              * @default 2
    5140              * @type Number
    5141              */
    5142             digits: 2,
    5143
    5144             /**
    5145              * If set to true, the text is parsed and evaluated.
    5146              * For labels parse==true results in converting names of the form k_a to subscripts.
    5147              * If the text is given by string and parse==true, the string is parsed as
    5148              * JessieCode expression.
    5149              *
    5150              * @name parse
    5151              * @memberOf Text.prototype
    5152              * @default true
    5153              * @type Boolean
    5154              */
    5155             parse: true,
    5156
    5157             /**
    5158              * If set to true and caja's sanitizeHTML function can be found it
    5159              * will be used to sanitize text output.
    5160              *
    5161              * @name useCaja
    5162              * @memberOf Text.prototype
    5163              * @default false
    5164              * @type Boolean
    5165              */
    5166             useCaja: false,
    5167
    5168             /**
    5169              * If enabled, the text will be handled as label. Intended for internal use.
    5170              *
    5171              * @name isLabel
    5172              * @memberOf Text.prototype
    5173              * @default false
    5174              * @type Boolean
    5175              */
    5176             isLabel: false,
    5177
    5178             strokeColor: '#000000',
    5179             highlightStrokeColor: '#000000',
    5180             highlightStrokeOpacity: 0.666666,
    5181
    5182             /**
    5183              * Default CSS properties of the HTML text element.
    5184              * <p>
    5185              * The CSS properties which are set here, are handed over to the style property
    5186              * of the HTML text element. That means, they have higher property than any
    5187              * CSS class.
    5188              * <p>
    5189              * If a property which is set here should be overruled by a CSS class
    5190              * then this property should be removed here.
    5191              * <p>
    5192              * The reason, why this attribute should be kept to its default value at all,
    5193              * is that screen dumps of SVG boards with <tt>board.renderer.dumpToCanvas()</tt>
    5194              * will ignore the font-family if it is set in a CSS class.
    5195              * It has to be set explicitly as style attribute.
    5196              * <p>
    5197              * In summary, the order of priorities from high to low is
    5198              * <ol>
    5199              *  <li> JXG.Options.text.cssStyle
    5200              *  <li> JXG.Options.text.cssDefaultStyle
    5201              *  <li> JXG.Options.text.cssClass
    5202              * </ol>
    5203              * @example
    5204              * If all texts should get its font-family from the default CSS class
    5205              * before initializing the board
    5206              * <pre>
    5207              *   JXG.Options.text.cssDefaultStyle = '';
    5208              *   JXG.Options.text.highlightCssDefaultStyle = '';
    5209              * </pre>
    5210              * should be called.
    5211              *
    5212              * @name cssDefaultStyle
    5213              * @memberOf Text.prototype
    5214              * @default  'font-family: Arial, Helvetica, Geneva, sans-serif;'
    5215              * @type String
    5216              * @see Text#highlightCssDefaultStyle
    5217              * @see Text#cssStyle
    5218              * @see Text#highlightCssStyle
    5219              */
    5220             cssDefaultStyle: 'font-family: Arial, Helvetica, Geneva, sans-serif;',
    5221
    5222             /**
    5223              * Default CSS properties of the HTML text element in case of highlighting.
    5224              * <p>
    5225              * The CSS properties which are set here, are handed over to the style property
    5226              * of the HTML text element. That means, they have higher property than any
    5227              * CSS class.
    5228              * @example
    5229              * If all texts should get its font-family from the default CSS class
    5230              * before initializing the board
    5231              * <pre>
    5232              *   JXG.Options.text.cssDefaultStyle = '';
    5233              *   JXG.Options.text.highlightCssDefaultStyle = '';
    5234              * </pre>
    5235              * should be called.
    5236              *
    5237              * @name highlightCssDefaultStyle
    5238              * @memberOf Text.prototype
    5239              * @default  'font-family: Arial, Helvetica, Geneva, sans-serif;'
    5240              * @type String
    5241              * @see Text#cssDefaultStyle
    5242              * @see Text#cssStyle
    5243              * @see Text#highlightCssStyle
    5244             */
    5245             highlightCssDefaultStyle: 'font-family: Arial, Helvetica, Geneva, sans-serif;',
    5246
    5247             /**
    5248              * CSS properties of the HTML text element.
    5249              * <p>
    5250              * The CSS properties which are set here, are handed over to the style property
    5251              * of the HTML text element. That means, they have higher property than any
    5252              * CSS class.
    5253              *
    5254              * @name cssStyle
    5255              * @memberOf Text.prototype
    5256              * @default  ''
    5257              * @type String
    5258              * @see Text#cssDefaultStyle
    5259              * @see Text#highlightCssDefaultStyle
    5260              * @see Text#highlightCssStyle
    5261             */
    5262             cssStyle: '',
    5263
    5264             /**
    5265              * CSS properties of the HTML text element in case of highlighting.
    5266              * <p>
    5267              * The CSS properties which are set here, are handed over to the style property
    5268              * of the HTML text element. That means, they have higher property than any
    5269              * CSS class.
    5270              *
    5271              * @name highlightCssStyle
    5272              * @memberOf Text.prototype
    5273              * @default  ''
    5274              * @type String
    5275              * @see Text#cssDefaultStyle
    5276              * @see Text#highlightCssDefaultStyle
    5277              * @see Text#cssStyle
    5278             */
    5279             highlightCssStyle: '',
    5280
    5281             /**
    5282              * If true, the input will be given to ASCIIMathML before rendering.
    5283              *
    5284              * @name useASCIIMathML
    5285              * @memberOf Text.prototype
    5286              * @default false
    5287              * @type Boolean
    5288              */
    5289             useASCIIMathML: false,
    5290
    5291             /**
    5292              * If true, MathJax will be used to render the input string.
    5293              * Supports MathJax 2 as well as Mathjax 3.
    5294              * It is recommended to use this option together with the option
    5295              * "parse: false". Otherwise, 4 backslashes (e.g. \\\\alpha) are needed
    5296              * instead of two (e.g. \\alpha).
    5297              *
    5298              * @name useMathJax
    5299              * @memberOf Text.prototype
    5300              * @default false
    5301              * @type Boolean
    5302              * @see Text#parse
    5303              *
    5304              * @example
    5305              *  // Before loading MathJax, it has to be configured something like this:
    5306              * window.MathJax = {
    5307              *   tex: {
    5308              *     inlineMath: [ ['$','$'], ["\\(","\\)"] ],
    5309              *     displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
    5310              *     packages: ['base', 'ams']
    5311              *   },
    5312              *   options: {
    5313              *     ignoreHtmlClass: 'tex2jax_ignore',
    5314              *     processHtmlClass: 'tex2jax_process'
    5315              *   }
    5316              * };
    5317              *
    5318              * // Display style
    5319              * board.create('text',[ 2,2,  function(){return '$$X=\\frac{2}{x}$$'}], {
    5320              *     fontSize: 15, color:'green', useMathJax: true});
    5321              *
    5322              * // Inline style
    5323              * board.create('text',[-2,2,  function(){return '$X_A=\\frac{2}{x}$'}], {
    5324              *     fontSize: 15, color:'green', useMathJax: true});
    5325              *
    5326              * var A = board.create('point', [-2, 0]);
    5327              * var B = board.create('point', [1, 0]);
    5328              * var C = board.create('point', [0, 1]);
    5329              *
    5330              * var graph = board.create('ellipse', [A, B, C], {
    5331              *         fixed: true,
    5332              *         withLabel: true,
    5333              *         strokeColor: 'black',
    5334              *         strokeWidth: 2,
    5335              *         fillColor: '#cccccc',
    5336              *         fillOpacity: 0.3,
    5337              *         highlightStrokeColor: 'red',
    5338              *         highlightStrokeWidth: 3,
    5339              *         name: '$1=\\frac{(x-h)^2}{a^2}+\\frac{(y-k)^2}{b^2}$',
    5340              *         label: {useMathJax: true}
    5341              *     });
    5342              *
    5343              * var nvect1 = board.create('text', [-4, -3, '\\[\\overrightarrow{V}\\]'],
    5344              * {
    5345              *   fontSize: 24, parse: false
    5346              * });
    5347              * var nvect1 = board.create('text', [-2, -4, function() {return '$\\overrightarrow{G}$';}],
    5348              * {
    5349              *   fontSize: 24, useMathJax: true
    5350              * });
    5351              *
    5352              * </pre>
    5353              * <script>
    5354              * window.MathJax = {
    5355              *   tex: {
    5356              *     inlineMath: [ ['$','$'], ["\\(","\\)"] ],
    5357              *     displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
    5358              *     packages: ['base', 'ams']
    5359              *   },
    5360              *   options: {
    5361              *     ignoreHtmlClass: 'tex2jax_ignore',
    5362              *     processHtmlClass: 'tex2jax_process'
    5363              *   }
    5364              * };
    5365              * </script>
    5366              * <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script>
    5367              * <div id="JXGe2a04876-5813-4db0-b7e8-e48bf4e220b9" class="jxgbox" style="width: 400px; height: 400px;"></div>
    5368              * <script type="text/javascript">
    5369              *     (function() {
    5370              *         var board = JXG.JSXGraph.initBoard('JXGe2a04876-5813-4db0-b7e8-e48bf4e220b9',
    5371              *             {boundingbox: [-5, 5, 5, -5], axis: true, showcopyright: false, shownavigation: false});
    5372              *     // Display style
    5373              *     board.create('text',[ 2,2,  function(){return '$$X=\\frac{2}{x}$$'}], {
    5374              *         fontSize: 15, color:'green', useMathJax: true});
    5375              *
    5376              *     // Inline style
    5377              *     board.create('text',[-2,2,  function(){return '$X_A=\\frac{2}{x}$'}], {
    5378              *         fontSize: 15, color:'green', useMathJax: true});
    5379              *
    5380              *     var A = board.create('point', [-2, 0]);
    5381              *     var B = board.create('point', [1, 0]);
    5382              *     var C = board.create('point', [0, 1]);
    5383              *
    5384              *     var graph = board.create('ellipse', [A, B, C], {
    5385              *             fixed: true,
    5386              *             withLabel: true,
    5387              *             strokeColor: 'black',
    5388              *             strokeWidth: 2,
    5389              *             fillColor: '#cccccc',
    5390              *             fillOpacity: 0.3,
    5391              *             highlightStrokeColor: 'red',
    5392              *             highlightStrokeWidth: 3,
    5393              *             name: '$1=\\frac{(x-h)^2}{a^2}+\\frac{(y-k)^2}{b^2}$',
    5394              *             label: {useMathJax: true}
    5395              *         });
    5396              *
    5397              *     var nvect1 = board.create('text', [-4, -3, '\\[\\overrightarrow{V}\\]'],
    5398              *     {
    5399              *       fontSize: 24, parse: false
    5400              *     });
    5401              *     var nvect1 = board.create('text', [-2, -4, function() {return '$\\overrightarrow{G}$';}],
    5402              *     {
    5403              *       fontSize: 24, useMathJax: true
    5404              *     });
    5405              *     })();
    5406              *
    5407              * </script><pre>
    5408              *
    5409              *
    5410              * @example
    5411              * // Load MathJax:
    5412              * // <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"<</script>
    5413              *
    5414              * // function and its derivative
    5415              * var f1 = function(x) { return x * x * x; },
    5416              * graph1 = board.create('functiongraph', [f1, -0.1, 1.1]),
    5417              *
    5418              * A = board.create('glider', [0.5, f1(0.5), graph1], {
    5419              *             name: 'f(x)',
    5420              *             color: 'black',
    5421              *             face:'x',
    5422              *             fixed: true,
    5423              *             size: 3,
    5424              *             label: {offset: [-30, 10], fontSize: 15}
    5425              *         }),
    5426              * B = board.create('glider', [0.7, f1(0.7), graph1], {
    5427              *             name: 'f(x+Δx)',
    5428              *             size: 3,
    5429              *             label: {offset: [-60, 10], fontSize: 15}
    5430              *         }),
    5431              *
    5432              * secant_line = board.create('line', [A,B],{dash: 1, color: 'green'}),
    5433              * a_h_segment = board.create('segment', [A, [
    5434              *                     function(){ return B.X() > A.X() ? B.X() : A.X()},
    5435              *                     function(){ return B.X() > A.X() ? A.Y() : B.Y()}
    5436              *                 ]],{ name: 'Δx', dash: 1, color: 'black'});
    5437              *
    5438              * b_v_segment = board.create('segment', [B, [
    5439              *                     function(){ return B.X() > A.X() ? B.X() : A.X()},
    5440              *                     function(){ return B.X() > A.X() ? A.Y() : B.Y()}
    5441              *                 ]],{ name: 'Δy', dash: 1, color: 'black'}),
    5442              *
    5443              * ma = board.create('midpoint', [a_h_segment.point1, a_h_segment.point2
    5444              *     ], {visible: false});
    5445              *
    5446              * board.create('text', [0, 0, function() {return '\\[\\Delta_x='+(B.X()-A.X()).toFixed(4)+'\\]'}], {
    5447              *     anchor: ma, useMathJax: true, fixed: true, color: 'green', anchorY: 'top'
    5448              * });
    5449              *
    5450              * mb = board.create('midpoint', [b_v_segment.point1, b_v_segment.point2], {visible: false});
    5451              * board.create('text', [0, 0, function() {return '\\[\\Delta_y='+(B.Y()-A.Y()).toFixed(4)+'\\]'}], {
    5452              *     anchor: mb, useMathJax: true, fixed: true, color: 'green'
    5453              * });
    5454              *
    5455              * dval = board.create('text',[0.1, 0.8,
    5456              *     function(){
    5457              *         return '\\[\\frac{\\Delta_y}{\\Delta_x}=\\frac{' + ((B.Y()-A.Y()).toFixed(4)) + '}{' + ((B.X()-A.X()).toFixed(4)) +
    5458              *             '}=' + (((B.Y()-A.Y()).toFixed(4))/((B.X()-A.X()).toFixed(4))).toFixed(4) + '\\]';
    5459              *     }],{fontSize: 15, useMathJax: true});
    5460              *
    5461              * </pre>
    5462              * <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script>
    5463              * <div id="JXG8c2b65e7-4fc4-43f7-b23c-5076a7fa9621" class="jxgbox" style="width: 400px; height: 400px;"></div>
    5464              * <script type="text/javascript">
    5465              *     (function() {
    5466              *         var board = JXG.JSXGraph.initBoard('JXG8c2b65e7-4fc4-43f7-b23c-5076a7fa9621',
    5467              *             {boundingbox: [-0.1, 1.1, 1.1, -0.1], axis: true, showcopyright: false, shownavigation: false});
    5468              *     // function and its derivative
    5469              *     var f1 = function(x) { return x * x * x; },
    5470              *     graph1 = board.create('functiongraph', [f1, -0.1, 1.1]),
    5471              *
    5472              *     A = board.create('glider', [0.5, f1(0.5), graph1], {
    5473              *                 name: 'f(x)',
    5474              *                 color: 'black',
    5475              *                 face:'x',
    5476              *                 fixed: true,
    5477              *                 size: 3,
    5478              *                 label: {offset: [-30, 10], fontSize: 15}
    5479              *             }),
    5480              *     B = board.create('glider', [0.7, f1(0.7), graph1], {
    5481              *                 name: 'f(x+Δx)',
    5482              *                 size: 3,
    5483              *                 label: {offset: [-60, 10], fontSize: 15}
    5484              *             }),
    5485              *
    5486              *     secant_line = board.create('line', [A,B],{dash: 1, color: 'green'}),
    5487              *     a_h_segment = board.create('segment', [A, [
    5488              *                         function(){ return B.X() > A.X() ? B.X() : A.X()},
    5489              *                         function(){ return B.X() > A.X() ? A.Y() : B.Y()}
    5490              *                     ]],{ name: 'Δx', dash: 1, color: 'black'});
    5491              *
    5492              *     b_v_segment = board.create('segment', [B, [
    5493              *                         function(){ return B.X() > A.X() ? B.X() : A.X()},
    5494              *                         function(){ return B.X() > A.X() ? A.Y() : B.Y()}
    5495              *                     ]],{ name: 'Δy', dash: 1, color: 'black'}),
    5496              *
    5497              *     ma = board.create('midpoint', [a_h_segment.point1, a_h_segment.point2
    5498              *         ], {visible: false});
    5499              *
    5500              *     board.create('text', [0, 0, function() {return '\\[\\Delta_x='+(B.X()-A.X()).toFixed(4)+'\\]'}], {
    5501              *         anchor: ma, useMathJax: true, fixed: true, color: 'green', anchorY: 'top'
    5502              *     });
    5503              *
    5504              *     mb = board.create('midpoint', [b_v_segment.point1, b_v_segment.point2], {visible: false});
    5505              *     board.create('text', [0, 0, function() {return '\\[\\Delta_y='+(B.Y()-A.Y()).toFixed(4)+'\\]'}], {
    5506              *         anchor: mb, useMathJax: true, fixed: true, color: 'green'
    5507              *     });
    5508              *
    5509              *     dval = board.create('text',[0.1, 0.8,
    5510              *         function(){
    5511              *             return '\\[\\frac{\\Delta_y}{\\Delta_x}=\\frac{' + ((B.Y()-A.Y()).toFixed(4)) + '}{' + ((B.X()-A.X()).toFixed(4)) +
    5512              *                 '}=' + (((B.Y()-A.Y()).toFixed(4))/((B.X()-A.X()).toFixed(4))).toFixed(4) + '\\]';
    5513              *         }],{fontSize: 15, useMathJax: true});
    5514              *
    5515              *     })();
    5516              *
    5517              * </script><pre>
    5518              *
    5519              * @example
    5520              * var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-1, 10, 11, -2], axis: true});
    5521              * board.options.text.useMathjax = true;
    5522              *
    5523              * a = board.create('slider',[[-0.7,1.5],[5,1.5],[0,0.5,1]], {
    5524              *     suffixlabel:'\\(t_1=\\)',
    5525              *     unitLabel: ' \\(\\text{ ms}\\)',
    5526              *     snapWidth:0.01}),
    5527              *
    5528              * func = board.create('functiongraph',[function(x){return (a.Value()*x*x)}], {strokeColor: "red"});
    5529              * text1 = board.create('text', [5, 1, function(){
    5530              *             return '\\(a(t)= { 1 \\over ' + a.Value().toFixed(3) + '}\\)';
    5531              *         }], {fontSize: 15, fixed:true, strokeColor:'red', anchorY: 'top', parse: false});
    5532              *
    5533              * </pre><div id="JXGf8bd01db-fb6a-4a5c-9e7f-8823f7aa5ac6" class="jxgbox" style="width: 300px; height: 300px;"></div>
    5534              * <script type="text/javascript">
    5535              *     (function() {
    5536              *         var board = JXG.JSXGraph.initBoard('JXGf8bd01db-fb6a-4a5c-9e7f-8823f7aa5ac6',
    5537              *             {boundingbox: [-1, 10, 11, -2], axis: true, showcopyright: false, shownavigation: false});
    5538              *     board.options.text.useMathjax = true;
    5539              *
    5540              *     a = board.create('slider',[[-0.7,1.5],[5,1.5],[0,0.5,1]], {
    5541              *         suffixlabel:'\\(t_1=\\)',
    5542              *         unitLabel: ' \\(\\text{ ms}\\)',
    5543              *         snapWidth:0.01}),
    5544              *
    5545              *     func = board.create('functiongraph',[function(x){return (a.Value()*x*x)}], {strokeColor: "red"});
    5546              *     text1 = board.create('text', [5, 1, function(){
    5547              *                 return '\\(a(t)= { 1 \\over ' + a.Value().toFixed(3) + '}\\)';
    5548              *             }], {fontSize: 15, fixed:true, strokeColor:'red', anchorY: 'top', parse: false});
    5549              *
    5550              *     })();
    5551              *
    5552              * </script><pre>
    5553              *
    5554              */
    5555             useMathJax: false,
    5556
    5557             /**
    5558              *
    5559              * If true, KaTeX will be used to render the input string.
    5560              * For this feature, katex.min.js and katex.min.css have to be included.
    5561              * <p>
    5562              * The example below does not work, because there is a conflict with
    5563              * the MathJax library which is used below.
    5564              * </p>
    5565              *
    5566              * @name useKatex
    5567              * @memberOf Text.prototype
    5568              * @default false
    5569              * @type Boolean
    5570              *
    5571              *
    5572              * @example
    5573              * JXG.Options.text.useKatex = true;
    5574              *
    5575              * const board = JXG.JSXGraph.initBoard('jxgbox', {
    5576              *     boundingbox: [-2, 5, 8, -5], axis:true
    5577              * });
    5578              *
    5579              * var a = board.create('slider',[[-0.7,1.5],[5,1.5],[0,0.5,1]], {
    5580              *     suffixlabel:'t_1=',
    5581              *     unitLabel: ' \\text{ ms}',
    5582              *     snapWidth:0.01});
    5583              *
    5584              * func = board.create('functiongraph',[function(x){return (a.Value()*x*x)}], {strokeColor: "red"});
    5585              * text1 = board.create('text', [5, 1, function(){
    5586              *             return 'a(t)= { 1 \\over ' + a.Value().toFixed(3) + '}';
    5587              *         }], {fontSize: 15, fixed:true, strokeColor:'red', anchorY: 'top'});
    5588              *
    5589              * </pre>
    5590              * <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.10/dist/katex.min.css" integrity="sha384-0cCFrwW/0bAk1Z/6IMgIyNU3kfTcNirlObr4WjrUU7+hZeD6ravdYJ3kPWSeC31M" crossorigin="anonymous">
    5591              * <script src="https://cdn.jsdelivr.net/npm/katex@0.13.10/dist/katex.min.js" integrity="sha384-dtFDxK2tSkECx/6302Z4VN2ZRqt6Gis+b1IwCjJPrn0kMYFQT9rbtyQWg5NFWAF7" crossorigin="anonymous"></script>
    5592              * <div id="JXG497f065c-cfc1-44c3-ba21-5fa581668869" class="jxgbox" style="width: 300px; height: 300px;"></div>
    5593              * <script type="text/javascript">
    5594              *     (function() {
    5595              *         var board = JXG.JSXGraph.initBoard('JXG497f065c-cfc1-44c3-ba21-5fa581668869',
    5596              *             {boundingbox: [-2, 5, 8, -5], axis: true, showcopyright: false, shownavigation: false});
    5597              *     board.options.useKatex = true;
    5598              *     var a = board.create('slider',[[-0.7,1.5],[5,1.5],[0,0.5,1]], {
    5599              *         suffixlabel:'t_1=',
    5600              *         unitLabel: ' \\text{ ms}',
    5601              *         snapWidth:0.01});
    5602              *
    5603              *     func = board.create('functiongraph',[function(x){return (a.Value()*x*x)}], {strokeColor: "red"});
    5604              *     text1 = board.create('text', [5, 1, function(){
    5605              *                 return 'a(t)= { 1 \\over ' + a.Value().toFixed(3) + '}';
    5606              *             }], {fontSize: 15, fixed:true, strokeColor:'red', anchorY: 'top'});
    5607              *
    5608              *     })();
    5609              *
    5610              * </script><pre>
    5611              */
    5612             useKatex: false,
    5613
    5614             /**
    5615              * Determines the rendering method of the text. Possible values
    5616              * include <tt>'html'</tt> and <tt>'internal</tt>.
    5617              *
    5618              * @name display
    5619              * @memberOf Text.prototype
    5620              * @default 'html'
    5621              * @type String
    5622              */
    5623             display: 'html',
    5624
    5625             /**
    5626              * Anchor element {@link Point}, {@link Text} or {@link Image} of the text. If it exists, the coordinates of the text are relative
    5627              * to this anchor element.
    5628              *
    5629              * @name anchor
    5630              * @memberOf Text.prototype
    5631              * @default null
    5632              * @type Object
    5633              */
    5634             anchor: null,
    5635
    5636             /**
    5637              * The horizontal alignment of the text. Possible values include <tt>'auto</tt>, <tt>'left'</tt>, <tt>'middle'</tt>, and
    5638              * <tt>'right'</tt>.
    5639              *
    5640              * @name anchorX
    5641              * @memberOf Text.prototype
    5642              * @default 'left'
    5643              * @type String
    5644              */
    5645             anchorX: 'left',
    5646
    5647             /**
    5648              * The vertical alignment of the text. Possible values include <tt>'auto</tt>, <tt>'top'</tt>, <tt>'middle'</tt>, and
    5649              * <tt>'bottom'</tt>.
    5650              *
    5651              * @name anchorY
    5652              * @memberOf Text.prototype
    5653              * @default 'auto'
    5654              * @type String
    5655              */
    5656             anchorY: 'middle',
    5657
    5658             /**
    5659              * CSS class of the text in non-highlighted view.
    5660              *
    5661              * @name cssClass
    5662              * @memberOf Text.prototype
    5663              * @type String
    5664              */
    5665             cssClass: 'JXGtext',
    5666
    5667             /**
    5668              * CSS class of the text in highlighted view.
    5669              *
    5670              * @name highlightCssClass
    5671              * @memberOf Text.prototype
    5672              * @type String
    5673              */
    5674             highlightCssClass: 'JXGtext',
    5675
    5676             /**
    5677              * Sensitive area for dragging the text.
    5678              * Possible values are 'all', or something else.
    5679              * If set to 'small', a sensitivity margin at the right and left border is taken.
    5680              * This may be extended to left, right, ... in the future.
    5681              *
    5682              * @name Text#dragArea
    5683              * @type String
    5684              * @default 'all'
    5685              */
    5686             dragArea: 'all',
    5687
    5688             withLabel: false,
    5689
    5690             /**
    5691              * Text rotation in degrees.
    5692              * Works for non-zero values only in combination with display=='internal'.
    5693              *
    5694              * @name Text#rotate
    5695              * @type Number
    5696              * @default 0
    5697              */
    5698             rotate: 0,
    5699
    5700             visible: true,
    5701
    5702             /**
    5703              * Defines together with {@link Text#snapSizeY} the grid the text snaps on to.
    5704              * The text will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    5705              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    5706              * of the default ticks of the default x axes of the board.
    5707              *
    5708              * @name snapSizeX
    5709              * @memberOf Text.prototype
    5710              *
    5711              * @see Point#snapToGrid
    5712              * @see Text#snapSizeY
    5713              * @see JXG.Board#defaultAxes
    5714              * @type Number
    5715              * @default 1
    5716              */
    5717             snapSizeX: 1,
    5718
    5719             /**
    5720              * Defines together with {@link Text#snapSizeX} the grid the text snaps on to.
    5721              * The text will only snap on integer multiples to snapSizeX in x and snapSizeY in y direction.
    5722              * If this value is equal to or less than <tt>0</tt>, it will use the grid displayed by the major ticks
    5723              * of the default ticks of the default y axes of the board.
    5724              *
    5725              * @name snapSizeY
    5726              * @memberOf Text.prototype
    5727              *
    5728              * @see Point#snapToGrid
    5729              * @see Text#snapSizeX
    5730              * @see JXG.Board#defaultAxes
    5731              * @type Number
    5732              * @default 1
    5733              */
    5734             snapSizeY: 1,
    5735
    5736             /**
    5737              * List of attractor elements. If the distance of the text is less than
    5738              * attractorDistance the text is made to glider of this element.
    5739              *
    5740              * @name attractors
    5741              * @memberOf Text.prototype
    5742              * @type Array
    5743              * @default empty
    5744              */
    5745             attractors: []
    5746
    5747             /**#@-*/
    5748         },
    5749
    5750         /* special options for trace curves */
    5751         tracecurve: {
    5752             /**#@+
    5753              * @visprop
    5754              */
    5755             strokeColor: '#000000',
    5756             fillColor: 'none',
    5757
    5758             /**
    5759              * The number of evaluated data points.
    5760              * @memberOf Tracecurve.prototype
    5761              * @default 100
    5762              * @name numberPoints
    5763              * @type Number
    5764              */
    5765             numberPoints: 100
    5766
    5767             /**#@-*/
    5768         },
    5769
    5770         /*special turtle options */
    5771         turtle: {
    5772             /**#@+
    5773              * @visprop
    5774              */
    5775
    5776             strokeWidth: 1,
    5777             fillColor: 'none',
    5778             strokeColor: '#000000',
    5779
    5780             /**
    5781              * Attributes for the turtle arrow.
    5782              *
    5783              * @type Curve
    5784              * @name Turtle#arrow
    5785              */
    5786             arrow: {
    5787                 strokeWidth: 2,
    5788                 withLabel: false,
    5789                 strokeColor: Color.palette.red,
    5790                 lastArrow: true
    5791             }
    5792             /**#@-*/
    5793         },
    5794
    5795         /**
    5796          * Abbreviations of attributes. Setting the shortcut means setting abbreviated properties
    5797          * to the same value.
    5798          * It is used in {@link JXG.GeometryElement#setAttribute} and in
    5799          * the constructor {@link JXG.GeometryElement}.
    5800          * Attention: In Options.js abbreviations are not allowed.
    5801          * @type Object
    5802          * @name JXG.Options#shortcuts
    5803          *
    5804          */
    5805         shortcuts: {
    5806             color: ['strokeColor', 'fillColor'],
    5807             opacity: ['strokeOpacity', 'fillOpacity'],
    5808             highlightColor: ['highlightStrokeColor', 'highlightFillColor'],
    5809             highlightOpacity: ['highlightStrokeOpacity', 'highlightFillOpacity'],
    5810             strokeWidth: ['strokeWidth', 'highlightStrokeWidth']
    5811         }
    5812     };
    5813
    5814     /**
    5815      * Holds all possible properties and the according validators for geometry elements.
    5816      * A validator is either a function
    5817      * which takes one parameter and returns true, if the value is valid for the property,
    5818      * or it is false if no validator is required.
    5819      */
    5820     JXG.Validator = (function () {
    5821         var i,
    5822             validatePixel = function (v) {
    5823                 return (/^[0-9]+px$/).test(v);
    5824             },
    5825             validateDisplay = function (v) {
    5826                 return (v  === 'html' || v === 'internal');
    5827             },
    5828             validateColor = function (v) {
    5829                 // for now this should do it...
    5830                 return Type.isString(v);
    5831             },
    5832             validatePointFace = function (v) {
    5833                 return Type.exists(JXG.normalizePointFace(v));
    5834             },
    5835             validateInteger = function (v) {
    5836                 return (Math.abs(v - Math.round(v)) < Mat.eps);
    5837             },
    5838             validateNotNegativeInteger = function (v) {
    5839                 return validateInteger(v) && v >= 0;
    5840             },
    5841             validatePositiveInteger = function (v) {
    5842                 return validateInteger(v) && v > 0;
    5843             },
    5844             validateScreenCoords = function (v) {
    5845                 return v.length >= 2 && validateInteger(v[0]) && validateInteger(v[1]);
    5846             },
    5847             validateRenderer = function (v) {
    5848                 return (v === 'vml' || v === 'svg' || v === 'canvas' || v === 'no');
    5849             },
    5850             validatePositive = function (v) {
    5851                 return v > 0;
    5852             },
    5853             validateNotNegative = function (v) {
    5854                 return v >= 0;
    5855             },
    5856             v = {},
    5857             validators = {
    5858                 attractorDistance: validateNotNegative,
    5859                 color: validateColor,
    5860                 defaultDistance: Type.isNumber,
    5861                 display: validateDisplay,
    5862                 doAdvancedPlot: false,
    5863                 draft: false,
    5864                 drawLabels: false,
    5865                 drawZero: false,
    5866                 face: validatePointFace,
    5867                 factor: Type.isNumber,
    5868                 fillColor: validateColor,
    5869                 fillOpacity: Type.isNumber,
    5870                 firstArrow: false,
    5871                 fontSize: validateInteger,
    5872                 dash: validateInteger,
    5873                 gridX: Type.isNumber,
    5874                 gridY: Type.isNumber,
    5875                 hasGrid: false,
    5876                 highlightFillColor: validateColor,
    5877                 highlightFillOpacity: Type.isNumber,
    5878                 highlightStrokeColor: validateColor,
    5879                 highlightStrokeOpacity: Type.isNumber,
    5880                 insertTicks: false,
    5881                 //: validateScreenCoords,
    5882                 lastArrow: false,
    5883                 layer: validateNotNegativeInteger,
    5884                 majorHeight: validateInteger,
    5885                 minorHeight: validateInteger,
    5886                 minorTicks: validateNotNegative,
    5887                 minTicksDistance: validatePositiveInteger,
    5888                 numberPointsHigh: validatePositiveInteger,
    5889                 numberPointsLow: validatePositiveInteger,
    5890                 opacity: Type.isNumber,
    5891                 radius: Type.isNumber,
    5892                 RDPsmoothing: false,
    5893                 renderer: validateRenderer,
    5894                 right: validatePixel,
    5895                 showCopyright: false,
    5896                 showInfobox: false,
    5897                 showNavigation: false,
    5898                 size: validateNotNegative, //validateInteger,
    5899                 snapSizeX: validatePositive,
    5900                 snapSizeY: validatePositive,
    5901                 snapWidth: Type.isNumber,
    5902                 snapToGrid: false,
    5903                 snatchDistance: validateNotNegative,
    5904                 straightFirst: false,
    5905                 straightLast: false,
    5906                 stretch: false,
    5907                 strokeColor: validateColor,
    5908                 strokeOpacity: Type.isNumber,
    5909                 strokeWidth: validateNotNegative, //validateInteger,
    5910                 takeFirst: false,
    5911                 takeSizeFromFile: false,
    5912                 to10: false,
    5913                 toOrigin: false,
    5914                 translateTo10: false,
    5915                 translateToOrigin: false,
    5916                 useASCIIMathML: false,
    5917                 useDirection: false,
    5918                 useMathJax: false,
    5919                 withLabel: false,
    5920                 withTicks: false,
    5921                 zoom: false
    5922             };
    5923
    5924         // this seems like a redundant step but it makes sure that
    5925         // all properties in the validator object have lower case names
    5926         // and the validator object is easier to read.
    5927         for (i in validators) {
    5928             if (validators.hasOwnProperty(i)) {
    5929                 v[i.toLowerCase()] = validators[i];
    5930             }
    5931         }
    5932
    5933         return v;
    5934     }());
    5935
    5936     /**
    5937      * All point faces can be defined with more than one name, e.g. a cross faced point can be given
    5938      * by face equal to 'cross' or equal to 'x'. This method maps all possible values to fixed ones to
    5939      * simplify if- and switch-clauses regarding point faces. The translation table is as follows:
    5940      * <table>
    5941      * <tr><th>Input</th><th>Output</th></tr>
    5942      * <tr><td>cross, x</td><td>x</td></tr>
    5943      * <tr><td>circle, o</td><td>o</td></tr>
    5944      * <tr><td>square, []</td><td>[]</td></tr>
    5945      * <tr><td>plus, +</td><td>+</td></tr>
    5946      * <tr><td>diamond, <></td><td><></td></tr>
    5947      * <tr><td>triangleup, a, ^</td><td>A</td></tr>
    5948      * <tr><td>triangledown, v</td><td>v</td></tr>
    5949      * <tr><td>triangleleft, <</td><td><</td></tr>
    5950      * <tr><td>triangleright, ></td><td>></td></tr>
    5951      * </table>
    5952      * @param {String} s A string which should determine a valid point face.
    5953      * @returns {String} Returns a normalized string or undefined if the given string is not a valid
    5954      * point face.
    5955      */
    5956     JXG.normalizePointFace = function (s) {
    5957         var map = {
    5958             cross: 'x',
    5959             x: 'x',
    5960             circle: 'o',
    5961             o: 'o',
    5962             square: '[]',
    5963             '[]': '[]',
    5964             plus: '+',
    5965             '+': '+',
    5966             diamond: '<>',
    5967             '<>': '<>',
    5968             triangleup: '^',
    5969             a: '^',
    5970             '^': '^',
    5971             triangledown: 'v',
    5972             v: 'v',
    5973             triangleleft: '<',
    5974             '<': '<',
    5975             triangleright: '>',
    5976             '>': '>'
    5977         };
    5978
    5979         return map[s];
    5980     };
    5981
    5982
    5983     /**
    5984      * Apply the options stored in this object to all objects on the given board.
    5985      * @param {JXG.Board} board The board to which objects the options will be applied.
    5986      */
    5987     JXG.useStandardOptions = function (board) {
    5988         var el, t, p, copyProps,
    5989             o = JXG.Options,
    5990             boardHadGrid = board.hasGrid;
    5991
    5992         board.options.grid.hasGrid = o.grid.hasGrid;
    5993         board.options.grid.gridX = o.grid.gridX;
    5994         board.options.grid.gridY = o.grid.gridY;
    5995         board.options.grid.gridColor = o.grid.gridColor;
    5996         board.options.grid.gridOpacity = o.grid.gridOpacity;
    5997         board.options.grid.gridDash = o.grid.gridDash;
    5998         board.options.grid.snapToGrid = o.grid.snapToGrid;
    5999         board.options.grid.snapSizeX = o.grid.SnapSizeX;
    6000         board.options.grid.snapSizeY = o.grid.SnapSizeY;
    6001         board.takeSizeFromFile = o.takeSizeFromFile;
    6002
    6003         copyProps = function (p, o) {
    6004             p.visProp.fillcolor = o.fillColor;
    6005             p.visProp.highlightfillcolor = o.highlightFillColor;
    6006             p.visProp.strokecolor = o.strokeColor;
    6007             p.visProp.highlightstrokecolor = o.highlightStrokeColor;
    6008         };
    6009
    6010         for (el in board.objects) {
    6011             if (board.objects.hasOwnProperty(el)) {
    6012                 p = board.objects[el];
    6013                 if (p.elementClass === Const.OBJECT_CLASS_POINT) {
    6014                     copyProps(p, o.point);
    6015                 } else if (p.elementClass === Const.OBJECT_CLASS_LINE) {
    6016                     copyProps(p, o.line);
    6017
    6018                     for (t = 0; t < p.ticks.length; t++) {
    6019                         p.ticks[t].majorTicks = o.line.ticks.majorTicks;
    6020                         p.ticks[t].minTicksDistance = o.line.ticks.minTicksDistance;
    6021                         p.ticks[t].visProp.minorheight = o.line.ticks.minorHeight;
    6022                         p.ticks[t].visProp.majorheight = o.line.ticks.majorHeight;
    6023                     }
    6024                 } else if (p.elementClass === Const.OBJECT_CLASS_CIRCLE) {
    6025                     copyProps(p, o.circle);
    6026                 } else if (p.type === Const.OBJECT_TYPE_ANGLE) {
    6027                     copyProps(p, o.angle);
    6028                 } else if (p.type === Const.OBJECT_TYPE_ARC) {
    6029                     copyProps(p, o.arc);
    6030                 } else if (p.type === Const.OBJECT_TYPE_POLYGON) {
    6031                     copyProps(p, o.polygon);
    6032                 } else if (p.type === Const.OBJECT_TYPE_CONIC) {
    6033                     copyProps(p, o.conic);
    6034                 } else if (p.type === Const.OBJECT_TYPE_CURVE) {
    6035                     copyProps(p, o.curve);
    6036                 } else if (p.type === Const.OBJECT_TYPE_SECTOR) {
    6037                     p.arc.visProp.fillcolor = o.sector.fillColor;
    6038                     p.arc.visProp.highlightfillcolor = o.sector.highlightFillColor;
    6039                     p.arc.visProp.fillopacity = o.sector.fillOpacity;
    6040                     p.arc.visProp.highlightfillopacity = o.sector.highlightFillOpacity;
    6041                 }
    6042             }
    6043         }
    6044
    6045         board.fullUpdate();
    6046         if (boardHadGrid && !board.hasGrid) {
    6047             board.removeGrids(board);
    6048         } else if (!boardHadGrid && board.hasGrid) {
    6049             board.create('grid', []);
    6050         }
    6051     };
    6052
    6053     /**
    6054      * Converts all color values to greyscale and calls useStandardOption to put them onto the board.
    6055      * @param {JXG.Board} board The board to which objects the options will be applied.
    6056      * @see #useStandardOptions
    6057      */
    6058     JXG.useBlackWhiteOptions = function (board) {
    6059         var o = JXG.Options;
    6060         o.point.fillColor = Color.rgb2bw(o.point.fillColor);
    6061         o.point.highlightFillColor = Color.rgb2bw(o.point.highlightFillColor);
    6062         o.point.strokeColor = Color.rgb2bw(o.point.strokeColor);
    6063         o.point.highlightStrokeColor = Color.rgb2bw(o.point.highlightStrokeColor);
    6064
    6065         o.line.fillColor = Color.rgb2bw(o.line.fillColor);
    6066         o.line.highlightFillColor = Color.rgb2bw(o.line.highlightFillColor);
    6067         o.line.strokeColor = Color.rgb2bw(o.line.strokeColor);
    6068         o.line.highlightStrokeColor = Color.rgb2bw(o.line.highlightStrokeColor);
    6069
    6070         o.circle.fillColor = Color.rgb2bw(o.circle.fillColor);
    6071         o.circle.highlightFillColor = Color.rgb2bw(o.circle.highlightFillColor);
    6072         o.circle.strokeColor = Color.rgb2bw(o.circle.strokeColor);
    6073         o.circle.highlightStrokeColor = Color.rgb2bw(o.circle.highlightStrokeColor);
    6074
    6075         o.arc.fillColor = Color.rgb2bw(o.arc.fillColor);
    6076         o.arc.highlightFillColor = Color.rgb2bw(o.arc.highlightFillColor);
    6077         o.arc.strokeColor = Color.rgb2bw(o.arc.strokeColor);
    6078         o.arc.highlightStrokeColor = Color.rgb2bw(o.arc.highlightStrokeColor);
    6079
    6080         o.polygon.fillColor = Color.rgb2bw(o.polygon.fillColor);
    6081         o.polygon.highlightFillColor  = Color.rgb2bw(o.polygon.highlightFillColor);
    6082
    6083         o.sector.fillColor = Color.rgb2bw(o.sector.fillColor);
    6084         o.sector.highlightFillColor  = Color.rgb2bw(o.sector.highlightFillColor);
    6085
    6086         o.curve.strokeColor = Color.rgb2bw(o.curve.strokeColor);
    6087         o.grid.gridColor = Color.rgb2bw(o.grid.gridColor);
    6088
    6089         JXG.useStandardOptions(board);
    6090     };
    6091
    6092     // needs to be exported
    6093     JXG.Options.normalizePointFace = JXG.normalizePointFace;
    6094
    6095     return JXG.Options;
    6096 });
    6097