News • Examples • Documentation • Download • Buy • Forum • Contact

Release Notes Version 1.22

krpano 1.22.2 (2024-11-20)

  • New: The textfield template supports now also linking to events (and using an expression for the resulting content)
  • New: The ThreeJS Sun Light supports now an optional custom center position for the shadowmap (atview=false). Additionally there is new shadowmaphelper setting to visualize also the position and range of the shadowmap. And the Sun Light helper is now dragable.
  • New: Updated ThreeJS: Tesla Example - VR support, changeable pano-environments, editable materials (adjustable car colors, interior, rims).
  • Fix: Static defined linking to attributes of the same element was not working (report).
  • Fix: Adding a value to an existing krpano array-item, that has the the index 0, wrongly created an new auto-named array-item (report).
  • Fix: Cubemap panos with objectsize=0 weren't displayed.
  • Fix: Panos with a 3D-model as depthmap and rendermode="depthmap" had a wrong origin.
  • Fix: screen-based raycasts were not working correctly with external renderers (e.g. ThreeJS) when no hotspot had the hittest setting enabled (report).
  • Fix: The <if> xml element didn't work inside non-root-level-elements.
  • Fix: Depthmap hittestmode="gpu" was not working.
  • Fix: Using depthmap-hittesting and hotspot-hittesting the same time was not working.
  • Fix: drag3d.xml - support 3D dragging also when using view offsets.
  • Fix: Enable the VR position tracking also in the ThreeJS Environment Maps, Tuscany and Open Source Plugin examples (report).
  • Fix: Spherical images for the ThreeJS environment texture were using the wrong color-space (causing washed-out colors).
  • Fix: The leveling tool in the krpano Tools app was not working (report).
  • Fix: <a href="..."> links inside textfields were not working with touch controls.
  • Fix: Some typos and missing links in the documentation.

krpano 1.22.1 (2024-11-14)

  • Fix: WebGL 3D-polyline hotspots had a wrong position offset. This was only visible at high-zooms, e.g. in flat-panos (report).
  • Fix: The WebGL non-borderzoom 3D-polyline hit-testing was inaccurate at high-zooms.
  • Fix: Custom encryption keys didn't work if the key ID contained a 'z' character (report).
  • Fix: Registering the license code did not work if the code had two '=' characters at the end and a line-break or white-space in between them.
  • Fix: Editable textfields (with editenterkey=stop or shiftnewline) didn't lose the input-focus on iOS when the Enter-key was pressed (report).
  • Fix: Improved String handling in expressions. String operations in expressions could cause that sub-expressions didn't work as expected (report).
  • Fix: Depending on the actual loading timing, there could be false events (onxmlcomplete, onnewscene) when another pano/scene get loaded while exactly these events are being processed. And this could have several strange/unexpected effects (report).
  • Fix: Layers with safearea=false and a safearea display, got wrong positions when using changealign() or tweening between relative (percent or negative values) and absolute sizes.
  • Fix: Improve compatibility by calling the lookto() ondone callback also when the nonblocking setting is not explicitly set to true. Now the lookto is automatically nonblocking when ondone is set and the nonblocking setting not explicitly set to false (report).
  • Fix: Improve compatibility - when a layer is defined within another layer, its parent setting will be ignored now (report).
  • Fix: The depthmap.origin position was wrong when depthmap.scale was used (report).
  • New: ThreeJS: Tesla Example

krpano 1.22 (2024-10-30)


embedpano()

  • New: sameorigin - A new security feature as cross-site-scripting (XSS) protection. When enabled (the new default), text-based files can be only loaded from the same server.
  • New: iosfullscreen - Enable or disable the iOS HTML5 Fullscreen API support.
  • New: cors - Enable the sending of CORS HTTP headers when loading files from external servers (same as the security.cors setting, but to set already on startup).
  • New: The Embedding Parameters Object is now available at runtime as embeddingparameters variable.
  • New: The removepano() function can now be called also with the embedding-target HTML element.
  • Change: The default for the xml setting is null instead of "krpano.xml" now.
  • Change: The onerror callback has been removed. Since there is no Flash support anymore, this was only used for 'local-file-access-errors'. Now these are normal errors.
  • Change: Using passQueryParameters=true is deprecated now due security implications and will show a console warning message.
  • Change: When a startup xml file is set, then onready will be called when all startup xml files are loaded. This avoids conflicts with initial xml load requests.

