DevExtreme Exporter prints blank page - devexpress

I am using DevExtreme dxExporter to export charts to pdf/png/svg. I followed all the steps they provided here, from Deploy a Server up to Tune dxExporter.
Everything looks fine, my PhantomJS is ready(perfoms as a server to allow me to use the client-server model), see below:
The print and export icons are also showing as expected :
Now the problem is, when I try to export a chart to pdf/png/svg, the browser downloads the desired file, but it is blank, as a results it fails to open.
if you have experienced this before, can you please tell me what could be the problem and how to fix it.
Here is my chart container and dxExporter div:
<div id="container" style="width: 100%; height: 440px;"></div>
<div id='exportMenu'></div>
Here is my dxExporter code:
$("#exportMenu").dxExporter({
sourceContainerId:"#container",
serverUrl: "http://127.0.0.1:3003"
});
PDF results:

You have sourceContainerId option in your code, but in last versions this option has name sourceContainer. Try to replace it and maybe this will help you.

Related

NEXT Image not Loading in production

I am using NEXT to build my web app. During my dev server, everything runs smoothly and all images appear as expected but when I run next build and then next start the image disappears in the dev server.
Not sure why this is happening can someone help me?
My folder structure is as shown below:
- public
---- pictures
------ icons
-------- iphone
---------- phone1.png
And here's how I put it in my component:
<div className={classes['stack-phone-v1']}>
<Image
alt={'phone-image-1'}
height={567}
width={284}
src='/pictures/icon/iphone/phone1.png'
/>
</div>
Make sure to follow the casing as it is, the fileName must be typed exactly similar to what it is and that would very likely solve your
issue. No extra whitespaces, no additional symbols only file name as
it is.
On following up with other forums, I realized this was a very silly mistake from my side. While running images in dev server the casing doesn't matter, my image was iphone.PNG and I was reading it as iphone.png.
This is really important as it goes undetected in dev server and in production it won't load. I have seen a huge github thread for the same and suspect that this is the cause:
Generally when you see your files getting loaded but some of them not loading make sure all of them match casing exactly as they are named. Changing the import statement resolved my error. I hope this goes helpful to someone who may face same issue in future.
I just changed:
src='/pictures/icon/iphone/phone1.png'
to
src='/pictures/icon/iphone/phone1.PNG'
as original filename was phone1.PNG
I had a similar issue and am able to solve it by not leaving empty space " " at the end of the image path ` {
name: 'Sunday Afolayan',
imagePath: '/assets/team/Sunday-Afolayan.png ',
title: 'Member'
}`
and am able to solve it by removing the empty space at the end of .png
` {
name: 'Sunday Afolayan',
imagePath: '/assets/team/Sunday-Afolayan.png',
title: 'Member'
}`
Try install npm i next-images and
add next-images to next.config.js file.
const withImage=require('next-images')
module.exports = withImage()
change from src='/pictures/icon/iphone/phone1.png' to src='pictures/icon/iphone/phone1.png'

Polymer 1.0 google-analytics-query: Nothing is showing up

I am trying to develop a dashboard for my client where I have to use several google web components. My first approach is to show up a simple analytic query for which I am using this:
<google-analytics-query
ids="ga:xxxxxxxx"
metrics="ga:sessions"
dimensions="ga:country"
sort="-ga:sessions"
start-date="2015-10-01"
end-date="2015-10-31"
max-results="5">
</google-analytics-query>
But nothing is visible!
I am referring to https://elements.polymer-project.org/elements/google-analytics?active=google-analytics-query
What's going wrong?
UPDATE
I also tried the following code to render google-analytics-chart output ended up with a big white box.
<google-analytics-chart
type="area"
ids="ga:88814676"
metrics="ga:sessions"
dimensions="ga:date"
start-date="2015-10-01"
end-date="2015-10-31"
max-results="5">
</google-analytics-chart>
This question as also asked on the Github repo for the <google-analytics> element. You can see the answer there:
https://github.com/GoogleWebComponents/google-analytics/issues/29#issuecomment-157367824
The gist of the problem: using the <google-analytics-chart> element require authentication via the <google-signin> element in order to work.

Browser Displaying Plain Text

When I view the site www.redfuryrevenge.com with a browser, I see only plain text, as if there is no CSS. When I view it locally using Macrabbit Espresso preview, it looks fine. I tried finding the error using Firefox console, debugger, etc., but nothing pops up for me.
I've never seen anything like this (except for a missing CSS file reference).
Please advise.
it seems that for some reason you need to put the full root.
You can fix it adding the ./
Use the following syntax:
href="./css/style.css"
I've tried it and it should fix your issue

Python: display IFrame

I am trying a sample code that is supposed to use IPython and display a html file.
Here is part of the code that is relevant to my question:
from IPython.display import IFrame
from IPython.core.display import display
display(IFrame('myfile.html', '100%', '600px'))
But when I run it, nothing shows up. What could be the reason?
Do I need to install something related to d3 or d3js?
Your code works in a Jupyter notebook (it doesn't display anything when tested in a terminal running IPython) - It will not display anything if the file is empty or contains malformed HTML. If the file doesn't exist you'll see a 404 displayed in the IFrame.

How to use PDF open parameter (e.g. fitH) in Chrome/ FireFox browser?

http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf
There are a set of open parameter specify how the viewer should open the pdf . However, with the Chrome and firefox browser's default viewer , it does not work
<object id = 'zoomPage' type='application/pdf' data= '1.pdf#view=fit'><p>The PDF can not display</p></object>
I have tried the fit which I would like the pdf fill the object. If there is no parameter support , are there any workaround ? I tried a lot of approach but none of them work. For example, I also tried using iframe instead of object. However, the content does not resize. Thanks
<iframe src="1.pdf" width=1300 height=3300></iframe>
Searching a solution for a problem very similar to yours, I found an interesting thread on forum.asp.net. http://forums.asp.net/t/1877403.aspx?Issue+with+embedded+pdf+object+in+chrome+browsers
At the end of the page, there is a workaround by a user working smoothly in Chrome. That seems to solve the problem.
Here it is an example:
<iframe src="/Downloads/MyPdfDocument.pdf#view=fitH" width="700" height="880"></iframe>
For users fighting with http://pdfobject.com/ -> "pdfobject.js" like me, you can change few lines of code on both minified and develop version of pdfobject.
Find:
c.innerHTML='<object data="'+a+'" type="application/pdf" width="'+i+'" height="'+z+'"></object>';return c.getElementsByTagName("object")[0];
and change with this line of code:
c.innerHTML='<iframe src="'+a+'" width="'+i+'" height="'+z+'"></iframe>';return c.getElementsByTagName("iframe")[0];
Hope this helps.
This post is quite old, but nowadays you can put #view=fit on the end of an iframe's src URL to make sure the PDF opens a page to fit within the iframe.

Resources