It is very simple question, but I am stuck for 2 days and starting believe in magic.
Well, I just need to simple rotate Y axis label vertical. jqPlot docs and examples say that I have to use:
labelRenderer: $.jqplot.CanvasAxisLabelRenderer
I did, but it still does not work. I even tried to copy-paste jqPlot example to my project and it does not work properly as well! And yes, I connected canvasAxisLabelRenderer.js and canvasTextRenderer.js. Here, please check my jsfiddle: http://jsfiddle.net/gu3Cr/5
UPD:
Just noticed, that it doesn't work only at Chrome (ver. 34). At mozilla firefox 28 it works. But it's still a problem, because jqPlot examples work properly at Chrome.
Your example code is fine, but your JSFiddle has an issue with script references. In the Chrome console I see this:
Refused to execute script from 'https://bitbucket.org/cleonello/jqplot/raw/e8af8a37f0f14ea1e8c630ecfe6f1b1933794036/src/plugins/jqplot.canvasAxisLabelRenderer.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.
I removed that reference and added a link to http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.canvasAxisLabelRenderer.min.js and it works OK. See modified example here:
http://jsfiddle.net/LuQh7/
Related
We use in our project d3.js and the "gradient that follows a stroke" like in this example:
http://bl.ocks.org/mbostock/4163057 but it doesn't work as expected in Firefox. Then we discovered - it is only a problem in firefox... To visualize the problem and for easier understanding I changed the draw points in the example and these are the results:
Any suggestions for a workaround?
When displaying a box graph, pygal displays values outside of the normal zones. You can see the example on their site as well:
You'll notice that no values are above 16,000 or below -4000 (in fact none are below 0). It just doesn't display properly.
This is posted for anyone who doesn't look on the website for answers (which I don't usually).
There is a solution to this problem, and it is not resolved completely yet - but there is a quick fix.
In the meantime, to make it work (as expected) instantiate the object like this:
box_plot = pygal.Box(mode='extremes')
You'll notice that the above example will be solved, and in fact to my knowledge this is the only way to make box plots work.
To follow the issue: Link to the issue request
I am working on animating a line graph using d3.js, and have been closely following this example. The code I have written works just like the example...but the bug I am trying to fix is one that is also unfixed in this example. (So going forward, just follow that link to see the bug for yourself)
In Chrome and IE10, the chart works just as it is supposed to. However, in Firefox, the line does not just draw itself from left to right. Instead, the page loads with the line already displayed, then the line erases itself from left to right, and then finally draws itself (again) from left to right like it should have done in the first place.
Also notice that the line drawing is twice as fast on firefox as the other browsers - this means that the issue is with the transition itself: the transition of the stroke-dashoffset property is handled differently by firefox and the other browsers. Specifically, if we remove the transition from the equation, the main difference becomes evident: With stroke-dashoffset set to totalLength, Firefox displays the entire path, as opposed to none of it, like the other browsers do.
So my question is: is this a bug, or is this bad form on my (and duopixel's) part? If the former is the case, does anybody know a workaround or a fix? If the latter, I would be very grateful if you could show me the correct way to do this!
My brain is overflow about this issue, so let me share my frustration in order to look for someone having the same experience and, luckily, finding a solution.
The thing is the following:
http://jsfiddle.net/w4d2E/
In chrome, percentages work fine, but when trying the same in Firefox (latest version) the content div is not expanding horizontally and vertically anymore.
I've analyzed every similar question over here, but I can't find any valid answer.
Thanks in advance
P.S.: I've tried to use block display instead of the 'box' one in the 'content' layer, but still having the same behavior.
You're using XUL box layout. I suggest not doing that. -moz-box is NOT CSS flexbox layout, as you seem to think.
The problem here is display: -moz-box for body. If you remove it everything works fine. It appears to be a bug, so I suggest filing a report in the bug tracker.
I have been trying out the Susy plugin for Compass (SASS), but I noticed that it isn't working as intended for me.
I took the index.html and screen.scss from the official Susy tutorial, compiled the SCSS and put it up on my server. As you can see it looks just like it's supposed to (on all browsers I tested it on):
What I did next was the following:
Copy the <article> in the <div role="main"> and paste it six times
In screen.scss, change the column-span (div[role="main"] > article) accordingly: from #include columns(6,9); to #include columns(1,9);
But now those new elements don't align to the grid at all, they are off by a clearly visible space. I tested this in recent versions of FF, Safari and Chrome, and only FF seems to display it correctly. Screenshot is from Chrome:
I also uploaded the source for everyone to inspect here.
Is this a general problem with Susy that the grid isn't correct or am I doing something wrong? If the first, does anybody know a workaround? I also tried with percentages and pixels, but neither worked.
Susy isn't just another grid system like all the others. It was designed to fulfill a very specific purpose: grids that are fluid on the inside. The units you use to create the grid are applied to the container, not to each column. Everything inside is built with percentages. What you are seeing is normal. It's true of all fluid grids, because of sub-pixel rounding. It's not a bug, it's a part of building responsive web sites.
If you need pixel-exact grids, Susy is the wrong tool for you. It all depends what you are trying to build.
Re-size your browser to see how it works. You'll notice the grids snapping-to and floating within a few pixels of their guides, but the grid stays intact and never triggers the horizontal scroll-bar.
Cheers!
-e