Browser / Device Support

  • New: WebGL2 will be used by default now (when available).
  • New: device.istouchevent for checking if the current user interaction is made by touch or mouse. Can be useful on systems that support mouse and touch usage the same time.
  • New: Improved support for device simulators (Chrome/Edge/Firefox developer tools).
  • New: Improved input focus/blur detection.
  • New: Add an 'id' property in the gesture.touches Array to enable the tracking of individual touch points.
  • Fix: Workaround for a Chrome touch bug: HTML form elements inside HTML elements that handle touch events (like layers) could not be controlled by touch.
  • Fix: Workaround for a Chrome bug: when releasing the mouse-button over an iframe, then this mouse-button release is not detected (Chrome blocks the related event). In such case krpano will now use the next normal mouse event over the viewer to manually trigger an onup mouse-button release event.
  • Fix: When using the hotspot alphachannel=TB/SBS setting, there is was a (wrong) Javascript error in Chrome 128 (report). Already fixed in newer Chrome versions.
  • Fix: Detect the Apple Vision Safari Browser as iPad/Desktop instead as iPhone.
  • Fix: Release the currently pressed keyboard keys (trigger onkeyup events) when losing the input-focus.
  • Fix: Improved Workaround for the Apple GPU 16bit-Depthbuffer bug. When rendering to a 16bit Depthbuffer, some Apple devices have a strange bug that causes the depthbuffer values to be cut off or clamped. The Apple Vision Simulator WebXR rendering internally also seems to use a 16bit Depthbuffer and so also needs this workaround.
  • Fix: Workaround for an iOS 17 window resize bug (report).

krpano API - Actions and XML


Javascript API


Reactive Programming / Reactive Designing APIs


Built-in Language / Translation system


Tween Animations

  • New: Improved tween() action.
  • New: The tween() action is internally now fully Object-based. That means it uses Object-references instead of String paths. This is clearer and faster.
  • New: There is a new Object API for changing multiple variables from one object at once: 
    tween(object, var1=val, var2=val, var3=val)
    The parameters like time and tweentype are set like variable in this case: 
    tween(object, var=val, time=0.5, type=smooth, ondone=trace(done))
    And it is possible to access the Object itself in expressions using the this keyword: 
    tween(hotspot[test], ath=(this.ath+360))
  • New: For Javascript usage it's now also possible to use Objects. The first argument is the Object that should be changed, and the second argument an Object with properties that should be changed: 
    krpano.tween(hs, {ath:0, atv:0}, 1.0, "smooth");
  • New: Relative sizes support (percent-sizes and negative width/height values): When tweening a 'size-based' variable from a layer or hotspot (e.g. width, height, or x, y, ox, oy), then automatically convert between the relative and the absolute size depending on the target value.
  • New: Multi-value support: Some variables (e.g. like image.prealign or layer.bgborder) can contain multiple values separated by a | or a , or a space character. The detection and format of such variables is based on the target value.
  • New: stoptween() - Also with Object support.
  • New: stoptween() - Support * as wildcard to stop all Object assigned tween animations.
  • New: There are new tween-types: smooth, smoother, step and power. The step and power tween-types have additional arguments. The new power tween-type is very similar to easeoutquad, but with a slightly smoother starting.
  • New: All easeinout* tween-types have now an optional argument to control the ratio of the in- to the out-function (0.0 to 1.0, 0.5 by default).
  • Change: The easeoutin* tween-types have been removed, they were basically useless.
  • Fix: The easeinoutexpo function was using a wrong curve.
  • Fix: Tween animations that were started during processing other tweens could have an invalid value for a very short time at the startup.

Developer APIs / Debug Tools

  • New: debugkeeplog (enabled by default) - Keep the current krpano log-input history and the current log-position, even when reloading the Browser. The input-history is stored in the Browsers localStorage memory for the current domain/origin.
  • New: Inside the debugmode log-input field, there are new special commands to clear the log and to clear the input-history.
  • New: debug(var) expression-function for checking values in more complex expression - it logs the value and pass-through it.
  • New: Improved loading error handling/reporting - show additional information when the loading fails (plus extra infos when trying to load local files).
  • New: When there are multiple 'fatal errors', merge the messages into one error-box instead of showing multiple overlapping error-boxes.
  • Change: The debugkeys were changed to avoid an interference with the WASD-keys ('S' ⇒ 'T' for toggling stereo, 'A' ⇒ 'R' for toggling autorotate).

