Merge pull request #73 from mrbeam/mrbeam-dev-textInSvg
Mrbeam dev text in svg
This commit is contained in:
commit
75f69dd0df
7 changed files with 98 additions and 46 deletions
|
|
@ -357,6 +357,8 @@ class SvgToGcodePlugin(octoprint.plugin.SlicerPlugin,
|
|||
converter_path = '/home/teja/workspace/mrbeam-inkscape-ext'
|
||||
elif("denkbrett" in hostname):
|
||||
converter_path = '/home/flo/mrbeam/git/mrbeam-inkscape-ext'
|
||||
elif ("clems-Air" in hostname):
|
||||
converter_path = '/Users/clem/Dropbox/mrBeam/mrbeam-inkscape-ext'
|
||||
|
||||
import sys
|
||||
sys.path.append(converter_path)
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ defaults = dict(
|
|||
# general settings
|
||||
svgDPI = 90,
|
||||
pierce_time = 0,
|
||||
|
||||
|
||||
# vector settings
|
||||
speed = 300,
|
||||
intensity = 500,
|
||||
|
|
@ -24,7 +24,7 @@ defaults = dict(
|
|||
cross_fill = False,
|
||||
fill_angle = 0,
|
||||
fill_spacing = 0.25,
|
||||
|
||||
|
||||
# pixel settings
|
||||
beam_diameter = 0.25,
|
||||
intensity_white = 0,
|
||||
|
|
@ -251,8 +251,8 @@ class Profile(object):
|
|||
}
|
||||
|
||||
return settings
|
||||
|
||||
|
||||
|
||||
|
||||
def convert_to_engine2(self):
|
||||
|
||||
settings = {
|
||||
|
|
|
|||
|
|
@ -41,8 +41,10 @@ $(function(){
|
|||
// image engraving stuff
|
||||
// preset values are a good start for wood engraving
|
||||
self.images_placed = ko.observable(false);
|
||||
self.text_placed = ko.observable(false);
|
||||
self.show_image_parameters = ko.computed(function(){
|
||||
return self.images_placed() || (self.fill_areas() && self.show_vector_parameters());
|
||||
return (self.images_placed() || self.text_placed()
|
||||
|| (self.fill_areas() && self.show_vector_parameters()));
|
||||
});
|
||||
self.imgIntensityWhite = ko.observable(0);
|
||||
self.imgIntensityBlack = ko.observable(500);
|
||||
|
|
@ -85,6 +87,7 @@ $(function(){
|
|||
self.show_vector_parameters(self.workingArea.getPlacedSvgs().length > 0);
|
||||
self.show_fill_areas_checkbox(self.workingArea.hasFilledVectors())
|
||||
self.images_placed(self.workingArea.getPlacedImages().length > 0);
|
||||
self.text_placed(self.workingArea.hasTextItems());
|
||||
//self.show_image_parameters(self.workingArea.getPlacedImages().length > 0);
|
||||
|
||||
if(self.show_vector_parameters() || self.show_image_parameters()){
|
||||
|
|
|
|||
|
|
@ -30,8 +30,12 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
*/
|
||||
Element.prototype.bake = function (toCubics, dec) {
|
||||
var elem = this;
|
||||
if (!elem || !elem.paper) // don't handle unplaced elements. this causes double handling.
|
||||
|
||||
console.log("ElemType: "+elem.type+" "+elem.id+" Children: "+elem.children().length);
|
||||
if (!elem || !elem.paper || elem.type !== "text" || elem.type !== "#text" || elem.type !== "tspan"){
|
||||
console.log("Skip not on paper!");
|
||||
return;
|
||||
} // don't handle unplaced elements. this causes double handling.
|
||||
|
||||
if (typeof (toCubics) === 'undefined')
|
||||
toCubics = false;
|
||||
|
|
@ -42,9 +46,10 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
if (children.length > 0) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
var child = children[i];
|
||||
console.log("ChildType "+i+": "+child.type+" "+child.id+" Children: "+child.children().length);
|
||||
child.bake(toCubics, dec);
|
||||
}
|
||||
elem.attr({transform: ''});
|
||||
/*if(child.type !== "#text") */elem.attr({transform: ''});
|
||||
return;
|
||||
}
|
||||
if (elem.type !== "circle" &&
|
||||
|
|
@ -54,14 +59,44 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
elem.type !== "polygon" &&
|
||||
elem.type !== "polyline" &&
|
||||
elem.type !== "image" &&
|
||||
elem.type !== "path"){
|
||||
elem.type !== "path" &&
|
||||
elem.type !== "text" &&
|
||||
elem.type !== "tspan" &&
|
||||
elem.type !== "#text"){
|
||||
|
||||
// if(elem.type !== 'g' && elem.type !== 'desc' && elem.type !== 'defs')
|
||||
// console.log('skipping unsupported element ', elem.type);
|
||||
return;
|
||||
}
|
||||
|
||||
if (elem.type == 'image'){
|
||||
// if (elem.type == "text" || elem.type == "#text"){
|
||||
// var x = parseFloat(elem.attr('x')),
|
||||
// y = parseFloat(elem.attr('y')),
|
||||
// w = parseFloat(elem.attr('width')),
|
||||
// h = parseFloat(elem.attr('height'));
|
||||
//
|
||||
// // Validity checks from http://www.w3.org/TR/SVG/shapes.html#RectElement:
|
||||
// // If 'x' and 'y' are not specified, then set both to 0. // CorelDraw is creating that sometimes
|
||||
// if (!isFinite(x)) {
|
||||
// console.log('No attribute "x" in image tag. Assuming 0.')
|
||||
// x = 0;
|
||||
// }
|
||||
// if (!isFinite(y)) {
|
||||
// console.log('No attribute "y" in image tag. Assuming 0.')
|
||||
// y = 0;
|
||||
// }
|
||||
// var transform = elem.transform();
|
||||
// var matrix = transform['totalMatrix'];
|
||||
// var transformedX = matrix.x(x, y);
|
||||
// var transformedY = matrix.y(x, y);
|
||||
// var transformedW = matrix.x(x+w, y+h) - transformedX;
|
||||
// var transformedH = matrix.y(x+w, y+h) - transformedY;
|
||||
//
|
||||
// elem.attr({x: transformedX, y: transformedY, width: transformedW, height: transformedH});
|
||||
// return;
|
||||
// }
|
||||
|
||||
if (elem.type == 'image' || elem.type == "text" || elem.type == "#text"){
|
||||
// TODO ...
|
||||
var x = parseFloat(elem.attr('x')),
|
||||
y = parseFloat(elem.attr('y')),
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
// render_fills.js - a snapsvg.io plugin to render the infill of svg files into a bitmap.
|
||||
// Copyright (C) 2015 Teja Philipp <osd@tejaphilipp.de>
|
||||
//
|
||||
// based on work by http://davidwalsh.name/convert-canvas-image
|
||||
//
|
||||
// based on work by http://davidwalsh.name/convert-canvas-image
|
||||
// and http://getcontext.net/read/svg-images-on-a-html5-canvas
|
||||
//
|
||||
// This program is free software: you can redistribute it and/or modify
|
||||
|
|
@ -20,12 +20,12 @@
|
|||
|
||||
|
||||
Snap.plugin(function (Snap, Element, Paper, global) {
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* @param {elem} elem start point
|
||||
*
|
||||
*
|
||||
* @returns {path}
|
||||
*/
|
||||
|
||||
|
|
@ -34,7 +34,7 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
var selection = [];
|
||||
var children = elem.children();
|
||||
|
||||
|
||||
|
||||
if (children.length > 0) {
|
||||
var goRecursive = (elem.type !== "defs" && // ignore these tags
|
||||
elem.type !== "clipPath" &&
|
||||
|
|
@ -42,7 +42,7 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
elem.type !== "rdf:rdf" &&
|
||||
elem.type !== "cc:work" &&
|
||||
elem.type !== "sodipodi:namedview");
|
||||
|
||||
|
||||
if(goRecursive) {
|
||||
for (var i = 0; i < children.length; i++) {
|
||||
var child = children[i];
|
||||
|
|
@ -50,7 +50,7 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
}
|
||||
}
|
||||
} else {
|
||||
if(elem.type === 'image'){
|
||||
if(elem.type === 'image' || elem.type === "text" || elem.type === "#text"){
|
||||
selection.push(elem);
|
||||
} else {
|
||||
if(fillPaths && elem.is_filled()){
|
||||
|
|
@ -65,7 +65,7 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
|
||||
Element.prototype.is_filled = function(){
|
||||
var elem = this;
|
||||
|
||||
|
||||
// TODO text support
|
||||
// TODO opacity support
|
||||
if (elem.type !== "circle" &&
|
||||
|
|
@ -74,14 +74,17 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
elem.type !== "line" &&
|
||||
elem.type !== "polygon" &&
|
||||
elem.type !== "polyline" &&
|
||||
elem.type !== "path" ){
|
||||
|
||||
elem.type !== "path" //&&
|
||||
// elem.type !== "text" &&
|
||||
// elem.type !== "#text"
|
||||
){
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
var fill = elem.attr('fill');
|
||||
var opacity = elem.attr('fill-opacity');
|
||||
|
||||
|
||||
if(fill !== 'none'){
|
||||
if(opacity === null || opacity > 0){
|
||||
return true;
|
||||
|
|
@ -89,7 +92,7 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
Element.prototype.embedImage = function(callback){
|
||||
var elem = this;
|
||||
if(elem.type !== 'image') return;
|
||||
|
|
@ -113,9 +116,9 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
};
|
||||
|
||||
image.src = url;
|
||||
|
||||
|
||||
};
|
||||
|
||||
|
||||
Element.prototype.renderPNG = function (wMM, hMM, pxPerMM, callback) {
|
||||
var elem = this;
|
||||
|
||||
|
|
@ -129,7 +132,7 @@ Snap.plugin(function (Snap, Element, Paper, global) {
|
|||
var renderCanvas = document.createElement('canvas');
|
||||
renderCanvas.id = "renderCanvas";
|
||||
renderCanvas.width = wMM * pxPerMM;
|
||||
renderCanvas.height = hMM * pxPerMM;
|
||||
renderCanvas.height = hMM * pxPerMM;
|
||||
document.getElementsByTagName('body')[0].appendChild(renderCanvas);
|
||||
var renderCanvasContext = renderCanvas.getContext('2d');
|
||||
|
||||
|
|
|
|||
|
|
@ -410,7 +410,7 @@ $(function(){
|
|||
};
|
||||
|
||||
self.svg_contains_text_warning = function(svg){
|
||||
var error = "<p>" + gettext("The svg file contains text elements.<br/>Please convert them to paths.<br/>Otherwise they will be ignored.") + "</p>";
|
||||
var error = "<p>" + gettext("The SVG file contains text elements.<br/>If you want to laser just their outlines,<br/>please convert them to paths.<br/>Otherwise they will be engraved with infill.") + "</p>";
|
||||
//error += pnotifyAdditionalInfo("<pre>" + data.jqXHR.responseText + "</pre>");
|
||||
new PNotify({
|
||||
title: "Text elements found",
|
||||
|
|
@ -418,7 +418,6 @@ $(function(){
|
|||
type: "warn",
|
||||
hide: false
|
||||
});
|
||||
svg.selectAll('text,tspan').remove();
|
||||
};
|
||||
|
||||
self.svg_misfitting_warning = function(svg, misfitting){
|
||||
|
|
@ -724,6 +723,16 @@ $(function(){
|
|||
return snap.selectAll("#userContent image");
|
||||
};
|
||||
|
||||
self.hasTextItems = function () {
|
||||
if(snap.selectAll("#userContent tspan").length > 0 ||
|
||||
snap.selectAll("#userContent text").length > 0 ||
|
||||
snap.selectAll("userContent #text").length > 0) {
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
}
|
||||
};
|
||||
|
||||
self.getPlacedGcodes = ko.computed(function() {
|
||||
var gcodeFiles = [];
|
||||
ko.utils.arrayForEach(self.placedDesigns(), function(design) {
|
||||
|
|
@ -846,7 +855,7 @@ $(function(){
|
|||
for (var i = 0; i < fillings.length; i++) {
|
||||
var item = fillings[i];
|
||||
|
||||
if (item.type === 'image') {
|
||||
if (item.type === 'image' || item.type === "text" || item.type === "#text") {
|
||||
// remove filter effects on images for proper rendering
|
||||
var style = item.attr('style');
|
||||
if (style !== null) {
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Sets the intensity of the laser. The more intensity the deeper the effect on the material.
|
||||
Sets the intensity of the laser. The more intensity the deeper the effect on the material.
|
||||
Cutting needs higher intensities than engraving.
|
||||
The effect in general is dependent from the material and its color and surface.
|
||||
</div>
|
||||
|
|
@ -33,8 +33,8 @@
|
|||
</div>
|
||||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Sets the velocity of the laser head. The slower the movement the deeper the effect on the material.
|
||||
Cutting needs slower movement than engraving.
|
||||
Sets the velocity of the laser head. The slower the movement the deeper the effect on the material.
|
||||
Cutting needs slower movement than engraving.
|
||||
The effect in general is dependent from the material and its color and surface.
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -56,11 +56,11 @@
|
|||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Some (especially bright) materials require the laser to dwell a little until the surface has absorbed enough energy to be affected.
|
||||
This parameter sets the amount of time in milliseconds the movement is paused after the laser is switched on.
|
||||
This parameter sets the amount of time in milliseconds the movement is paused after the laser is switched on.
|
||||
If the result shows gaps in lines for example increase this value carefully. The higher the value the higher the risk of material ignition.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div data-bind="visible: show_image_parameters ">
|
||||
<p>{{ _('Image engraving parameters:') }}</p>
|
||||
<div class="control-group" >
|
||||
|
|
@ -103,10 +103,10 @@
|
|||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Pixel / raster engravings are done line by line. This sets the distance between the single lines.
|
||||
Smaller values allow finer engravings but require a more precise focus and are slower.
|
||||
Smaller values allow finer engravings but require a more precise focus and are slower.
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<p >{{ _('Image Preprocessing') }}</p>
|
||||
<div class="controls">
|
||||
<div class="img_preprocessing_preview before" style="background-image:url(/plugin/svgtogcode/static/img/kitty_grayscale.png);" >before</div>
|
||||
|
|
@ -114,22 +114,22 @@
|
|||
<div class="img_preprocessing_preview contrast" style="background-image:url(/plugin/svgtogcode/static/img/kitty_contrast.png);" data-bind="style: { opacity: contrastPreview }" ></div>
|
||||
<div class="img_preprocessing_preview sharpened" style="background-image:url(/plugin/svgtogcode/static/img/kitty_sharpened.png);" data-bind="style: { opacity: sharpenedPreview }" ></div>
|
||||
<div class="img_preprocessing_preview dithered" style="background-image:url(/plugin/svgtogcode/static/img/kitty_dithered_150.png);" data-bind="visible: imgDithering"></div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="photo_attribution"><a href="http://www.christianholmer.com" target="_blank">Photo: Christian Holmér</a></div>
|
||||
</div>
|
||||
|
||||
|
||||
<div data-bind="disable:imgDithering ">
|
||||
<label class="control-label">{{ _('Contrast') }}</label>
|
||||
<div class="controls img_slider">
|
||||
<input id="svgtogcode_contrast_slider" type="text" data-bind="value: imgContrast" >
|
||||
</div>
|
||||
<div style="clear:both"></div>
|
||||
<div style="clear:both"></div>
|
||||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Increases the image contrast before converting to gcode.
|
||||
Increases the image contrast before converting to gcode.
|
||||
</div>
|
||||
|
||||
|
||||
<label class="control-label">{{ _('Sharpening') }}</label>
|
||||
<div class="controls img_slider">
|
||||
<input id="svgtogcode_sharpening_slider" class="uninitialized" type="text" data-bind="value: imgSharpening">
|
||||
|
|
@ -137,10 +137,10 @@
|
|||
<div style="clear:both"></div>
|
||||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Sharpens the image before converting to gcode.
|
||||
Sharpens the image before converting to gcode.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<label class="control-label">{{ _('Dithering') }}</label>
|
||||
<div class="controls">
|
||||
<label class="checkbox">
|
||||
|
|
@ -149,8 +149,8 @@
|
|||
</div>
|
||||
<div class="controls alert alert-info hint" data-bind="visible: showHints">
|
||||
<span class="icon icon-question-sign" aria-hidden="true"></span>
|
||||
Converts the image to solely black and white pixels.
|
||||
Use this if the laser effect on your material is not able to transfer grayscales.
|
||||
Converts the image to solely black and white pixels.
|
||||
Use this if the laser effect on your material is not able to transfer grayscales.
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -185,4 +185,4 @@
|
|||
<a href="#" class="btn" data-dismiss="modal" aria-hidden="true" data-bind="click: $root.cancel_conversion()">{{ _('Cancel') }}</a>
|
||||
<a href="#" class="btn btn-primary" data-bind="click: function() { if ($root.enableConvertButton()) { $root.convert() } }, enabled: enableConvertButton, css: {disabled: !$root.enableConvertButton()}">{{ _('Convert') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue