JSXGraph различает два типа текстов: display:'html'
и display:'internal'
.Текстовый элемент первого типа использует тег HTML и всегда строго «выше» любой конструкции JSXGraph (и, следовательно, игнорирует структуру слоя).Последний тип текстового элемента подчиняется структуре слоя.По умолчанию display:'html'
.Вот пример (https://jsfiddle.net/8xms49pu/2/):
var circ = board.create('circle', [[0, 0], 3],
{fillColor: 'yellow', fillOpacity: 0.8});
var txt1 = board.create('text', [1, 1, 'HTML'], {layer: 1});
var txt1 = board.create('text', [-3.2, -1, 'internal'],
{layer: 1, display: 'internal'});
Изображения могут быть помещены в слои. Это означает, что нужно также использовать display:'internal'
. Вот пример (https://jsfiddle.net/jdw7z1nq/1/):
var im = board.create('image', ['https://jsxgraph.org/wp/img/logo_tw.png', [-3, -3], [6, 6]],
{layer: 10});
var circ = board.create('circle', [[0,0], 3],
{fillColor: 'yellow', layer: 6});
var txt = board.create('text', [1, 1, 'Hello'],
{layer: 5, display: 'internal'});
Преимущество HTML-текстов состоит в том, что они могут содержать любой вид HTML-контента, например, MathJax или теги форм или изображения ... Итак, вы также можете рассмотреть возможность помещения изображения в текстовый элемент.