Layers

  • New: Support CSS filters for layers: colorize, colormatrix, brightness, contrast, saturate, hue, invert, sepia and dropshadow. Note - these filters can be helpful for customizing UI elements, e.g. changing the color and/or adding shadows, but also comes with a performance-costs. A special note also the colorize and colormatrix filters, as they are normally not directly available in CSS.
  • New: cssstyle - Directly set/add CSS styles to the element.
  • New: The align and edge settings can now also use relative points.
  • New: Built-in onsingleclick and ondoubleclick events.
  • New: oncreate and ondestroy events.
  • New: onaddchild and onremovechild events - Get callbacks when children layers were added or removed.
  • New: stopeventflow - A setting for stopping the current event flow (e.g. to stop a click would be processed by a parent or children element).
  • New: getchildzorder() - Get the smallest or the largest zorder value from the children elements.
  • New: flowchildrenexpand - Expand all flowing children elements to the parent size (in the non-flowing direction). E.g. to give all vertical flowing elements the same width.
  • Change: The flowoverflow starts the next row now when the current row is at least 1px larger then the available space. Previously it also overflowed when the needed and available space had the same size.
  • Change: Rename layer._assignEvents() to layer.assignEvents() (old name still supported).
  • Fix: The stagex/stagey coordinates were wrong in some scale/stagescale combinations.
  • Fix: Percent sizes inside layers with scalechildren=false were wrong.
  • Fix: When a layer has a predefined width/height size (using width, height or crop), directly use that size when doing automatic 'flow' layouts instead of waiting until the layer is fully loaded.
  • Fix: Store and reuse the flowed x/y position, to avoid getting the wrong position in cases when no full reflow is done.

Textfields and HTML Layers - layer/hotspot.type="text" / layer/hotspot.type="html"

  • New: Use a template for automatic text generation. When variables that are used/linked in the template will change, then the text will be automatically regenerated.
  • New: trimwhitespace - Trim leading and trailing whitespace from all lines. This could be helpful on monospace texts to skip the xml indentations.
  • New: Improved textfield [a href="event:..."] touch handling - trigger the action after releasing the touch and only when not moved too far instead of triggering the action directly on the touch-down.
  • New: Support also the syntax [a href="krpano:..."] to call krpano action code.
  • New: Support [a href="js:.."] in textfield links for directly calling Javascript code (within the krpano context).
  • New: Support the [a href="event/krpano/js:..."] links also in HTML layers.
  • New: htmllinkcolor - Set the default link color for textfields and HTML layers.
  • New: css - Directly set CSS styles for HTML layers.
  • Fix: Keep the cursor position when changing/updating the textfield content during editing.
  • Fix: The Chrome Browser automatically modifies/escapes the content in links after the ? character, therefore automatically unescape it when using the special krpano links.
  • Fix: Use '#actionlink' instead of 'javascript:void(0)' in href action links (looks better in the Browsers status-bar when hovering a link).
  • Fix: Wrong textfield textalign position when combining parent-scaling and stagescale.

Scrollarea Layer - type="scrollarea"

  • Fix: Support parent-scaling and stagescale correctly.
  • Fix: When onhover_autoscrolling is enabled, dragging will be automatically disabled.
  • Fix: The centering wasn't working correctly on size changes.
  • Fix: scrolltocenter() didn't work with scrolltype smooth and step.

sub-krpano Layers - layer.type="krpano"


Hotspots

  • New: hittest - Allow using hotspots for raycasting / hit-testing / collision-check (optionally).
  • New: The hit object returned by raycast() actions, contains now also a new 'hs' property to check if a hotspot was hit.
  • New: The hotspot itself also contains a hit object with information about the last hittest or raycast (only when hittest is enabled).
  • New: The getnormalvec() function for getting the current normal vector of a 3D-distorted hotspots, supports now also polygonal hotspots.
  • New: isblending - Check if the hotspot is currently in the keep=false blending (and getting removed) phase.
  • New: Improved SVG-rendered polygonal hotspots: support viewing offsets, support 3D-polygons, improved prealign/torigin support.
  • New: Automatically renderer 2D/spherical-polygonal line-hotspots as 3D-polygon line-hotspots to allow them covering an larger area and not be limited to a 180 degree coverage anymore.
  • Fix: WebGL textfield hotspots - Avoid overlapping rounded edges when using too large bgroundedge values.
  • Fix: Avoid flickering when dynamically changing the url.

Contextmenu

  • New: customcssclasses - Use CSS classes for the contextmenu styling (example).
  • New: Support [a href="event/krpano/js:..."] links in the contextmenu item caption.
  • New: contextmenu.xml - The control-modes can be now be changed directly.

