使用带有C++库的Javascript应用程序对SVG路径执行操作

Question

我一直在为SVG开发一个图形编辑器，以供我的用户通过他们的web浏览器访问它。它基于SVG-edit，用Javascript编写。

目前的应用程序缺乏所谓的“布尔运算”，即用户选择2个或更多形状并将它们连接在一起的能力。

我找到了一个名为LIB2GEOM的C++库，它应该可以处理这些操作，我相信这也是Inkscape使用的。

既然我的应用程序不是用Javascript编写的，他们有没有可能把这个库和我的应用程序联系起来呢？

         <div id="svgcontainer"></div>
    <script>

    function path2poly() 




 {
  var subj_polygons = [[{X:10,Y:10},{X:110,Y:10},{X:110,Y:110},{X:10,Y:110}],
                  [{X:20,Y:20},{X:20,Y:100},{X:100,Y:100},{X:100,Y:20}]]; 
  var clip_polygons = [[{X:50,Y:50},{X:150,Y:50},{X:150,Y:150},{X:50,Y:150}],
                  [{X:60,Y:60},{X:60,Y:140},{X:140,Y:140},{X:140,Y:60}]];
  var scale = 100;
subj_polygons = scaleup(subj_polygons, scale);
 clip_polygons = scaleup(clip_polygons, scale);
var cpr = new ClipperLib.Clipper();
cpr.AddPolygons(subj_polygons, ClipperLib.PolyType.ptSubject);
cpr.AddPolygons(clip_polygons, ClipperLib.PolyType.ptClip);
var subject_fillType = ClipperLib.PolyFillType.pftNonZero;
var clip_fillType = ClipperLib.PolyFillType.pftNonZero;
var clipTypes = [ClipperLib.ClipType.ctUnion];
var clipTypesTexts = "Union";
var solution_polygons, svg, cont = document.getElementById('svgcontainer');
var i;
for(i = 0; i < clipTypes.length; i++) {
solution_polygons = new ClipperLib.Polygons();
cpr.Execute(clipTypes[i], solution_polygons, subject_fillType, clip_fillType);
//console.log(JSON.stringify(solution_polygons));


 alert(polys2path(solution_polygons, scale));
 }

 }

// helper function to scale up polygon coordinates
function scaleup(poly, scale) {
 var i, j;
if (!scale) scale = 1;
for(i = 0; i < poly.length; i++) {
for(j = 0; j < poly[i].length; j++) {
  poly[i][j].X *= scale;
  poly[i][j].Y *= scale;
 }
}
return poly;
}

// converts polygons to SVG path string
function polys2path (poly, scale) {
var path = "", i, j;
if (!scale) scale = 1;
for(i = 0; i < poly.length; i++) {
for(j = 0; j < poly[i].length; j++) {
  if (!j) path += "M";
  else path += "L";
  path += (poly[i][j].X / scale) + ", " + (poly[i][j].Y / scale);
 }
 path += "Z";
 }
 return path;

}
 </script>

Answer 1

您可以尝试使用emscripten将其交叉编译为JS