Closed xploshioOn closed 7 years ago
kovacsv
commented
7 years ago Hello,
JSModeler can convert only path elements to 3D model. In your SVG there is a text element. I think you can do two things:
Hope it helps, Viktor
xploshioOn
commented
7 years ago Hello Viktor, I worked with path and it works perfect. I made a lot of testing, and the thing of positioning is a little crazy here. it just takes the viewBox="1150 1200 500 500" parameters as positioning and size. So it don't use the same scale? and I have x-value and y-value, but now how I specify the z-value? I generate the model like this
function to_svg(string, minx, miny){
var svgObject = document.getElementById('svgid');
var modelAndMaterials, model, materials, meshes
$.each(string.split(""), function(index, el) {
minx = minx-70;
svgObject.setAttribute("viewBox", ""+minx+" "+miny+" 500 500");
$("#svgid").find("path").attr("d", dictionary[el]);
modelAndMaterials = JSM.SvgToModel(svgObject, 0.3, 50);
model = modelAndMaterials[0];
materials = modelAndMaterials[1];
meshes = JSM.ConvertModelToThreeMeshes(model,materials);
viewer.AddMeshes(meshes);
viewer.Draw();
});
}
$(document).ready(function(){
var settings = {
cameraEyePosition: [-1.3, -1.5, 1.0],
cameraCenterPosition: [0.5, 0.0, 0.5],
cameraUpVector: [0, 0, 1]
};
plot_building("plot_div", <%= @p.to_json.html_safe %>, <%= @plot.to_json.html_safe %>, settings);
to_svg("78", 1150, 1200);
to_svg("test", -470, 600);
to_svg(".hash()", 500, 200);the plot_building function creates some elements dynamically and my function adds those texts to the model, but how can I specify the z-value? I tried adding a transformation but didn't work.
thanks for your help, I'll attach an image of this, the text will be like legends for the model.
kovacsv
commented
7 years ago Hello,
It seems that the problem is with the view box. JSModeler does not care about the view box settings, it converts the model independently. I would try to transform the model back in x and y with the inverse of view box coordinates.
A working example would be useful for more investigation.
Viktor
xploshioOn
commented
7 years ago Hello Viktor, I uploaded an example so you can see https://xploshioon.github.io/3D-model-with-svg-characters/
the function that add the model to the model is in custom.js, I discovered this with a lot of testing. Can you please tell me how can I change that function so I can have positioned the text with z-values? thanks I tried with transformation, but no changes, thanks.
kovacsv
commented
7 years ago Hello,
You can transform the generated model with this code:
for (var i = 0; i < model.BodyCount (); i++) {
model.GetBody (i).Transform (new JSM.TranslationTransformation (new JSM.Vector (0.0, -70.0, 0.0)));
}By the way I think that this is not the best solution. JSModeler.js currently does not support 3D text natively. It seems you are using the three.js based viewer, so you can use THREE.TextGeometry, and append the native three.js meshes to the viewer.
Hope it helps, Viktor
xploshioOn
commented
7 years ago perfect, that worked. ok I see, I will try with your sugestion then.
thanks for the help and glad that you plan to add support for this. I will close the issue, thanks again.
Hello, I am trying to use your example on svg to 3d and is working but I need to add dynamic numbers on the 3d example, I am using svg.js library to create the svg but isn't working, the diference I saw here is that the svg that is generated don't have the "d" attribute
this is the one generated
<svg id="tower" segmentlength="1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="300" height="600"><defs id="SvgjsDefs1007"></defs><text id="SvgjsText1010" font-family="Helvetica, Arial, sans-serif" fill="#ff0099" font-size="180"><tspan id="SvgjsTspan1011" dy="234" x="0">300</tspan></text></svg>and this is the one you are using on your example
if this "dynamic" generated is incompatible with jsmodeler, how can I achieve this? My case, I am creating dynamic 3d models with data from backend, and need to add labels, and metrics to the 3d model, not outside, in the 3d model dinamically too. Do you have and idea for this? I am trying to create dynamic svg (the text) and add it to the model.
thanks for your help.