Panoramic Images

  • New: image.wraparound - Support flat multires images that 'wrap around' horizontally. The image will be automatically repeated and when panning horizontally around, the view.hlookat position and the hotspots will be automatically adjusted (example).
  • New: image.objectsize - Set the size of the internal 3D-Model of the pano-image. This could be used for customizing the 3D transitions or for 3D-enviroements. With a value of 0 or an invalid Number, the 3D-Model will be rendered infinity far away. This can be used for background panos in 3D-scenes that shouldn't move with the view.
  • New: Use Mipmapping also in the cubemap rendering mode.
  • New: The default cubemap resolution has been increased from 2048 to 4096. If the hardware doesn't support the size, it will be automatically limited to a lower value.
  • Fix: The preview-pano rendering of multi-res Cylinder panos was wrong.
  • Fix: Stereo Fisheye images/videos were not working.

Rendering / Loading / Display

  • New: krpano.webGL.addListener() / removeListener() - New APIs to add custom WebGL 3D rendering and custom 3D-hittesting (used by the ThreeJS plugin).
  • New: krpano.webGL.redirectBackbuffer() - A new API to ensure rendering into a given framebuffer. Can be used to integrate third-party WebGL software and ensure rendering to the correct framebuffers.
  • New: krpano.webGL.resetState() - Restores several WebGL states to ones that krpano assumes and needs.
  • New: hotspot.alphahittest - Use the actual alpha value of the hotspot image for hit-testing. This means, allow clicking through transparent areas.
  • New: display.hotspotvrzoom - Customize the appearance (scaling) of non-zooming and non-distorted hotspots in VR mode.
  • New: hotspot.premultiplied - Support hotspot images with a pre-multiplied alpha channel.
  • Change: The hotspot.premultiplyalpha setting (not to confuse with hotspot.premultiplied) has been removed. This was only used to apply the WebGL UNPACK_PREMULTIPLY_ALPHA setting, but this was and is not necessary for any case in the krpano rendering system.
  • Change: The way how the distorted view (fisheye/pannini) rendering works when using viewing offsets (that means when not viewing from the pano center) has been slightly changed. Previously each pano-type (e.g. cube or sphere) has a slightly different implementation to optimize the actual impression, but that caused problems with 'mixed content', e.g. when hotspots or 3D-models should be rendered the same time. Now the same projection/distortion/rendering methods are used for all cases.
  • Change: The way how the distorted view (fisheye/pannini) rendering works when using viewing offsets (that means when not viewing from the pano center) has been slightly changed. Previously each pano-type (e.g. cube or sphere) has a slightly different implementation to optimize the actual impression, but that caused problems with 'mixed content', e.g. when hotspots or 3D-models should be rendered the same time. Now the same projection/distortion/rendering methods are used for all cases.
  • Change: The default value for image.cubemapsize has been increased from 2048 to 4096 (but not for iOS).
  • Fix: set3dtransition() - Avoid that the 3D transition would move outside the cube/sphere.
  • Fix: Cubical pano images weren't rendered at infinity distance when using depthmap.background="pano".
  • Fix: The view.maxpixelzoom behavior was incorrect on low-resolution images in combination high-resolutions screens and wide side-aspects.
  • Fix: When blending from one pano with transparent background (e.g. a partial-pano or a 3D-model) to another one, there could be a short (1 frame) flicker (seeing the background color where it should be transparent).
  • Fix: When using a 3D-model with multires cube-images where the smallest multires-level is larger than image.cubemapsize plus some tolerance (device depended), then the 3D-model wasn't displayed (report).
  • Fix: Several depthmap rendering problems were fixed (caused by various combinations of modes and settings).
  • Fix: Do not unnecessarily redraw/rebuild the WebGL-hotspot-textfield image when only the hotspot scale changes (can be a big performance improvement when animating the hotspot scale).
  • Fix: The preview image from partial pano wasn't updated when changing the image hfov/vfov/voffset values.
  • Fix: WebGL polyline hotspots that cover a large area were sometimes displayed wrong.
  • Fix: Catch and report WebGL cross-origin texture errors.
  • Fix: The url-placeholders in depthmap.url were not parsed in all cases.
  • Fix: Size changes of the krpano viewer element were not always correctly detected when safe-area was used.
  • Fix: The polygonal hotspot <point> Array and the points/points3d String are better synchronized now. Changing one will automatically update the other one on the next get/read request. Additionally also ensure rendering updates in any editing/change-case.
  • Fix: The alpha-blending of WebGL hotspots worked wrong on iOS, if a video was loaded as hotspots before (report).
  • Fix: The position of non-zooming and non-distorted hotspots in VR mode was wrong. That non-scaling behavior itself was fixed and improved and is now optional (to be enabled by display.hotspotvrzoom).

