Soft8Soft

Forum Replies Created

Viewing 15 posts - 1 through 15 (of 20 total)

1 2 →

Author

Posts
2020-08-24 at 4:55 pm in reply to: SVG “use” method in JavaScript problems #31942

HoboCat
Customer

Nonono what I do is much simpler. All you need to do is make very simple puzzle like I posted in my first post. No canvas and so on. Then just grab this svg code and copy it into your “replace texture with” puzzle’s value:

data:image/svg+xml;utf8,<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns%23" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns%23" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" id="svg2" version="1.1" viewBox="0 0 74.764046 79.497093" height="79.497093mm" width="74.764046mm"> <defs> <style type="text/css"> </style></defs> <metadata id="metadata5"> <rdf:rdf> <cc:work rdf:about=""> <dc:format>image/svg+xml</dc:format> <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"></dc:type> <dc:title></dc:title> </cc:work> </rdf:rdf> </metadata> <g id="layer2"> <rect y="-0.002064982" x="0.0010355568" height="79.497841" width="74.765739" id="rect924" style="opacity:0.77999998;fill:%23ffffff;fill-opacity:1;stroke:none;stroke-width:0.10337228;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"></rect> </g> <g transform="translate(-38.512309,-63.715421)" id="layer1"> <flowroot transform="scale(0.26458333)" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:40px;line-height:1.25;font-family:'Myanmar Text';-inkscape-font-specification:'Myanmar Text';letter-spacing:0px;word-spacing:0px;fill:%23000000;fill-opacity:1;stroke:none" id="flowRoot963" xml:space="preserve"><flowregion id="flowRegion965"><rect y="309.92493" x="121.74927" height="83.032066" width="357.78427" id="rect967"></rect></flowregion><flowpara id="flowPara969"></flowpara></flowroot> <text id="text906" y="106.85049" x="75.818047" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:14.8166666px;line-height:1.25;font-family:'Dancing Script';-inkscape-font-specification:'Dancing Script';text-align:center;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:%23000000;fill-opacity:1;stroke:none;stroke-width:0.26458332" xml:space="preserve"><tspan style="font-size:14.8166666px;stroke-width:0.26458332" y="106.85049" x="75.818047" id="tspan904">Hello</tspan></text> </g></svg>

2020-08-24 at 10:35 am in reply to: SVG “use” method in JavaScript problems #31924

HoboCat
Customer

Check the file I attached in my first post. The svg goes into replace image puzzle. You can also check my post in this thread to see how it is displayed on models:

Generate normal map – documentation

2020-08-24 at 6:20 am in reply to: SVG “use” method in JavaScript problems #31914

HoboCat
Customer

Basically you just need to make any kind of element in html, that would have a value that stores svg code in url format. ‘input’ is the name of that html element in my case it is a hidden form input.

2020-08-22 at 6:02 pm in reply to: SVG “use” method in JavaScript problems #31855

HoboCat
Customer

GLiFTeK wrote:

Hi all,
This all is very non-verge 3d, but dovetails into it as I’m trying to get SVG’s drawn to canvas into my 3d materials using SVG’s <use> method.

NOTE: drawing simple SVG’s to canvas using the ways in the User Manual is working FINE. The problem is referencing them in the JS.

What I mean by the <use> method is shown here – https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use

My main SVG file begins with a number of shapes with their own id’s… Circles mainly.

Then after that, groups… (with their own id’s) using <use> to make different combos of those shapes mentioned above, those groups being often used composited complex designs used in the following…

Then the largest part of the file I have whole sections of the groups in different arrangements (and cataloged with serial numbers, in a separate spreadsheet/CSV) as symbols.

That’s all in <defs>.

THAT main SVG file doesn’t have anything after defs.

I use puzzles to concatenate it all with replacing the final </svg> with a <use href> to reference any of the svg symbols I want.
as seen here –

Mking an object, referenced as a var, then trying to pass my concatenated JS that var’s .src doesn’t work.

This has been my main goal in using Verge 3D. To have a dynamic library of SVG’s resourced from ONE source, able to represented and interacted with in 3D…

I’m ALLLLMOST there…
Any advice or help with this would be FANTASTIC!

Thanks.

Hello, dont know if understood the problem corectly, but try changing all ‘#’ symbols with ‘%23’ in svg code.
I had made a customizator, where user is making changes in svg and every time a change is made in svg, a ‘replace texture’ puzzle is activated, which takes that modified svg from browser in url format. Im sure this would also work in your application.

2019-12-08 at 4:40 pm in reply to: Problem with refreshing a page with verge3d #21818

HoboCat
Customer

Ahh,
This was not related with verge3d this was fully my site javascript mistakes, just some browsers handles errors a bit diffrently.

make sure your page is loaded before accessing its elements

Also Im planning to expand functionalities in my page. I was wondering if I can tell my page somehow that verge3d is loaded? For example verge3d loads and it activates a hidden button in my page, wich tells javascript about scene has been loaded.

2019-12-06 at 10:43 am in reply to: Problem with refreshing a page with verge3d #21778

HoboCat
Customer

Hello,
Just published my site so now I can share the link:
http://www.kaziukas24.lt/configure/12
To see the problem:
1. Click on ‘rodyti/slepti’
2. In lower input field type in a text. You can see it appears on model.
3. Refresh page and try to input text again. Sometimes the problem does not appear so if it happens try to refresh again. Sooner or later the problem appears(on Google chrome)

