Explore the community Forums Lectora Lectora Questions & Answers Lectora 17: Accessing shape properties in javascript Reply To: Lectora 17: Accessing shape properties in javascript

#366946 Score: 1
Profile photo of Wendy Miller
Wendy Miller
friend finder
junior moderator
wise owl
verified member
55 pts

Hi Nick,

There are two major changes when upgrading to Lectora 17 that are going to affect what I think you are trying to do.

First, all of the shapes are now rendered as vector-based svgs. I believe there is a fallback to a png if the browser is not capable of rendering an svg, but most modern browsers are. This means that maybe the best way to get the y value of a shape is to get the CSS “top” style value of the div containing the svg. In your case, this div would have an id of “shape658”.

Second, Lectora 17 added the option to publish for Seamless Play. This means that all of the pages in the title are essentially being displayed in the same page within an iframe. If you publish with this option turned on (it is on by default in the HTML Publish options), you will need to change document.getElementById() to getDisplayDocument().getElementById().

getDisplayDocument() seems to work whether Seamless Play is checked or not. So I’d just use that from here on out. Here is a little sample code that does what I think you want to do. It’s not quite as simple as just getting a y property from an image, but it might work for you.

var bar = getDisplayDocument().getElementById(“shape658”);
var yPos = getDisplayWindow().getComputedStyle(bar, null).getPropertyValue(“top”);

At this point, yPos will have a value of, for instance, “100px”. If you want to strip off the “px” part so that you just have the numeric value, you can add the following to the code.

var idx = yPos.indexOf(“p”);
yPos = yPos.substring(0, idx);

If you copy and paste this code, remember to change the quotation marks to regular quotes before trying to run it, because the quotes get turned into the “curly” type quotes when you post messages here.

I hope this helps some.


This post has received 1 vote up.