krpano Tools

  • New: Support using Custom Encryption keys.
    • This allows sharing of encryption-keys and private-encrypted-files without the need to share the license or any license-information.
    • E.g. a plugin developer can offer an encrypted file together with the key, but the key will be stored hidden and protected inside the customers krpano viewer.
    • This avoids that some unauthorized could copy and use the encrypted file.
  • New: krpano Tools app - the 'Protect Tool' settings (including custom keys) can be automatically applied when creating new tours.
  • New: htmlviewerpath - a new config setting to set a custom path and filename for the krpano viewer output file.
  • New: xmltemplate - new xml placeholders: [TYPE], [WIDTH], [HEIGHT]
  • New: comparepanos.config - a new makepano template (config file) for automatically generating pano/image-comparisons.
  • New: krpano Testing Server - add the mime-type for WASM files (.wasm)
  • Fix: krpano Tools app - a slightly improved and fixed VTour Hotspot Editor.

WebVR Support (webvr.js & webvr.xml)

  • New: Support for the Apple Vision Pro:
    • Detect is as iPad/Desktop instead as iPhone (to avoid applying iPhone-specific workarounds).
    • device.applevision for checking / detecting.
    • device.mobilevr is true for Apple Vision Safari when the WebXR API is available.
    • webvr.xml - When the WebXR API is not enabled in the Apple Vision Pro, show an info page for how to enable it when trying to enter the VR mode.
    • Support WebXR mono-rendering (used by the Apple Vision Simulator).
  • New: webvr.xml - Show a link to send the current site to your Meta Quest VR headset.
  • New: Support WebXR browsers that run 'window frame loops' and 'WebXR frame loops' at the same time.
  • Change: Save and restore the view.ox/oy/oz values when entering and exiting VR mode.
  • Change: The default database url for unknown mobile devices had been changed.
  • Fix: webvr.xml - In the 'vr_auto_click' action use triggerevent() to call also added events.

ThreeJS Plugin (threejs_krpanoplugin.js)


krpano Maps Plugin (krpanomaps.xml)

  • New: A krpano-based Maps plugin that can use any map tiles.
  • New: It uses the 'Open Street Map' images by default.
  • New: It is compatible to the Googlemaps and Bingmaps plugins and can be used a direct replacement.
  • New: Additionally to the compatibility plugin actions, the krpan Maps Plugin also offers some newer plugin actions for more control and customizing.
  • New: As krpano-based, open-source xml-only plugin, it allows way more customizing and is more flexible, e.g. use any kind of krpano hotspots or krpano layers on the map (example).

Combobox Plugin (combobox.xml)

  • New: The plugin was fully ported to a Javascript implementation.
  • New: Combobox elements can now also be defined directly using <layer> elements and by using: style="combobox". This makes it easier to define them as sub-layer/child elements.
  • New: Support hiding the marker by setting a zero width.
  • Fix: When the combobox is a flowing element, disable the flow when opening the combobox.
  • Fix: Quotes inside callback actions don't matter anymore.

More Plugins and XML Extensions Changes

  • New: stateurls.xml - Extend <layer> or <hotspot> elements with 'overurl' and 'downurl' settings for automatically changing the url image.
  • New: minimap_zoomrect.xml - When dragging the minimap-rectangle, the pano-view will follow slightly delayed with a smooth animation. Additionally there are more customization options, like showing the zoom-percentage (example).
  • New: wakelock.xml - Use the Browsers Wakelock API to prevent the screen from turning off, dimming or locking.
  • New: depthmap_measure3d.xml - Allow to use also hotspots with hittest=true as raycast target.
  • New: radar.js - new customhlookat, customhfov, oncustomchange settings for a custom, pano-unrelated, radar-cone control.
  • New: pp_blur.js - New mask, maskx, masky, maskw, maskh settings for blurring only a specific rectangular area.
  • New: googlemaps.js - new apiquery setting for adding custom Strings to the Google Maps API script loading URL.
  • Change: bingmaps.js - The maptype control design has been slightly changed.
  • Change: googlemaps.js - use the dropdown-maptype control by default, for using the previous 'horizontal maptype bar', the 'maptype_hbar' controls setting can be used.
  • Fix: googlemaps.js - hide the blue focus border.
  • Fix: pp_blur.js - The linearrgb setting wasn't working.

vtourskin.xml

  • New: skin_loadtour(xmlpath, startscene) action for directly loading an other tour without leaving or reloading the viewer.
  • New: Use OpenStreetMap (via krpanomaps.xml) as map by default.

Examples



Previous Versions: