如何启用双击以在GeoGebra上显示重新定义对话框

Question

hello stackOverflow社区

我需要在双击并配置自定义选项时显示重新定义对话框。

问题是，当我不放置自定义选项时，双击它会成功显示重新定义对话框，但是我需要显示具有自定义选项的Geogebra。

Escenario working without custom options

HTML

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

JavaScript

var width = window.innerWidth;
var height = window.innerHeight;
var ggbApp = new GGBApplet({
  "id": "ggbGraph",
  "appName": "graphing",
  "width": width,
  "height": height,
  "showToolBar": true,
  "showAlgebraInput": true,
  "showMenuBar": true,
  "appletOnLoad": afterLoad,
}, true);
window.addEventListener("load", function () {
  ggbApp.inject('ggb-element');
});

function afterLoad() {

  let app = window['ggbGraph'];

  let points = [{
    x: 0,
    y: 0
  }, {
    x: 1,
    y: 1
  }, {
    x: 2,
    y: 4
  }, {
    x: 4,
    y: 16
  }];

  points.forEach(function(p){
    app.evalCommandGetLabels(`(${p.x},${p.y})`)[0];
  });

};

Escenario working with custom options

HTML

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

JavaScript

var width = window.innerWidth;
var height = window.innerHeight;
var ggbApp = new GGBApplet({
  "id": "ggbGraph",
  "perspective": "G",
  "width": width,
  "height": height,
  "showToolBar": false,
  "customToolBar": " ",
  "showAlgebraInput": false,
  "language": "en",
  "showResetIcon": false,
  "showLogging": false,
  "showMenuBar": false,
  "enableRightClick": false,
  "preventFocus": false,
  "errorDialogsActive": false,
  "showToolBarHelp": false,
  "enableLabelDrags": false,
  "useBrowserForJS": true,
  "appletOnLoad": afterLoad,
}, true);
window.addEventListener("load", function () {
  ggbApp.inject('ggb-element');
});

function afterLoad() {

  let app = window['ggbGraph'];

  let points = [{
    x: 0,
    y: 0
  }, {
    x: 1,
    y: 1
  }, {
    x: 2,
    y: 4
  }, {
    x: 4,
    y: 16
  }];

  points.forEach(function(p){
    app.evalCommandGetLabels(`(${p.x},${p.y})`)[0];
  });

};

答案

要在双击时显示重新定义对话框并具有自定义选项，有必要添加showMenuBar: false选项并通过javascript删除不必要的按钮。

Working demo

HTML

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

JavaScript

var width = window.innerWidth;
var height = window.innerHeight;

var parameters = {
  "id": "ggbGraph",
  "perspective": "G",
  "width": width,
  "height": height,
  "showToolBar": true,
  "customToolBar": " 0 1 ",
  "borderColor": null,
  "showMenuBar": true,
  "allowStyleBar": false,
  "showAlgebraInput": true,
  "enableLabelDrags": true,
  "enableShiftDragZoom": true,
  "capturingThreshold": null,
  "showToolBarHelp": false,
  "errorDialogsActive": true,
  "showTutorialLink": false,
  "showLogging": false,
  "useBrowserForJS": true,
  "appletOnLoad": afterLoad,
};

var ggbApp = new GGBApplet(parameters, true);

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

function afterLoad() {

  let app = window['ggbGraph'];

  removeMenuButtons();
  preparePropertiesView();

  app.setGridVisible(true);
  app.enableShiftDragZoom(true);

  let points = [{
    x: 0,
    y: 0
  }, {
    x: 1,
    y: 1
  }, {
    x: 2,
    y: 4
  }, {
    x: 4,
    y: 16
  }];

  points.forEach(function(p){
    app.evalCommandGetLabels(`(${p.x},${p.y})`)[0];
  });

};

function removeMenuButtons(){
  $('#ggb-element').find('.toolbarPanel').find('.rightButtonPanel').find('.button[tabindex="-1"]').remove();
  $('#ggb-element').find('.gwt-SplitLayoutPanel').find('.TitleBarPanel').remove();
}

function preparePropertiesView(){
  $('#ggb-element').find('.gwt-SplitLayoutPanel').find('.ggbdockpanelhack').find('.PropertiesViewW').find('.contentsPanel').css('width', '300px');
}