I am facing a very serious bug using graphael. Therefore, I want to change the procedure it uses to calculate the maximum value for the y axis. However, It's way to confusing for me, and I cannot find it. Can anyone help me to change that procedure?
Sorry, I don't have any experience with gRaphael, but since no one else has answered, I might be able to help you somewhat...
The code for gRaphael's LineChart is located here.
Normally, I would suggest overriding the function that calculates the y axis max value, but since that object is enclosed in a private scope, you will only be able to change the code, directly, through a local copy of that file.
I only skimmed the code, but was not able to find where in it the actual calculation was being done.
It calculates them through the .snapEnds() method in gRaphael core. If you want, you can expose the values to the linechart options using this method.
Related
I am using Jupyter notebook to run a large-ish program in steps. As part of the code - in order to get the graphs that I am plotting to be visible in non-scrolling windows - I am using:
%%javascript
IPython.OutputArea.prototype._should_scroll = function(lines) {
return false;
}
Which I originally found on stackoverflow.
I am also using:
plt.rcParams["figure.figsize"] = [16,12]
(matplotlib.pyplot as plt, as usual) in order to control the size of the output plots.
The data is read in and the code loops through it. In the section doing the plotting (all inside one loop) it is producing a number of plots at the right size, with the correct annotations, and then it will suddenly and apparently produce a valid diagram but reduced to postage stamp size. It will do this for a few plots - and then revert to normal size and then do the same thing again.
The above is the only code I am using to explicitly control plot sizes and both sit outside the loop. Inside the loop - and each time it is executed - there are multiple calls to plt routines.
It's almost as if the parameters in plt.rcParams are being over-written but since they are outside the loop, they shouldn't be shouldn't they?
Any thoughts on why this is happening? -and of course how to fix it. Can overplotting (which I am doing on some plots) have something to do with it? Should the javascript be modified?
Many thanks
OK, the more I look at it and try to create a MRE (see comments above), the more I come to the conclusion that the issue is something in the way that I am passing "stuff" between the calling routines and the library. As such it is an idiosyncracy of my code/system and probably not of wider interest. If something of general interst comes up I will post it here or in an appropriate spot.
========================================================================
That was my initial response last month, however having looked into this much further it appears not to be an issue with passing between the libraries and the calling program, as it also occurs in programs that don't call the libraries. It appears to be something in the way that rcParams interacts with Jupyter notebook as configured on my machine (which is a fairly basic configuration).
I am unable to take thisd further at the present time.
I am currently working on a project that uses the Techan.js library for producing financially-oriented charts (based on D3.js).
As of reading through the example shown here for creating a candlestick chart, I've managed to replicate most of the steps in my own code, but after extensive searching I still did not find an explanation for how candlestick.accessor() works. Is it a get method? A set method? I simply do not understand its purpose and how to work with it.
The developer also seems to use this in his draw function:
y.domain(techan.scale.plot.ohlc(data, candlestick.accessor()).domain());
From this, I can deduce that he's assigning something to the chart's y domain, but what is that? What does techan.scale.plot.ohlc(data, candlestick.accessor()).domain()) do? Does it create a whole new OHLC plot that it then accesses using the same accessor used before?
The API reference hardly contains any information explaining the accessor() method, and I can't figure out how it interacts with the chart, or a chart.
If someone has any experience with Techan.js, I'd like to ask for an explanation of the .accessor() method. Thank you very much.
I'm pushing parsed xml data to the values and labels for the nvd3 chart. For some reason, one of my discrete bar charts, the one under "Top 5 SIC by Comments" in the drop down menu, isn't doing what it should. The y-axis range is set to the minimum y value from all the points, so it makes all of the bars the same size. I've copied the settings from the other graphs I made, so I'm not sure what went wrong (I don't think it could be a typo, and my other discrete bar charts are working). I've tried changing the values in the xml file sample4.xml, but the sizes still stay the same. The only way that the bars, or rather the y-axis, reverts to its correct format, is when I manually change the number value to "900" in the controller itself, but I can't have this because I need the values to be pushed from the xml file. Is there a problem with the configuration that I'm missing? Or maybe there is a way to force the y-axis to set the max range value to the max value in the data set?
Here is my plnkr
I've tried researching online but I haven't found any instances of this bug in a forum. Any help would be appreciated.
Please try using api object provided by angular-nvd3 library to call it's updateWithData(data) method, each time you update the data. (if you update options too, you would call updateWithOptions (updatedOptions).
In your .html get an api object assigned. (make sure, you don't crate the object name-barApi inside your controller's scope beforehand, that's the mistake I did.) :-
<nvd3 options="optionsBar" data="barData" api="barApi"></nvd3>
In your drop-down change event, you would put call like :-
$scope.barApi.updateWithData(data)
where data is your dataobject.
Also refer the comment of [krispo commented on Sep 16, 2014] on following thread.
https://github.com/krispo/angular-nvd3/issues/37
I have looked at a lot of Q/A here on SO regarding similar (if not the same) question I have. Yet none had an answer I was able to understand.
I wish to input a series of GPS coordinates, and create a smooth curve that connects them all, and passes through ALL of them. Javascript is my preferred language and I have found this page
http://jsdraw2d.jsfiction.com/demo/curvesbezier.htm
It allows you to plot any number of points and when clicking the 'Draw Curve' button it does exactly what I want (except it is on html5 canvas whereas I want to use lat/lon values)
You can download the jsDraw2D source code here:
http://jsdraw2d.jsfiction.com/download.htm
The function in question is drawCurve() and it appears to calculate the points of the curve, creating a separate 'div' for each point as it goes along, while also appending them to the html page. I am presuming I need to get rid of the code for creating the html divs and instead add each point as it is calculated to an array or string. However, it is simply over my head (perhaps because it seems overwhelming and my understanding is not quite spot on).
I would post the code here, but it is pretty long, plus I am not sure how many other functions it calls/requires from the rest of the script.
The only other thing I can think of that needs to be considered is the +/- values in GPS coordinates. I am hoping that altitude changes would not effect the smooth line created too much, especially since it seems to create the new points so close together.
Any help in modifying that code would be greatly appreciated. If someone has some other approach, I am open to suggestions - however I would prefer a way that passes through ALL the input points (unlike some mathematical curve functions that do not)
Thanks!
I'm trying to figure out how to highlight a line (series) in Highcharts from an element that's not related to the Chart object in any way.
I went through the documentation, and don't really see a way of achieving this. I can get into the series elements using the series.get(id).
Seems like there are no methods that can be helpful - http://www.highcharts.com/ref/#series-object
Any ideas if that's even possible?
After a lot of digging and testing, I've managed to get this working - still not sure if this is the best way (probably not).
Chart.series.get(someId).graph.attr('stroke-width', '5')
Unfortunately, this is just getting into the actual DOM element and changing the value of the property of a single element, so if you need to change the stroke width, and the styles of the markers on this line, you'd have to loop through all elements, and apply changes manually.
UPDATE: Ok, there's a better way
But this is using the private API, so if the library changes thins, your code will not work:
Chart.series.get(someId).onMouseOver() and Chart.series.get(someId).onMouseOut().
This actually fires the defined hover-state.