Back to the Shapespark home page

Is this possible?

Hi all!

I have been tasked with creating a virtual launch event and we have a few features that we would like to know if it is possible to achieve within Shapespark. I will list them below (sorry it is a long list!):

  1. "Popup Box"/Edit HTML Label - How/can we edit the appearance of an HTML label? We have a few products we want to showcase where users see product info, we have tried an HTML label to a webpage but this looks too “external” and ruins the immersion, we want a small box containing image of product + description next to the object that looks like part of the scene, can this appear on hover?

  2. Object Highlight - Is there a way to outline 3D objects on hover? Again, this is for showcasing products.

  3. Spotify Playlist - We have tried adding a embedded Spotify playlist however we cannot play songs as it says “this song is not currently available in your country” even though it is?

  4. Download image? - is there a way for users to download an image when they click on it?

  5. Private video - This might be a silly one, how do we embedded a video without uploading it to Youtube/Vimeo etc? How can we make it fullscreen on click?

Thanks so much for your help! :smile:

Hey !

  1. The pop up box contains HTML. You can use CSS directly on the element :slight_smile: You can modify the

    itself in the style.css : line 595 (if you have the “plus” version of shapespark). If you don’t, create a bod-end.html in “your documents>shapespark>project’s folder” and write a for #ext-html-label-content.
  2. Outline is impossible as far as I know. You can change the “emission” or “opacity” on hover though:

         function handleHoverChanged(material, hoverActive) {
     		if (hoverActive) 
     		{
     			document.body.style.cursor = 'pointer';
     			material.emissive = true;
     			material.emissionStrength = 5;				
     			viewer.requestFrame();
     		} 
     		else 
     		{
     			document.body.style.cursor = '';
     			material.emissive = false;
     			viewer.requestFrame();
     		}			
     	}
     	
     	viewer.onMaterialHoverChanged('tag1', handleHoverChanged); 
    
  3. Never done that, can’t help you.

  4. “Open url” as extension ?

  5. Put it on your server and make a HTML label with

Hope i helped you !

3 Likes

Thank you so much for your response, I will try your suggestions now!