Hello Team Shapespark,
Is there any possibility to add a compass which can show directions in the tour itself. Like if someone moves the camera or turns around, the compass should show the direction at where he is looking. This will really be a good feature to add.
It is possible only with a JavaScript API for getting the camera rotation. See the upper left corner of this example: 3D scene and ‘Get the camera position and rotation.’ section of this document: GitHub - shapespark/shapespark-viewer-api: JavaScript API for interacting with the Shapespark 3D scene.
Jan, why don’t you implement this for those of us who don’t know programming or code? This is great but I can’t access this possibility! I don’t know anything about APIs or code or some!
Thanks @jan .
This improvement is very useful.
Is it possible to add a hand-drawn floor plan as a png?
Maybe the lower left corner is a better place for this add-on (not to cover the logo)?
The implementation of this is available here: shapespark-viewer-api/body-end.html at master · shapespark/shapespark-viewer-api · GitHub
To place it in the bottom change: top: 0px; into bottom: 0px;.
Using a hand drawn floor plan should be possible, it was discussed here: Location on a plant map - #2 by jan, but I’m not aware if anyone actually did it. Also here: Floor plans with extensions? - #4 by wojtek Wojtek suggests to try LayOut in SketchUp to generate floor plan images.
Making the floor plan is very easy, the thing is that I have no idea how or where to upload it! Tonight with your instructions I will try to make the floor plan of the Christmas demo https://all360.shapespark.com/shapespark-example-room-christmas/ and update the tour. I will let you know my difficulties and results. See you in a few hours.
Right, as with sounds and logo, Shapespark doesn’t yet have a good solution to easily upload and use such additional resources, so you would need to host the image on some external server.
Hello to all those interested in placing a floor plant in the Shapespark tours, thanks @Vladan for the collaboration.
This is the result of placing the image in plant in https://all360.shapespark.com/shapespark-example-room-christmas/
Some comments.
Since I don’t know anything about code I had to assume some things.
the position of the camera is reversed, in this example if you approach the door, the plane indicates that you go to the couch, I do not know where to change that in the html file!
I’m not interested in where I’ve been, what I’m interested in where I am, so the red lines on the map are not necessary.
I am interested in the point of the camera being more noticeable, bigger, and also in the compass shown in the corner, so if someone can put all together, the user will know where they are and in what direction they’re looking for. I don’t know how to change that in the HTML file either.
If someone who knows the code can change those parameters, with pleasure we can make a video tutorial to explain the whole process.
PS the image is hosted for free at https://cloudinary.com/
Another thing
This is how the tour shows in android, I don’t know if the Floorplan image can responde to a percent of the screen to make it little in case of mobile devices
Artsteps has already implemented a compass map in its application.
https://www.artsteps.com/view/5f121e7608358d21e0b5d0df
The map can be hidden and revealed as needed.
Also included is highlighting “hot” objects, even chatting with visitors.
These are also our wishes.
Thanks!
The kind of interaction artsteps have is amazing! It’s very user friendly and it loads like a zap ! Thank you @Vladan for showing this.
Even I wish to have such kind of interactions with Shapespark. It will make a big difference.
Thanks for sharing this! I like the idea of adding an individual icon to the mouse when it hits the ground to show users that they can go there just by a mouse click. @Jan @wojtek will this be possible in a future release to add, for example, a plane object to the mouse which can receive an individual texture and be turned on or off?
You probably have a better solution 
Yes indeed it would make the user experience great. One of the most amazing features of the tour was that you could click anywhere over the mini map displayed at the bottom left and it seamlessly takes you there like a charm. Do check it out.
I don’t know if all these things can be implemented in Shapespark, but ArtSteps uses an app for android and iPhone that allows you to have a series of different actions and Shapespark doesn’t have that 
. Perhaps that is what limits the development of this type of actions so much to the magicians of Shapespark 
I’m convinced that if Shapespark magicians gave our clients a solution to all their requests regardless of the market (AEC, fairs, galleries, real estate, etc.) it would become a hit, and would catapult the program to the sky and beyond.
I hope they achieve some solution.
Regards,
Jorge
We agree that this kind of indication would make navigation more intuitive, we would like to add something like this. On touch screens (no hover) this would need to be a two click solution: the first touch places an indication where the camera would move, the second touch confirms the selection.
As for the minimap, we will play with the @jorgearg demo. Using existing API it should be possible to extend the demo to support teleporting the user to clicked places on the map. The devil, as always, is in the detail, while it is quite easy to teleport the user to any clicked place, some places should be excluded (inside of walls or cabinets, outside of an apartment for scenes without exterior). Determining these excluded places would be hard.
@jan, can you please tell me how to invert the direction of the red dot in Floorplan! In this example If I walk to the door, in the floorplant looks like I move to the sofa and viceversa! What lines in HTML file I need to change to fix that?
PD mirrowing the image is not aceptable fix because is not reflect normal move in the space!
This line: shapespark-viewer-api/body-end.html at master · shapespark/shapespark-viewer-api · GitHub determines the dot position.Try changing it from:
var pixelY = canvas.scrollHeight *
(position.y - worldMinY) / (worldMaxY - worldMinY);
to
var pixelY = canvas.scrollHeight - canvas.scrollHeight *
(position.y - worldMinY) / (worldMaxY - worldMinY);
Thanks @jan, we already fixed one thing, 
now we need to do the same with the compass!
Which line should I change and what should I write to it?
If you look at the image below, you can see that in the tour the person is located in the center of the room and is facing the door, while the compass indicates that the person is facing the sofa. 
@jorgearq it is in this line: shapespark-viewer-api/body-end.html at master · shapespark/shapespark-viewer-api · GitHub Try multiplying PI/2 by 2 or -2.
I don’t know how to do that, if you write me the modified line I will substitute it, otherwise I don’t know how to write multiplication in that format! 
I’ve already tried this
var shiftedYaw = Math.PI / 2 ()-2 + rotation.yaw;
and so
var shiftedYaw = Math.PI / 2 (-2) + rotation.yaw;
and so on
var shiftedYaw = Math.PI / 2 () -2 + rotation.yaw;
and nothing
I’m looking for a way to add a text chat room in a model just like the one in Artsteps. Should I try to code it or will it be a no go?
