Please help us help you and fill where relevant:
Your LimeSurvey version: [see right hand bottom of your LimeSurvey admin screen]:  Versión 5.6.42+231024
Own server or LimeSurvey hosting: Own server
Survey theme/template:
==================
(Write here your question/remark)

Hello dear forum,

I have a question and I would like to know if something similar can be achieved in LimeSurvey or if anyone has a different idea.

I am carrying out a survey of visitors to local stores and in this survey they ask about which products they buy most frequently, but I would like to know what route the customer takes inside the store, that is, if when they enter they go first to the refreshment area, to the snack area or go to the coffee area and then return to the refreshment area and get to the checkout.

But I don't know if this is possible, I thought that the participant would draw a line with the mouse or finger sliding through the areas that they would visit on an i. I'll leave you a reference image.

Is this possible?

Thank you all very much.

You may have a look at the question theme "signature pad"
[url] github.com/adamzammit/LimeSurvey-Signature-Question/ [/url]
Here a rough example without much styling
 

Joffm

Hi joffm

Thank you so much, this really helped me a lot.

I just have one more question, how do I get the store image instead of the white box for the signature?

Thanks for your support.

Hi Joffm

I've been reading a bit in the article to find a solution but I couldn't find it, it might work with some html and Java and I'm a bit ignorant in these matters, I pasted this code but it only repeats the box and doesn't allow me to sign.

<h1>
  Draw over image
</h1>
<div class="wrapper">
  <img src=" www.cmmkt.com/BUCMMKTant/images/Diseño oxxo.png" width=500 height=300 />
  <canvas id="signature-pad" class="signature-pad" width=500 height=300></canvas>
</div>
<div>
  <button id="save">Save</button>
  <button id="clear">Clear</button>
</div>

Can it be done in some other way?

You can add a background to the "signature-pad" class in the css of the theme.

 

Hi Joffm,

I tried adding CSS to the survey theme but I couldn't find the signature-pad css so I added it myself at the end with the following:

.wrapper {
  position: relative;
  width: 600px;
  height: 400px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
img {
  position: absolute;
  left: 0;
  top: 0;
}

.signature-pad {
  position: absolute;
  left: 0;
  top: 0;
  width:600px;
  height:400px;
} www.cmmkt.com/BUCMMKTant/images/Diseño  oxxo.png But it didn't manage to set the background image, I'm probably doing something wrong, as I mentioned before I'm not very good at CSS. I inserted all this in the "theme.css" from the theme editor.

I hope I'm not too repetitive on this.

Hi,
why do you insist in this "wrapper"-stuff?
Where did you find it in the question theme?

You see in the theme folder there is the "signature.css" with nearly no content
 
Only the class ".signature-pad".

Now the easiest way is to overwrite or extend it in the question text  

But before you invest time here, do you know how to analyse this?

Joffm
 

Hi Joffm,

Thank you very much for your great help, I am very grateful to you.

The truth is that I don't know CSS and I know a little HTML and sometimes it is difficult for me to understand some things, I hope you have patience with me.

I tell you that I used the code that you show and everything is fine, I finally manage to show the image that I want.

But now I am faced with another case. The image is too small for the interviewee to be able to see the hallways, so I modified the code a little for the size.<style type="text/css">
.signature-pad {
  background-color: #efefef;
  border: 3px solid navy;
 
/* all the following is just an example; adapt it to your needs  */
  background-image:  url(" www.myserver.de/userfiles/a3.png ");
  background-size: width=800 height=400;
  background-repeat: no-repeat;
  background-position: center;
}
</style>
But in effect it only modifies the size of the image but not the selection box, is it possible to do it the way I think?

Thank you for your help and for being patient with me.  

Hi,
before you enter "random" things

background-size: width=800 height=400;

please, learn about it.
W3Schools is a great source of information
[url] www.w3schools.com/cssref/css3_pr_background.php [/url]

I can't help. This signature pad was only a suggestion.
It's up to you to decide if it is usable or not.

Another idea could be to set markers on the image (question theme: Interest points)
[url] github.com/tpartner/LimeSurvey-Image-Interest-Points-5x-6x [/url]
(would be much easier to analyze)

Joffm