I'm trying to capture a particular element on a web page using PhantomJS. Using getBoundingClientRect(), I'm able to clip Off the unnecessary elements(for which the entire page gets rendered and then clipped). Now I'm to trying to focus and capture a particular canvas component and store it in an image file. Once base64 string is obtained, how do I save base64 string as an image in an image file without the aid of any utility like casperjs? The below code doesn't work for me.
img = chart1.canvas.toDataURL();
ext = img.split(';')[0].match(/jpeg|png|gif/)[0];
data = img.replace(/^data:image\/\w+;base64,/, "");
fs.write('myChart.png', data, 'w');
Related
I am able to convert HTML to PDF using syncfusion.
The issue I have is it doesn't obey the font sizes
var htmlText = "<html><head><style>body{font-size:50px;}</style></head><body>Hello</body></html>";
var convertedHtmlDocument = ConvertFromHtml(htmlText);
var ms = new MemoryStream();
var fpath = AppDomain.CurrentDomain.BaseDirectory + "myfile.pdf";
SaveToFile(convertedHtmlDocument, fpath);
ms.Dispose();
It doesn't matter if I make the font size in the CSS 50 or 5, the font comes out the same size.
I also tried (same issue):
var htmlText = "<html><head><style>.myclass {font-size:50px;}</style></head><body><div class="myapp">Hello</div></body></html>";
Exporting the above 2 to an .html document behaves as the syntax suggests.
If I change my CSS to use table then it works, but I want to have a single font size for the document, not just the table
var htmlText = "<html><head><style>table{font-size:50px;}</style></head><body>Hello</body></html>"; //this works
What am I doing wrong?
We have checked the reported issue with different font size but it is working properly on our end. We have attached the sample and output for your reference.
Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/WPF1621828031
Output: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Output259867595
If still you have facing the issue, we request you share the modified code sample, input html text and product version ,screenshot of the issue to check this on our end. It will be helpful for us to analyse and assist you further on this.
I am trying to grab this image (https://www.cpc.ncep.noaa.gov/products/predictions/814day/814temp.new.gif) but everything I have tried hasn't worked.
This is my latest attempt that didn't work....
To save the GIF image from the webpage, use requests.get(<URL>).content directly. For example:
import requests
url = (
"https://www.cpc.ncep.noaa.gov/products/predictions/814day/814temp.new.gif"
)
with open("814temp.new.gif", "wb") as f_out:
f_out.write(requests.get(url).content)
This saves the file 814temp.new.gif
I want to display an image depending on parameter called "ca_code" on dashboard.
All the images are in a repository of my current theme ( I know that you can also upload images to server, must be easiler but I need to keep this), here's an example of an image path:
D:\pentaho\pentaho-8-2\pentaho-server\pentaho-solutions\system\common-ui\resources\themes\sapphire\img_project\CA120.jpg
Here, 120 is a ca_code. I get this ca_code as variable by query component.
Here's what I tried on Post Fetch of query component:
function f(ca_code) {
var ca_code=ca_code.resultset;
var img = '<img src="../common-ui/resources/themes/sapphire/img_project/CA'+ca_code.resultset+'.jpg/content"/>';
var img_default='<img src="../common-ui/resources/themes/sapphire/img_project/CA000.jpg/content"/>';
document.getElementById('ca_logo').innerHTML=img;
}
And it doesn't work, think it is the path prob.
When I used HTML on Layout Panel, the path was fine, the image was displayed but I can't do on HTML because I need variable ca_code, I want to do it on Query Component - Post Fetch.
And also, how to check if the image exists ? If it doesn't exist, I want to display img_default.
Any help would be nice !
I am using HtmlUnit to download URL and the webpage is using lazy loading (I think) to load some of the images. Which settings should I use in HtmlUnit so that I can get those images.
For example, this is one of the URLs I am trying to download-
http://www.ebay.com.au/sch/i.html?_from=R40&_trksid=p2050601.m570.l1313.TR10.TRC0.A0.H0.Xiphone6s.TRS0&_nkw=iphone6s&_sacat=0
The product images (after first few) have dummy src value-
As you can see the src tag has dummy value and actual image url is stored in imgurl attribute. I think the webpage uses some javascript to change the src attribute by correct value once we scroll down.
This is my sample code-
webClient = new WebClient(BrowserVersion.FIREFOX_38);
webClient.getOptions().setActiveXNative(false);
webClient.getOptions().setAppletEnabled(false);
webClient.getOptions().setDoNotTrackEnabled(true);
webClient.getOptions().setPopupBlockerEnabled(true);
webClient.getOptions().setPrintContentOnFailingStatusCode(false);
webClient.getOptions().setThrowExceptionOnFailingStatusCode(false);
webClient.getOptions().setThrowExceptionOnScriptError(false);
webClient.setCssErrorHandler(new SilentCssErrorHandler());
Page page = webClient.getPage(url);
I have tried the following-
1) Increase window height-
webClient.getCurrentWindow().setInnerHeight(60000);
webClient.getCurrentWindow().setInnerWidth(60000);
2) Try to scroll down after page is downloaded
webClient.getOptions().setJavaScriptEnabled(true);
webClient.getOptions().setCssEnabled(true);
webClient.waitForBackgroundJavaScript(10 * 1000);
HtmlPage page = (HtmlPage) webClient.getPage(url);
page.getBody().type(KeyboardEvent.DOM_VK_PAGE_DOWN);
Thread.sleep(3000);
String html = page.asXml();
But so far, I have not been able to get the correct src URL.
If anyone has successfully fixed this lazy loading issue, please suggest some workarounds.
thank you!
I am using wkhtmltopdf to convert html to pdf. I am using mvc 4. I was able to convert html to pdf. The only problem I have is that images do not render. There is small rectangle where image should appear. I have my images in database so when I get html string in my controller this is how image is shown right before I pass this string to converter:
<img src="/Images/Image/GetImageThumbnail?idImage=300" alt=""/>
So I am thinking that this approach is not working becuase I pass string to converter so image cannot be rendered. Any ideas how to solve this problem if images are in db?
I solve a similar issue by replacing src from src="/img/derp.png" to src="http://localhost/img/derp.png". I get the host part from the request that my Controller receives.
// Here I'm actually processing with HtmlAgilityPack but you get the idea
string host = request.Headers["host"];
string src = node.Attributes["src"].Value;
node.Attributes["src"].Value = "http://" + host + src;
This means that the server must be also be able to vomit images directly from URLs like that.
I guess it could be done with string.Replace as well if your HTML is in a string
string host = request.Headers["host"];
html = html.Replace("src=\"/", "src=\"http://"+host+"/"); // not tested