Hello Everyone:
- I have used KRpano for about 2 months. I have wanted to create a blurred area like the below image. I searched many times on Google and this forum, but It was not a solution for me. So Anyone can give me a suggestion or an example, please!
Is it posible to create a blurred area in KRpano?
-
-
Hi,
no sorry, krpano doesn't offer image-editing functionalities.
Why not simply using an image-editor for this case?
Best regards,
Klaus -
Hi klaus.krpano, thank you for your reply
- My customers want to have a button on website, when they click on it then they can choose a area and blur it.
- I could create a blur area by canvas and set it to a hotspot. But, I don't know how to calculate width and height of the hotspot.
- You can see example here: https://youtu.be/-Wqhjha-Kpo
Noted: Can you tell me how to calculate the width and height of the hotpost when we know: hlookat, vlookat, fov, image width, image height ?
Here my code:Code
Alles anzeigenimgObj.onload = function() { //Get Image in Center of Screen. let leftPointX = this.width / 2 - imageWidth/2; let leftPointY = this.height / 2 - imageHeight/2; //clip circle frame. ctx.arc(imageWidth/2, imageWidth/2, imageWidth/2, 0, 2 * Math.PI, false); ctx.clip(); //Get context data from source image. ctx.drawImage(imgObj, leftPointX, leftPointY, imageWidth, imageHeight, 0, 0, imageWidth, imageHeight); fnBlur(); let imageData = canvas.toDataURL("image/png"); let scaleWidth = krpano.get("view.fov") * window.devicePixelRatio; let scaleHeight = krpano.get("view.fov") * window.devicePixelRatio; console.log(krpano.get("stagescale")); //console.log(document.getElementById('krpanoSWFObject').offsetWidth); //console.log(document.getElementById('krpanoSWFObject').offsetHeight); krpano.set("hotspot['tests'].url", imageData); krpano.set("hotspot['tests'].ath", krpano.get('view.hlookat')); krpano.set("hotspot['tests'].atv", krpano.get('view.vlookat')); krpano.set("hotspot['tests'].width", scaleWidth); krpano.set("hotspot['tests'].height", scaleWidth); krpano.call('updatescreen();'); }
-
Hi,
the current viewer size is available as stagewidth and stageheight:
https://krpano.com/docu/actions/#stagewidthAbout your case - maybe have a look at the makescreenshot-api example to get the image part you can blur:
https://krpano.com/examples/usage/#makescreenshot-apiBest regards,
Klaus -
Thanks for your answer.! Klasu.
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!