Add Text to a Picture@lwx228 asked How do add text to a cell that has an image loaded? This idea is pretty simple: put the picture in a frame box, use a graphic script to decorate, take a new picture. The details to get a nice round-trip image are a bit more complicated. The frame needs to be sized and scaled, and the picture positioned, and the final image cropped.
// open the original
original = New Image(
"https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Oroblanco_%28sweetie%29_fruits.jpg/320px-Oroblanco_%28sweetie%29_fruits.jpg"
);
{xSize, ySize} = original << size;
// use a frame to do the drawing, make the original fit the frame exactly
gb = Graph Box(
<<BACKGROUNDCOLOR></BACKGROUNDCOLOR>
The results, below, shows the image filling the frame box with the decorations, and three images below. The left image is the original, the center is modified, and the right is the difference. The difference is mostly black, no change, which is good. The text in the difference is fuzzy because the anti-aliasing made subtle changes at the edge of the text.
Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.Circles and text added on top of fruit picture.
Picture from Crop a JPG Image explaining how crop works.
View more...
Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.Use a graphics frame box to add text and lines on top of a picture.
Use a frame box to add text and lines to a picture.
Re: Add Text to a PictureOK
Thank Craige!
gb[framebox(1)]<<ADD image=""></ADD>
Re: Add Text to a PictureYes. It is a little harder, explanations below.
// open the original
original = New Image(
"https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Oroblanco_%28sweetie%29_fruits.jpg/320px-Oroblanco_%28sweetie%29_fruits.jpg"
);
{xSize, ySize} = original << size;
overlay1 = new image("https://us.v-cdn.net/6038925/uploads/images/35680iA0171FFF13D53E06/NaturalCat.png");// cat
{xOverlay1Size, yOverlay1Size} = overlay1 << size;
dt = open("$sample_data/big class families.jmp","invisible");
overlay2 = dt:picture[1];// katie
overlay2<<SCALE></SCALE>
Pictures added over another picture.Pictures added over another picture.Pictures added over another picture.Pictures added over another picture.Pictures added over another picture.
The graphic script can't add the picture. Use the <
The GraphBox(...) function takes three kinds of arguments: parameters, messages, and scripts. Best practice is to put the parameters and messages first, and a single script at the end. The parameters and messages are separated by commas. The script uses semicolons to separate statements.
gb = Graph Box(
<<BACKGROUNDCOLOR></BACKGROUNDCOLOR>
Many, many graph box scripts have been written with accidental commas rather than semicolons. Each comma causes a new script to begin, separated from the previous script. It is a bit of extra overhead for JMP to run multiple scripts when one would do.
Re: Add Text to a PictureHello Craige!
I wonder if JSL can superimpose a small image at the specified position of the image?
I searched the help manual and couldn't find the answer.
That's all I can think of.Thanks Experts!
img = Open( "$SAMPLE_IMAGES/tile.jpg", jpg );
{x, y} = img << size;
img << crop( Left( 100 ), Right( x - 251 ), top( 0 ), bottom( y - 0 ) );
{x1, y1} = img << size;
img2 = Open( "$SAMPLE_IMAGES/black rhino footprint.jpg", jpg );
img << copy;//？？
img2 << paste(100,25);//？？
obj = New Window( "paste", New Image( img2 ) );<BR />
回复： Add Text to a PictureHow can increase the transparency of the portrait, for example to 50%
Thanks Experts!
Re: Add Text to a PictureGood question. See lines 12-18
Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.Katie is now 50% transparent.
// open the original
original = New Image(
"https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Oroblanco_%28sweetie%29_fruits.jpg/320px-Oroblanco_%28sweetie%29_fruits.jpg"
);
{xSize, ySize} = original << size;
overlay1 = new image("https://us.v-cdn.net/6038925/uploads/images/35680iA0171FFF13D53E06/NaturalCat.png");// cat
{xOverlay1Size, yOverlay1Size} = overlay1 << size;
dt = open("$sample_data/big class families.jmp","invisible");
overlay2 = dt:picture[1];// katie
// adjusting transparency. Katie already has a transparent background, alpha=0, and a mostly opaque
// foreground, alpha=1. Katie probably has some antialiasing around the edge of the shape, 0 < alpha < 1.
// rather than set all the alpha for the entire square to .5, multiply the existing alpha by .5.
// this will leave the alpha=0 at 0, and modify the others...
{r,g,b,a} = overlay2<<GETPIXELS></GETPIXELS>
It would be a mistake to use
{r,g,b,a} = overlay2<<GETPIXELS></GETPIXELS>
which would ignore the existing values by jamming 0.5 in where it was previously 0.0.
The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.The cut-away parts are no longer completely transparent.
The [0,0] makes a matrix assignment rather than changing a to a scalar. The light gray square tells me the transparent cut away pixels are probably white, and putting them in front of the darker gray with 50% causes a lighter gray.
回复： Add Text to a PictureThank Craige! How can directly remove the value of x axis and y axis from the drawing window in JSL and cancel the label text of x axis and y axis?
回复： Add Text to a Picturedt = Open( "$SAMPLE_DATA/Big Class.jmp" );
p1 = dt << Graph Builder(
Variables( X( :weight ), Y( :height ), Group X( :age ), Color( :sex ) ),
Elements( Bar( X, Y, Legend( 5 ), Response Axis( "X" ), Summary Statistic( "Sum" ) ) )
);
img = p1 << getpicture ;
{r,g,b,a} = img<<GETPIXELS></GETPIXELS>How can Remove white background?Thanks Experts!
Re: Add Text to a PictureTransparent background color for graphs
One way to get a transparent background is to save an SVG then edit the SVG to remove the background rectangle(s). You can do that with an editor like Inkscape or you can write JSL to do it.
dt = Open( "$sample_data/big class.jmp" );
gb = dt << Graph Builder(
Show Control Panel( 0 ),
Variables( X( :height ), Y( :weight ), Overlay( :sex ) ),
Elements( Points( X, Y, Legend( 1 ) ), Smoother( X, Y, Legend( 2 ) ) ),
SendToReport(
Dispatch( {}, "Graph Builder", FrameBox,
// I chose fedcba to be unique, used in patmatch below
{Background Color( -Hex To Number( "fedcba" ) )}
)
)
);
gb << savepicture( "$temp/temp.svg", "svg" );
txt = Load Text File( "$temp/temp.svg" );
Write( txt ); // to log, for debugging
/* remove something like this:
<G fill="#FEDCBA">
<RECT stroke="none" x="75.5" y="33.5" width="509" height="420"></RECT>
</G>
*/
rc = Pat Match( txt, "<G fill="\!">" + Pat Arb() >> BadFillPattern + "</G>" );
If( !rc,
Throw( "fill pattern not found" )
);
// the BadFillPattern occurs twice, for two different colors. remove cases of
// <RECT stroke="none" x="75.5" y="33.5" width="509" height="420"></RECT>
// (the svg command that puts a rectangle of color behind the graph's data.)
nfound = 0;
While( Pat Match( txt, BadFillPattern, "" ), nfound += 1 );
If( nfound != 2,
Throw( "nfound=" || Char( nfound ) )
);
Save Text File( "$temp/temp.svg", txt );
// I don't know how you'll load this file on windows to prove it is transparent.
Open( "$temp/temp.svg" ); // this *does* load it, but there is nothing behind it to show through.
// you can open in FireFox and fiddle with the background color to observe the transparency
FireFox background shows through the transparency.FireFox background shows through the transparency.FireFox background shows through the transparency.
I know there are Linux tools for converting the SVG to a transparent PNG. Those tools probably exist on Win as well.
edit: Many untested ideas https://stackoverflow.com/questions/6589358/convert-svg-to-png-in-python
回复： Add Text to a PictureYes, I use this command all the time now
run program(executable("I:\00\imdisplay\magick.exe"),options({"C:\3\A1.png -fuzz 0% -transparent white C:\3\A2.png"}));
https://stackoverflow.com/questions/12424018/how-to-replace-white-background-color-with-transparent-of-an-image-in-imagemagic