2019-10-13 at 8:02 pm in reply to: Problem with refreshing a page with verge3d #20175

HoboCat
Customer

Can I send it to you pm? The page can not be published yet due to some security issues.

2019-09-16 at 5:10 pm in reply to: Font problem in svg #18893

HoboCat
Customer

base64 solved it! Thank you!

2019-09-15 at 11:25 am in reply to: Font problem in svg #18769

HoboCat
Customer

Basicaly I add svg outerHTML into input. And on event of click verge puzzles takes value from input and uses it tu replace the existing texture. There are some minor changes that must be done for svg to be used this way: ‘#’ replaced with ‘%23’, images in svg must be in base64 format.

2019-09-14 at 9:05 pm in reply to: Generate normal map – documentation #18731

HoboCat
Customer

Hey scalare,
Its good to hear that someone else is working on engraving simulations! Im working on this almost year, trying to make dynamic simulation for my co2 laser works.
The best result for the most realistic engravings I got by using 3 textures from the start: main wood texture, engraved wood texture, image to be engraved on model.
The engraved wood texture must be made out of main texture, but you have to make it look engraved with image editing softwares(becouse its made out of main wood texture it will keep having same wood relief and marks – thats important for realistic engraving simulations)

Now this is how my workflow goes(in blender):
1. I put main texture on my model.
2. I take the image that I want to engrave on my model, make it grayscale.
3. I set this image as bump map on my model, so the darker pixels the deeper engraving.
4. I use this image also to put the ‘engraved texture’ on ‘main texture’, but I make so that the darker pixels the more of ‘engraved texture’ is put on ‘main texture’

After everything I can make that the image for engraving would by changeable in browser(using puzzles and some javascript)

Attaching the basic material setup in blender for this.
Also an example image of what Im working on.

2019-09-14 at 8:43 pm in reply to: Generate normal map – documentation #18725

HoboCat
Customer

Hey scalare,
Its good to hear that someone else is working on engraving simulations! Im working on this almost year, trying to make dynamic simulation for my co2 laser works.
The best result for the most realistic engravings I got by using 3 textures from the start: main wood texture, engraved wood texture, image to be engraved on model.
The engraved wood texture must be made out of main texture, but you have to make it look engraved with image editing softwares(becouse its made out of main wood texture it will keep having same wood relief and marks – thats important for realistic engraving simulations)

Now this is how my workflow goes:
1. I put main texture on my model.
2. I take the image that I want to engrave on my model, make it grayscale.
3. I set this image as bump map on my model, so the darker pixels the deeper engraving.
4. I use this image also to put the ‘engraved texture’ on ‘main texture’, but I make so that the darker pixels the more of ‘engraved texture’ is put on ‘main texture’

Attaching the basic material setup in blender for this.
Also an example image of what Im working on.

2019-02-23 at 8:28 pm in reply to: Replacing textures rather than materials #11714

HoboCat
Customer

Thanks, I added it to my web app and everything works Gonna get v3d licence. Also found the problem with chrome, it was not related to v3d, the problem was that when sending svg via data url you need to avoid # and use %23 instead.

2019-02-22 at 9:43 pm in reply to: Replacing textures rather than materials #11679

HoboCat
Customer

Hey thanks! those puzzles seems to be usefull in my project! I noticed that there is a puzzle element ‘opened file’, but it says that it retrieves image from ‘upload image’ puzzle, but I dont see such puzzle. Is it the “Open file>do” puzzle?

Also I managed to make my last link to work. But it does not work on chrome:

the part that takes svg from input in text form of “data:image/svg+xml;utf8,<svg>…” and uses that svg as a texture doesn’t seem to work in chrome. Is there something I could do wih this?

My project is related with laser engraving and cnc cutting production, and in these areas we use svg files for production. The svg file that is shown in v3d would be also sent directly to production.

By the way if I put 3d iframe from v3d network directly to my web page the buttons dont interact with v3d iframe. Is this problem also related to ‘same origin policy’ issue?
It would be very handy to use v3d network as 3d content storage for my automated web store.

2019-02-21 at 10:29 pm in reply to: Replacing textures rather than materials #11650

HoboCat
Customer

Hmmm as soon as I acomplished to make fully functional mechanism I started to try if it would work in my project that I am building(product customizator). After publishing to Verge3d network it somehow stopped to work the way I had made it. If I pass an image link, verge3d replace_texture puzzle does not make changes in image. But if I pass the image that is in app dir (./svgexample.svg) then it works. Also works with base64 input, but does not work with svg anymore. Could it be that when publishing to v3d network it modifies something in my v3d app?
Here is my app:
https://cdn.soft8soft.com/AROAJSY2GOEHMOFUVPIOE:f91957cd7f/applications/my_product/index.html

edit:
I found that the <image> part in svg is the part that started to block it to be passed to verge, if I take it out it works. Thats why image change from app dir works(it is without img).

2019-02-20 at 9:29 pm in reply to: Replacing textures rather than materials #11596

HoboCat
Customer

Thanks for advice. I also found out that svg’s from inkscape must be exported in plain svg format, then you can simply pass its html code to verge3d without any conversion to base64. My problem was that svg’s that i used was ‘Inkscape svg’ format.
Author

Posts

Viewing 15 posts - 1 through 15 (of 20 total)

1 2 →