Class pv.Image
Extends
pv.Bar.
Represents an image, either a static resource or a dynamically-
generated pixel buffer. Images share the same layout and style properties as
bars. The external image resource is specified via the #url
property. The optional fill, if specified, appears beneath the image, while
the optional stroke appears above the image.
Dynamic images such as heatmaps are supported using the #image psuedo-property. This function is passed the x and y index, in addition to the current data stack. The return value is a pv.Color, or null for transparent. A string can also be returned, which will be parsed into a color; however, it is typically much faster to return an object with r, g, b and a attributes, to avoid the cost of parsing and object instantiation.
See pv.Bar for details on positioning properties.
Defined in: Image.js.
Constructor Attributes | Constructor Name and Description |
---|---|
pv.Image()
Constructs a new image with default properties.
|
Field Attributes | Field Name and Description |
---|---|
Default properties for images.
|
|
The height of the image in pixels.
|
|
The width of the image in pixels.
|
|
The URL of the image to display.
|
- Fields borrowed from class pv.Bar:
- fillStyle, height, lineWidth, strokeStyle, width
- Fields borrowed from class pv.Mark:
- bottom, childIndex, cursor, data, events, index, left, parent, proto, reverse, right, root, scale, title, top, type, visible
Method Attributes | Method Name and Description |
---|---|
image(f)
Specifies the dynamic image function.
|
- Methods borrowed from class pv.Mark:
- add, anchor, anchorTarget, def, event, extend, margin, mouse, render
For example, given a two-dimensional array heatmap, containing numbers in the range [0, 1] in row-major order, a simple monochrome heatmap image can be specified as:
vis.add(pv.Image) .imageWidth(heatmap[0].length) .imageHeight(heatmap.length) .image(pv.ramp("white", "black").by(function(x, y) heatmap[y][x]));For fastest performance, use an ordinal scale which caches the fixed color palette, or return an object literal with r, g, b and a attributes. A pv.Color or string can also be returned, though this typically results in slower performance.
- Parameters:
- {function} f
- the new sizing function.
- Returns:
- {pv.Layout.Pack} this.