¿Como puedo agregar nombre a un grupo de herramientas?

Raul Martin Anaya Rojo shared this question 1 month ago
Answered

Hola, buenas tardes


Estoy trabajando con geogebra web. Necesito especificar que herramientas quiero utilizar, esto se soluciona usando customToolBar, pero cuando la utilizo las etiquetas se ocultan.


¿Como puedo agregar nombre a un grupo de herramientas?


El código que estoy utilizando es el siguiente:

var parameters = {
    "id": "ggbApplet",
    "appName": "graphing",
    "customToolBar": "0 39 | 1 501 67 , 5 19 , 72 | 2 15 45 , 18 65 , 7 37 | 4 3 8 9 , 13 44 , 58 , 47 | 16 51 64 , 70 | 10 34 53 11 , 24  20 22 , 21 23 | 55 56 57 , 12",
    "width": window.innerWidth,
    "height": window.innerHeight,
    "showToolBar": true,
    "showAlgebraInput": true,
    "showMenuBar": false,
    "showToolBarHelp": true,
    "showZoomButtons": true,
    "allowStyleBar": true,
    "showFullscreenButton": true,
    "language":"es"
};

var ggbApp = new GGBApplet(parameters, true);

window.addEventListener("load", function() { 
    ggbApp.inject('ggb-element');
});


Gracias de antemano

Saludos

Comments (3)

photo
1

Sorry, that's not possible to customise

photo
1

no es la solucion buena pero puedes crear harramientas falsas, es decir, que no sirvan para nada y les pones un icono con el texto que quieras y un color de fondo llamativo y las colocas al principio de cada grupo para que sirvan de marca de comienzo de grupo

photo
1

Lo pude resolver agregando el nombre del grupo de herramientas desde el callback:


var element = 'ggb-element';


var callback = function(ggb) {

    const ggbElement = $(`#${element}`);
    const article = ggbElement.find('article');
    const headers = article.attr('data-param-customToolbarHeaders').split('|');
    const toolsPanel = article.find('.toolsPanel.customToolbar');
    const categoryPanels = toolsPanel.find('div:has(.categoryPanel)');

    categoryPanels.each(function (index, item) {
        const element = $(item);
        element.find('.catLabel').remove();
        element.prepend($(`<div class="catLabel" aria-hidden="true">${headers[index]}</div>`));
    });
}

var parameters = {
    "id": "ggbApplet",
    "appName": "graphing",
    "customToolbarHeaders": "Nombre para Herramientas básicas | Nombre para Edición | Nombre para Medios | Nombre para Medición | Nombre para Puntos | Nombre para Construcción | Nombre para Rectas | Nombre para Polígonos | Nombre para Circunferencias | Nombre para Cónicas | Nombre para Transformación | Nombre para Otros",
    "customToolbar": "0 1 25 , 575 76 , 58| 77 40 6 , 2827 35 | 26 17 | 36 38 49 , 4650 | 1 5 501 , 6775 76 , 7271 | 19 4 8 , 39 13 , 47| 15 2 18 , 745 37 , 4465 | 16 51 70 , 64| 10 53 24 , 3411 20 , 2221 23 | 55 12 57 , 56| 30 29 32 , 3133 54 | 62 73 14 , 6052 61 ",
    "width": window.innerWidth,
    "height": window.innerHeight,
    "showToolBar": true,
    "showAlgebraInput": true,
    "showMenuBar": false,
    "showToolBarHelp": true,
    "showZoomButtons": true,
    "allowStyleBar": true,
    "showFullscreenButton": true,
    "appletOnLoad": callback,
    "language":"es"
};

var ggbApp = new GGBApplet(parameters, true);

window.addEventListener("load", function() { 
    ggbApp.inject(element);
});

© 2019 International GeoGebra Institute