I am creating a Step Line Chart with AmCharts v3.
Take a look at this chart for example.
(Apparently the community loves JSFiddle more than CodePen, but the later
handle ajax calls easier)
This chart represents the price of a product and how it changes among the time. It is possible that the product may be unavailable at a moment so its value is considered as zero.
I want to omit the balloon which displays the value on hover, only if the price is equal to zero.
I want to see if is possible to do it, but I couldn't find anything about it on the documentation.
EDIT:
I remembered something about gaps, I don't know how they work actually. But if I could set all moments when price = 0 as gaps, maybe that could be a workaround.
Related
I've been performing some research, in order to find the best approach to identify break points (trend direction change) in a dataset (with pairs of x/y coordinates), that allow me to identify the trend lines behind my data collections.
However I had no luck, finding anything that brings me some light.
The yellow dots in the following image, represent the breakpoints I need to detect.
Any suggestion about an article, algorithm, or implementation example (typescript prefered) would be very helpful and appreciated.
Usually, people tend to filter the data by looking only maximums (support) or only minimums (resistance). A trend line could be the average of those. The breakpoints are when the data crosses the trend, but this gives a lot of false breakpoints. Because images are better than words, you can look at page 2 of http://www.meacse.org/ijcar/archives/128.pdf.
There are a lot of scripts available look for "ZigZag" in
https://www.tradingview.com/
e.g. https://www.tradingview.com/script/lj8djt1n-ZigZag/ https://www.tradingview.com/script/prH14cfo-Trend-Direction-Helper-ZigZag-and-S-R-and-HH-LL-labels/
Also you can find an interesting blog post here (but code in in python):
https://towardsdatascience.com/programmatic-identification-of-support-resistance-trend-lines-with-python-d797a4a90530
with code available: https://pypi.org/project/trendln/
If you can identify trend lines then can't you just identify a breakpoint as when the slope changes? If you can't identify trend lines, then can you for example, take a 5-day moving average and see when that changes slope?
This might sound strange, or even controversial, but -- there are no "breakpoints". Even looking at your image, the fourth breakpoint might as well be on the local maximum immediately before its current position. So, different people might call "breakpoints" different points on the same graph (and, indeed, they do).
What you have in the numbers are several possible moving averages (calculated on a varying interval, so you might consider MA5 for five-day average, or MA7 for a week average) and their first and maybe second derivatives (if you feel fancy you can experiment with third derivatives). If you plot all these lines, suitably smoothed, over your data, you will notice that the salient points of some of them will roughly intersect near the "breakpoints". Those are the parameters that your brain considers when you "see" the breakpoints; it is why you see there the breakpoints, and not somewhere else.
Another method that the human vision employs to recognize features is trimming outliers: you discard in the above calculations either any value outside a given tolerance, or a fixed percentage of all values starting from those farther from the average. You can also experiment not trimming those values that are outliers for longer-period moving averages but are not for shorter periods (this gives better responsivity but will find more "breakpoints"). Then you run the same calculations on the remaining data.
Finally you can attribute a "breakpoint score" based on weighing the distance from nearby salient points. Then, choose a desired breakpoint distance and call "breakpoint" the highest scoring point in that interval; repeat for all subsequent breakpoints. Again, you may want to experiment with different intervals. This allows for a conveniently paced breakpoint set.
And, finally, you will probably notice that different kinds of signal sources have different "best" breakpoint parameters, so there is no one "One-Size-Fits-All" parameter set.
If you're building an interface to display data, leaving the control of these parameters to the user might be a good idea.
i am trying to make vertical axis labeled in indian ١،٢،٣ and plotted in Indian too , however it seems it has no meaning for computer , since there is no native encoding for arabic number , however in terms of english 0,1,2,3... you can do calculations no problem in that , the problem i must to show indian-arabic values
this line chart is done by google Visualization api , the last version 46.0 , and the lang is ar however the result is not as i aimed for , the vaxis should be in ١،٢،٣ and the plotted values
(This is a slightly modified answer to the duplicate question posted at stackoverflow.com/questions/46423807. Martijn Pieters, if you are paying attention, please delete that question instead of this one.)
There is a solution, but you'll have to use an undocumented feature, which will be documented at some point. You'll need to make this call sometime before you draw your chart.
google.visualization.NumberFormat.useNativeCharactersIfAvailable(true);
This works with material charts prior to v46, and also in classic charts starting with v46. See this example: https://jsfiddle.net/dlaliberte/6k8vdgz7/
You may see some problems depending on what formatting options you also specify.
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
So there seems to be an error when dynamically adding data to a hidden series in Highcharts.
Say I have two series on a chart that both update on the same interval of time. Say also that I'd like to ensure that neither of the two series have more than a certain number of points, therefore leading me to use the optional shift boolean during a series.addPoint() operation.
The problem I run into is that, if one of the series is toggled and made invisible for some time, when re-toggling that series, much of the data that should've been shifted is still present.
I've made an example fiddle of this (just toggle data1 in the chart legend for a few seconds and then re-toggle)
http://jsfiddle.net/mmuelle4/c00cLfs5/ (change funcToTest to see how various fixes don't quite give the "shift" look)
I'm using the latest version at the time of this post (Highcharts JS v4.0.4).
I think what I've uncovered is still an error that will need to be addressed by Highcharts, but I figured I'd ask the question - is there a better way to perform series length checking and data adding/shifting for multiple series than in the linked fiddle that would get around this issue? I can think of some clunky ones off the top of my head, but I thought I'd come to SO for some elegance :)
Link to bug on Github (for tracking): https://github.com/highslide-software/highcharts.com/issues/3420
You can workaround this issue by managing shift on your own. Simply store in some array all points and shift them there. Then call series.setData(array_of_points,redraw,animation) instead of series.addPoint(points,redraw,animation, shift).
In short:
when series is hidden use series.setData()
when series is visible use series.addPoint() with shift-param set to true|false
I want this highchart - http://jsfiddle.net/zPDca/ inside a popup. But if i decrease its width to lets say to 200 px, it dissapers. Any suggestions!
It looks like 251 px is the lower limit for the width.
This was probably a decision the developers made due to readability. Think about it:
This is a stock chart and it contains the "detail" view and a navigator view, you have export enabled and by default you are showing the buttons, the default selection buttons for zooming are also shown. Wouldn't this be really crowded for the user? Why not use a different kind of chart (standard highchart maybe) that shows latest data and gives user option to expand view. This would save a lot of space in the view.
Things you can try:
Remove the export buttons (you can write your own extension to still do exporting without useing the built-in buttons)
Remove the "Zoom" text
Change chart to be less "busy" overall
Having a data visualization is all about quickly seeing the data you need - not necessarily seeing all the options you may need in a tight space. If this chart is to be used for continuous monitoring you can strip it of all option settings but have it use the options set by the user in a "primary/setup" chart.
Look this example http://jsfiddle.net/zPDca/1/
It's working well.
If you take a look the reference you can see that it can be calculated by the containing element. So you just have to remove width from your chart as you can see on my example.
Okay I got the answer. Versions higher than 1.1.5 do not allow charts smaller than certain dimension. I do not know why. But I'm detouring right now by using version 1.1.5.