JavaScript must be enabled in order for you to use JSXGraph and JSXGraph reference. However, it seems JavaScript is either disabled or not supported by your browser.

Class Index | File Index
Elements
Classes

Class JXG.Image

JXG.GeometryElement,JXG.CoordsElement
      ↳ JXG.Image

Creates a new image object. Do not use this constructor to create a image. Use JXG.Board#create with type Image instead.

Defined in: image.js.
Extends JXG.CoordsElement, JXG.GeometryElement.

Class Summary
Constructor Attributes Constructor Name and Description
 
JXG.Image(board, coordinates, attributes, url, size)
Construct and handle images The image can be supplied as an URL or an base64 encoded inline image like "data:image/png;base64, /9j/4AAQSkZJRgA.
Fields borrowed from class JXG.GeometryElement:
_org_type, _pos, ancestors, baseElement, board, childElements, dash, dashScale, descendants, draft, dragToTopOfLayer, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, inherits, isDraggable, isLabel, isReal, lastDragTime, layer, lineCap, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, nonnegativeOnly, notExistingParents, numTraces, parents, precision, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, viewport, visible, visProp, visPropCalc, withLabel
Fields borrowed from class JXG.CoordsElement:
coords, groups, isConstrained, needsUpdateFromParent, onPolygon, position, slideObject, slideObjects
Field Summary
Field Attributes Field Name and Description
 
size
Array of length two containing [width, height] of the image in pixel.
 
url
'href' of the image.
Fields borrowed from class JXG.GeometryElement:
_org_type, _pos, ancestors, baseElement, board, childElements, dash, dashScale, descendants, draft, dragToTopOfLayer, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, inherits, isDraggable, isLabel, isReal, lastDragTime, layer, lineCap, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, nonnegativeOnly, notExistingParents, numTraces, parents, precision, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, viewport, visible, visProp, visPropCalc, withLabel
Fields borrowed from class JXG.CoordsElement:
coords, groups, isConstrained, needsUpdateFromParent, onPolygon, position, slideObject, slideObjects
Method Summary
Method Attributes Method Name and Description
 
H()
Returns the height of the image in user coordinates.
 
hasPoint(x, y)
Checks whether (x,y) is over or near the image;
 
setSize(width, height)
Set the width and height of the image.
<private>  
update(fromParent)
Recalculate the coordinates of lower left corner and the width and height.
<private>  
updateRenderer()
Send an update request to the renderer.
<private>  
updateSize()
Updates the internal arrays containing size of the image.
<private>  
updateSpan()
Update the anchor point of the image, i.e.
 
W()
Returns the width of the image in user coordinates.
Methods borrowed from class JXG.GeometryElement:
_set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hide, hideElement, noHighlight, normalize, prepareUpdate, remove, removeAllTicks, removeChild, removeDescendants, removeTicks, resolveShortcuts, setArrow, setAttribute, setDash, setDisplayRendNode, setLabel, setLabelText, setName, setParents, setPosition, setPositionDirectly, setProperty, show, showElement, snapToPoints, updateVisibility, useLocale
Methods borrowed from class JXG.CoordsElement:
_anim, addAnchor, addConstraint, Coords, Dist, findClosestSnapValue, free, handleAttractors, handleSnapToPoints, makeGlider, moveAlong, moveTo, popSlideObject, setGliderPosition, setPositionByTransform, updateConstraint, updateCoords, updateGlider, updateGliderFromParent, updateTransform, visit, X, XEval, Y, YEval, Z, ZEval
Events borrowed from class JXG.GeometryElement:
attribute, attribute:key, down, drag, keydrag, mousedown, mousedrag, mousemove, mouseout, mouseover, mouseup, move, out, over, pendown, pendrag, penup, touchdown, touchdrag, touchup, up
Class Detail
JXG.Image(board, coordinates, attributes, url, size)
Construct and handle images The image can be supplied as an URL or an base64 encoded inline image like "data:image/png;base64, /9j/4AAQSkZJRgA..." or a function returning an URL: function(){ return 'xxx.png; }.
Parameters:
{string|JXG.Board} board
The board the new image is drawn on.


{Array} coordinates
An array with the user coordinates of the image.


{Object} attributes
An object containing visual and - optionally - a name and an id.


{string|function} url
An URL string or a function returning an URL string.


{Array} size
Array containing width and height of the image in user coordinates.


Field Detail
{array} size
Array of length two containing [width, height] of the image in pixel.
{string} url
'href' of the image. This might be an URL, but also a data-uri is allowed.
Method Detail
{number} H()
Returns the height of the image in user coordinates.
Returns:
{number} height of the image in user coordinates
{Boolean} hasPoint(x, y)
Checks whether (x,y) is over or near the image;
Parameters:
{Number} x
Coordinate in x direction, screen coordinates.
{Number} y
Coordinate in y direction, screen coordinates.
Returns:
{Boolean} True if (x,y) is over the image, False otherwise.
{JXG.GeometryElement} setSize(width, height)
Set the width and height of the image. After setting a new size, board.update() or image.fullUpdate() has to be called to make the change visible.
Parameters:
{number|function|string} width
Number, function or string that determines the new width of the image
{number|function|string} height
Number, function or string that determines the new height of the image
Returns:
{JXG.GeometryElement} A reference to the element
Examples:
var im = board.create('image', ['https://jsxgraph.org/distrib/images/uccellino.jpg',
                               [-3,-2], [3,3]]);
im.setSize(4, 4);
board.update();



					
					
var p0 = board.create('point', [-3, -2]),
    im = board.create('image', ['https://jsxgraph.org/distrib/images/uccellino.jpg',
                    [function(){ return p0.X(); }, function(){ return p0.Y(); }],
                    [3,3]]),
    p1 = board.create('point', [1, 2]);

im.setSize(function(){ return p1.X() - p0.X(); }, function(){ return p1.Y() - p0.Y(); });
board.update();





					
					

					

					

				
					 
					
<private> 

					{JXG.GeometryElement}
					update(fromParent)

					

					

						Recalculate the coordinates of lower left corner and the width and height.
						
						
					


						
							

							
Parameters:

							
								

									fromParent
									
								

								

							
							

						
						
						
						
						
							

							
Returns:

							
								
{JXG.GeometryElement} A reference to the element

							
							

						
						
						

					

					

				
					 
					
<private> 

					
					updateRenderer()

					

					

						Send an update request to the renderer.
						
						
					


						
						
						
						
						
						
						

					

					

				
					 
					
<private> 

					{JXG.GeometryElement}
					updateSize()

					

					

						Updates the internal arrays containing size of the image.
						
						
					


						
						
						
						
						
							

							
Returns:

							
								
{JXG.GeometryElement} A reference to the element

							
							

						
						
						

					

					

				
					 
					
<private> 

					{JXG.GeometryElement}
					updateSpan()

					

					

						Update the anchor point of the image, i.e. the lower left corner
and the two vectors which span the rectangle.
						
						
					


						
						
						
						
						
							

							
Returns:

							
								
{JXG.GeometryElement} A reference to the element

							
							

						
						
						

					

					

				
					 
					


					{number}
					W()

					

					

						Returns the width of the image in user coordinates.
						
						
					


						
						
						
						
						
							

							
Returns:

							
								
{number} width of the image in user coordinates

							
							

						
						
						

					

					
				
			


			

			


			

		




		

			
			Documentation generated by JsDoc Toolkit 2.4.0 on Wed Oct 23 2024 15:44:13 GMT+0200 (Mitteleuropäische Sommerzeit)