Search code examples
javascriptgraphingjsxgraph

JSXGraph: How to label polygon borders?


Does anyone know how to place labels on arbitrary borders of a polygon, when using JSXGraph?

I'm looking to implement something like this:

Polygon with Labels

And I am creating a polygon like so (The script is interpreted via board.jc.parse):

A = point(-5,-5) << withLabel:false, visible:false>>;
B = point(-5,5) << withLabel:false, visible:false>>;
C = point(5,5) << withLabel:false, visible:false>>;
D = point(5, -5) << withLabel:false, visible:false>>;
polygon(A,B,C,D);

I'm thinking I can do something like this (put a label on the point and then move it over by a few pixels), but... blehk, that it ugly. I'd like to attach the label to the side of the polygon or the lines themselves.

// Don't want to do it this way
text(A.X(), A.Y(), 'label')  << id: 'TT1' >>;

Solution

  • In JessieCode / JSXGraph labels for borders of a polygon can be set with the attribute sub-object 'borders':

    A = point(-5, -5) << withLabel:false, visible:false>>;
    B = point(-5, 5) << withLabel:false, visible:false>>;
    C = point(5, 5) << withLabel:false, visible:false>>;
    D = point(5, -5) << withLabel:false, visible:false>>;
    
    polygon(A,B,C,D) << 
        borders: <<
            names: ['a', 'b', 'c', 'd'],
            withLabel: true
        >>
    >>;