how I can place an image just in one cell using npoi - asp.net-mvc

I'm using npoi to generate excel docs. I have a requirement to add images to cells. Using the following code i can insert images into my doc. However the image span many cells. How can i ensure that the image just fits inside once cell.
public ActionResult NPOICreate()
{
try
{
FileStream fs = new FileStream(Server.MapPath(#"\Content\NPOITemplate.xls"), FileMode.Open, FileAccess.ReadWrite);
HSSFWorkbook templateWorkbook = new HSSFWorkbook(fs, true);
var sheet = templateWorkbook.GetSheet("Sheet1");
var patriarch = sheet.CreateDrawingPatriarch();
HSSFClientAnchor anchor;
anchor = new HSSFClientAnchor(0, 0, 0, 0, (short)4, 2, (short)6, 5);
anchor.AnchorType = 2;
var picture = patriarch.CreatePicture(anchor, LoadImage(#"D:\dev\Website/HumpbackWhale.jpg", templateWorkbook));
picture.Resize();
picture.LineStyle = HSSFPicture.LINESTYLE_DASHDOTGEL;
sheet.ForceFormulaRecalculation = true;
MemoryStream ms = new MemoryStream();
templateWorkbook.Write(ms);
TempData["Message"] = "Excel report created successfully!";
return File(ms.ToArray(), "application/vnd.ms-excel", "NPOINewFile.xls");
}
catch (Exception ex)
{
TempData["Message"] = "Oops! Something went wrong.";
return RedirectToAction("NPOI");
}
}

To the best of my knowledge, it isn't possible to assign an image object to a particular cell within Excel.
This is not a limitation of POI/NPOI, but rather the way Excel works: Pictures inserted into a spreadsheet just float (over the spreadsheet grid per se)...
At best one can make believe it is in the cell by ensuring that the size and position of the cell and of the picture match perfectly. There is a property of the picture (See "Format Picture" dialog, Properties section, also accessible through POI I'm sure) which allows to specify whether the picture will move and/or resize itself following actions on rows/cells surrounding it, but in the end, pictures remain a floating object very loosely related to a cell at best.
A common trick to assign a picture to a cell is by way of comments. The picture is then more formally bound to the cell but it is not shown as content but rather a comment data.
See for example this recipe. The idea is to use the background of the comment to be a color with a special fill effect which is the picture we wish to associate with the cell. Here again, there's got to be a way of achieving this programmatically with NPOI, but I cannot affirm this firsthand.

here's something you can try:
You see that property, anchor.AnchorType = 2;? try setting that to 0 or 3 and see what it does. In the C# (NPOI) port, 0 will fit the image in just one cell with option 0.
Here's some example code (used in a C# Asp.net project, just in case someone wanders here that needs it):
HSSFWorkbook hssfworkbook = new HSSFWorkbook();
HSSFSheet sheet1 = hssfworkbook.CreateSheet(sheetName);
//map the path to the img folder
string imagesPath = System.IO.Path.Combine(Server.MapPath("~"), "img");
//grab the image file
imagesPath = System.IO.Path.Combine(imagesPath, "image.png");
//create an image from the path
System.Drawing.Image image = System.Drawing.Image.FromFile(imagesPath);
MemoryStream ms = new MemoryStream();
//pull the memory stream from the image (I need this for the byte array later)
image.Save(ms, System.Drawing.Imaging.ImageFormat.Png);
//the drawing patriarch will hold the anchor and the master information
HSSFPatriarch patriarch = sheet1.CreateDrawingPatriarch();
//store the coordinates of which cell and where in the cell the image goes
HSSFClientAnchor anchor = new HSSFClientAnchor(20, 0, 40, 20, 3, 10, 4, 11);
//types are 0, 2, and 3. 0 resizes within the cell, 2 doesn't
anchor.AnchorType = 2;
//add the byte array and encode it for the excel file
int index = hssfworkbook.AddPicture(ms.ToArray(), HSSFPicture.PICTURE_TYPE_PNG);
HSSFPicture signaturePicture = patriarch.CreatePicture(anchor, index);

It's possible by three steps.
First, you should insert the picture
Second, add the ClientAnchor to the file to locate the picture to some cells
Third, resize the picture using tricky way otherwise it's hard to make a picture inside a cell

Related

How can I return an image as the output of a google sheet custom function?

I have a custom function in a google sheet. How can I return an image instead of normal data(for example number) as the output of this custom function ?
In fact I am going to read this image from image-charts.com site, which means that image-charts.com creates this image for us and gives us its url, and I actually want to be able to use this image that was created in a Google Sheet cell.
Can google sheet custom functions support image as the return value of the function?
Thanks in advance
Update
Found an answer to what you actually wanted. There is IMAGE (see reference), a function that adds an URL as an image into a cell (didn't know it existed). So you could do something like:
=IMAGE(GETCHARTURL(...))
Original workaround
You cannot add an image in a cell. You cannot show an image as the result of a formula either. The best What you can do is having a button that calls a Google Apps Script function that adds the images on top of the cells using Sheet.insertImage (reference).
I've made this little script that automatically adds the image on top of the cells that have the value img+ followed by the image url (eg. img+https://example.com/image.png):
const IMAGE_HEIGHT = 100 // Image height in pixels
function sameRange(a, b) {
return a.getGridId() === b.getGridId()
&& a.getA1Notation() === b.getA1Notation()
}
function addImages() {
const sheet = SpreadsheetApp.getActiveSpreadsheet()
const toChange = sheet
.createTextFinder(/^img\+https?:\/\//.source)
.useRegularExpression(true)
.findAll()
// Remove old image(s)
for (let img of sheet.getImages()) {
const range = img.getAnchorCell()
if (toChange.some(r => sameRange(r, range))) {
img.remove()
}
}
// Create new ones
for (let range of toChange) {
const url = range.getValue().toString().split(/\+(.*)$/, 2)[1]
const image = range.getSheet()
.insertImage(url, range.getColumn(), range.getRow(), 0, 0)
image.setAltTextTitle("Chart")
const w = image.getWidth()
const h = image.getHeight()
image.setWidth(IMAGE_HEIGHT*w/h) // Keep aspect ratio
image.setHeight(IMAGE_HEIGHT)
}
}
Then simply make a new button (a drawing with text) and set addImages as the assigned script.
I don't know your exact use case so you will probably need to modify the script to better fit your needs.
References
IMAGE function (Docs Editor Help)
Sheet.insertImage(url, column, row, offsetX, offsetY) (Google Apps Script reference)
Class OverGridImage (Google Apps Script reference)
Sheet.createTextFinder(findText) (Google Apps Script reference)
Class TextFinder (Google Apps Script reference)
Class Range (Google Apps Script reference)

Deleting an image in a Google Doc Table after placing and then resizing the image

I have searched and found code that first inserts an image into a Table in a Google Doc.The image however is larger than the desired image space--and so we have to resize the picture by first getting the dimensions of the inserted picture and then reinserting the picture into the table. The code seems to work well except I am left with two pictures the original sized picture and the scaled picture in the specified table location.
My challenge is that when I attempt to delete the first picture after getting the sizing information needed to scale the picture -- nothing ends up being saved. Here is the code:
if(celltext === "%PIC%") {
table.replaceText("%PIC%", "");
table.getCell(row, cell).insertImage(0, image);
sizePic(table,image, row,cell);
}
function sizePic(table, image) {
var cellImage = table.getCell(row, cell).insertImage(0, image);
//get the dimensions of the image AFTER having inserted it to fix
//its dimensions afterwards
var originW = cellImage.getWidth();
var originH = cellImage.getHeight();
var newW = originW;
var newH = originH;
var ratio = originW/origin
var styleImage = {};
var maxWidth = 200;
if(originW>maxWidth){
newW = maxWidth;
newH = parseInt(newW/ratio);
table.getCell(row,cell).clear();
}
cellImage.setWidth(newW).setHeight(newH).setAttributes(styleImage);
}
}
The problematic line is the table.getCell(row,cell).clear(); that even though it occurs after the image is inserted and before the sized image is inserted, it doesn't appear to work that way. Please note that my code is the result of looking at an existing post How to resize image on Google app Script.

Why these borders are showing when generating pdf using iTextsharp?

I am trying to generate multiple pdfs into a single pdf, which I have achieved by using itextSharp , but while generating them few thing I came across,which are pointed below:
I am getting visible cell border just under image that i inserted .
Bottom image taking a space which flicks the image into another page, with extra visible border.
Also the paragraph didn't align to center.
Apart from these I also need that the text(in paragraph)comes from view(this code is doing in MVC).
How to solve these errors? Below is my code:
public byte[] GetPDF(string pHTML)
{
byte[] bPDF = null;
MemoryStream ms = new MemoryStream();
TextReader txtReader = new StringReader(pHTML);
//Rectangle pagesize = new Rectangle(864.0f, 1152.0f);
Document doc = new Document(PageSize.NOTE);
string path = Server.MapPath("PDFs");
PdfWriter oPdfWriter = PdfWriter.GetInstance(doc, ms);
HTMLWorker htmlWorker = new HTMLWorker(doc);
doc.Open();
for (int i = 1; i <= 5; i++)
{
doc.NewPage();
PdfPTable table= new PdfPTable(1);
table.TotalWidth = 500f;
table.LockedWidth = true;
table.HorizontalAlignment = 0;
table.DefaultCell.Border = Rectangle.NO_BORDER;
Image imageTopURL = Image.GetInstance("Top.PNG");
PdfPCell imgTopCell = new PdfPCell(imageTopURL);
Paragraph p = new Paragraph("XYZ", new Font(Font.FontFamily.COURIER, 32f, Font.UNDERLINE));
p.Alignment = Element.ALIGN_CENTER;
table.AddCell(imgTopCell);
table.AddCell(p);
Image imageMidURL = Image.GetInstance("Mid.PNG");
PdfPCell imgMidCell = new PdfPCell(imageMidURL);
Paragraph p1 = new Paragraph("ABC", new Font(Font.FontFamily.HELVETICA, 29f, Font.ITALIC));
p1.Alignment = Element.ALIGN_CENTER;
table.AddCell(imgMidCell);
imgMidCell.Border = 0;
table.AddCell(p1);
Image imageBotURL = Image.GetInstance("Bottom.PNG");
PdfPCell imgBotCell = new PdfPCell(imageBotURL);
table.AddCell(imgBotCell);
imageTopURL.ScaleAbsolute(505f, 270f);
imageMidURL.ScaleAbsolute(590f, 100f);
imageBotURL.ScaleAbsolute(505f, 170f);
doc.Open();
doc.Add(table);
htmlWorker.StartDocument();
htmlWorker.Parse(txtReader);
htmlWorker.EndDocument();
}
htmlWorker.Close();
doc.Close();
doc.Close();
bPDF = ms.ToArray();
return bPDF;
}
You are telling the table that default cells shouldn't have a border:
table.DefaultCell.Border = Rectangle.NO_BORDER;
This means that PdfPCell instances that are created implicitly won't get a border. For instance: if you do:
table.AddCell("Implicit cell creation");
Then that cell won't get a border.
However: you are creating a cell explicitly:
PdfPCell imgTopCell = new PdfPCell(imageTopURL);
In this case, the DefaultCell is never used. It is very normal that imgTopCell has a border. If you don't want a border for imgTopCell, you need to define the Border of imgTopCell like this:
imgTopCell.Border = Rectangle.NO_BORDER;
Regarding the alignment: it seems that you didn't read about the difference between text mode and composite mode. Please read the documentation, for instance:
Why does ColumnText ignore the horizontal alignment?
How to right-align text in a PdfPCell?
and many other FAQ entries about text mode and composite mode.
You are making a number of newbie mistakes that can all be fixed by reading the documentation. You have too many questions in one post. Please create new questions if my answer didn't solve every single of your problems. I see at least two more questions in your post (your question should actually be closed with as reason "Too broad").
Update:
In your comment, you added the following code snippet:
table.AddCell(new Paragraph(data.EmpName, new Font(Font.FontFamily.COURIER, 32f, Font.BOLD)));
You want to center this text.
First, let me explain that you are using the AddCell() method with a Paragraph as parameter. This doesn't really make sense as the Paragraph will be treated as a Phrase. You can as well write:
table.DefaultCell.HorizontalAlignment = Element.ALIGN_CENTER ;
table.AddCell(new Phrase(data.EmpName, new Font(Font.FontFamily.COURIER, 32f, Font.BOLD)));
When you are passing a Phrase to the AddCell() method, you are
using text mode (the properties of the cell prevail over the properties of its elements), and
you are asking iTextSharp to create a PdfPCell.
In this case, iTextSharp will look at the DefaultCell and use the properties of that cell to create a new cell. If you want to center the content of that new cell, you need to define this at the level of the DefaultCell. All of this is explained in my answer to the following questions:
Why doesn't getDefaultCell().setBorder(PdfPCell.NO_BORDER) have any effect?
What is the PdfPTable.DefaultCell property used for?

Creating an image from a sprite sheet using the original images file name

Creating sprite sheets aka texture atlases rather than using many hundres of individual images is recommended everywhere. I have hundreds of images for a word learning game; but there are hundreds of words, no animation sequences. So having generated the data file and sprite sheet, i am looking for an example of how to create an image when needed from the original image file name (as stored in the sprite sheet data (lua code) file (both created with texture packer).
This much seems right:
local sprite = require("sprite")
local CN_70_tiles_corona = require("CN_70_tiles_corona")
local spriteDataCN = CN_70_tiles_corona.getSpriteSheetData()
local spriteSheet = sprite.newSpriteSheetFromData( "CN_70_tiles_corona.png", spriteDataCN )
before creating the sprite sheet, would create my image with something like this:
t1 = display.newImage(cnTiles[tileNO])
where cnTiles[1], for examples, is a value placed in an array from a sqlite table such as "sit_word100.png".
there is now an entry in my generate lua file below the 'getSpritSheetData' function something like this:
{
name = "sit_word100.png",
spriteColorRect = { x = 0, y = 0, width = 69, height = 69 },
textureRect = { x = 2, y = 2, width = 69, height = 69 },
spriteSourceSize = { width = 69, height = 69 },
spriteTrimmed = false,
textureRotated = false
},
i can see that ALL my image file names are now stored in the data to provide a way to refer to my image within the sprite sheet, but since i do NOT want to use "sprite sets", i can't find an example of just getting the one image when in eed it.
I want something that allows me to refer to my now spritesheet-ified image using the original image name. is this possible? e.g.
t1 = display.newImage(CN_70_tiles_corona.getSpriteSheetData(name = "sit_word100.png")
The easy way is to create sheets with TexturePacker and use SpriteGrabber to take the sprites your need.
It's an awesome add-on to Corona-SDK which can be found here:
http://developer.anscamobile.com/code/spritegrabber-spritesheets-two-lines

Putting several images next to each other in a pdfcell with itextsharp

I'm using itextsharp with a aspmvc project to create PDF versions of some of my pages. I have a very basic parser which takes simple html (plus some style info supplied seperately) and creates a pdf. When my parser encounts a table it loops over rows then cells, creating a PdfPCell for each cell. It then loops over child elements of the cell adding them to the PdfPCell. It's pretty basic but it's worked for me so far.
The problem is that I now have a table one column of which contains a number of icons, indicating different status for the row. When these images get added then end up one above the other in the pdf, instead of next to each other.
I create the image with
Dim I As iTextSharp.text.Image = Image.GetInstance(HttpContext.Current.Server.MapPath(El.Attributes("src").InnerText))
I have tried
I.Alignment = Image.TEXTWRAP Or Image.ALIGN_LEFT Or Image.ALIGN_MIDDLE
and adding a text chunk afterwards containing a space but it doesn't help. The only suggestion I have seen is to use I.SetAbsolutePosition(). I'd rather avoid absolute position but am prepared to try it - except I can't work out how to find the current X position to use?
Any help much appreciated.
Adam
To get the proper side-by-side flow, wrap the images/text in a Paragraph object, adding them one by one using Chunk and Phrase objects. Something (sorry, I don't do VB) like this:
PdfPTable table = new PdfPTable(2);
PdfPCell cell = new PdfPCell();
Paragraph p = new Paragraph();
p.Add(new Phrase("Test "));
p.Add(new Chunk(image, 0, 0));
p.Add(new Phrase(" more text "));
p.Add(new Chunk(image, 0, 0));
p.Add(new Chunk(image, 0, 0));
p.Add(new Phrase(" end."));
cell.AddElement(p);
table.AddCell(cell);
table.AddCell(new PdfPCell(new Phrase("test 2")));
document.Add(table);
EDIT: One way to add whitespace between the images. Will only work with images; if you try this with mixed text/image(s), they will overlap:
PdfPTable table = new PdfPTable(2);
PdfPCell cell = new PdfPCell();
Paragraph p = new Paragraph();
float offset = 20;
for (int i = 0; i < 4; ++i) {
p.Add(new Chunk(image, offset * i, 0));
}
cell.AddElement(p);
table.AddCell(cell);
table.AddCell(new PdfPCell(new Phrase("cell 2")));
document.Add(table);
See the Chunk documentation.

Resources