I am having trouble with a "Print" option in highcharts.js (using Firefox browser). Since the background it initially gave me was black, I added an option
chart: {
backgroundColor: 'transparent',
},
which solves the initial problem. However, my plotbands still remain black.
Here is a fiddle example.
http://jsfiddle.net/1qr8ousa/1/
Related
To visualise a large amount of data points +9000 markers I am switching from Plotly.js 'scatter' type to 'scattergl'.
I use react-plotly.js, and the change from 'scatter' to 'scattergl' almost works. Everything is rendered fine except the markers itself. The axes, hover indications, zoom controls, ... all work.
The screenshots show the difference. Documentation about scattergl is hard to find, but am I just missing some gl specific configuration?
My code to calculate the traces:
const plotData: Partial<PlotData> = {
type: 'scattergl',
mode: 'lines+markers',
x: [...],
y: [...],
};
After a long bug hunt, the solution/bug ended up being a z-index fight. I rendered the plot inside a Leaflet popup which had a canvas z-index definition set. Overriding this solved my render issue.
A Firefox change broke some of my background/border images. See this issue for more details: CSS - New Firefox-release doesn't show Border-Image anymore. When I fixed this issue by adding border-style: solid my text now displays a white/gray background behind it. Any idea why this might be happening. See my image on Chrome (how it is supposed to look) and then on Firefox.
Chrome:
Firefox:
Here is the jsfiddle link: http://jsfiddle.net/nirodhasoftware/offuhxao/1/
You need to draw a background too.
From pseudo or from element itself :2 examples to tune to your needs.
pseudo:
background:#5099D6;
background-clip:padding-box;
element:
background:url(http://www.rwe-uk.com/static/ichat_with_css3/speech_bubble_left_2.png) center / 300% 150%;
background-clip:content-box;
I am using "wkhtmltopdf" in order to print an html report.
This html contains a pie-chart jquery chart.
This html works perfectly fine.
In the other hand the printting seems to go alright buth when i check the ouput pdf the pie charts leaves some kind of circle around the chart. As you may see in the image.
evidence http://imageshack.com/a/img844/5310/2chv.png
Please,
does somebody knows how to avoid this circle from appering?
Thanks a lot in advance.
I did not solved it but i got and improvemente by changing the donut chart for a pie chart.
And also by reducing the margins between the sections of the chart.
stroke: { color: '#fff', width: 0}
I'm looking for a way to set an image to the 100% height of the browser window (with a small padding at the bottom), centred on the page.
I've set up an example in codepen, which works great in Chrome and Safari, but not Firefox, where the image shows at full size. What am I missing?
http://cdpn.io/sHJhl
.photo-bkg also needs its height set:
.photo-bkg { height: 100%; }
Here's a working fork of your pen.
In Kendo Area chart, if you enable/disable the "stack" option, you'll see that the series fill color is semi-transparent, by default. How do I make it a solid color?
PS I do not want to provide a custom series color, because my data is generated remotely, dynamically. I am happy to use the default colors, but since I'm stacking the series, I would like those colors to be solid so that they match the legend colors.
Thanks you in advance.
Just found that the correct setting to control the level of transparency is "opacity", set within seriesDefaults scope:
seriesDefaults: {
type: "area",
stack: true,
opacity: 1
},