I have a Kendo UI scatter plot representing trade volumes over a time series. The chart works well, but now I need to add a vertical plot line on the x-axis (time) at a specific time, representing a price-fluctuation point. Is it possible to draw such lines at a specific x-axis value, along with a label or tooltip explaining the data details? I see plot bands, but that seems not useful here.
Thanks in advance for any hints/suggestions.
I could add a new line series with points at (time, 0) and (time, y), but I would like to see if there is a better/API way before I go that route.
Related
link : D3 Charting Tool: How to add label at right of target line (additional horizontal line) in column chart
I implemented the graph through this link.
The problem is that if there are multiple graphs and the y-axis values are different at the same height, if the horizon value is 10px, then 10px is output regardless of the y-axis range.
If i want to add horizontal lines according to the y-axis range, I'd like to know a solution.
I am using Dimple.js to plot several data series and I need to add a candlestick or hi/lo series on to my existing chart. After some analysis, I have found two possible approaches to do this:
1) Use the floating bar option in Dimple.js. Since the "widths" (heights on the chart, but widths for the floating bar) would be all different, I would need a different data series for each candlestick. This feels like a hack, but the one advantage is that this would be using Dimple to do all the rendering. I would probably not go this route unless some had a thought on how to make this less of a hack.
2) Drop down to D3 to draw lines between the points. I can use Dimple.js to graph both the top and bottom elements of the candlestick, then use D3 to draw the line between the points. I would do a selectAll() on one of the series, and then draw a path to the related point in the other series.
If there are other suggestions on an approach, please let me know. Thanks!
You can use this example to build candlestick charts using d3.js
In Qlikview 11 I managed to set up (amongst others) a nice scatter chart without any major problems. Now I would like to be able to zoom into a region in that chart. Intuitively this could be accomplished by selecting a rectangular region with the mouse. Incidentally this works fine in "regular" line or bar charts. The new x and y axis regions correspond to the selected rectangle. However this does not happen with my scatter chart. I suspect this has something to do with the way dimensions are handled in scatter charts. For easier understanding I appended to screen-shots of the status quo - or how I don't want it to be.
Full chart with selected region http://img801.imageshack.us/img801/4873/6ccc.png
Chart displaying only the selected data http://imageshack.us/a/img138/9053/kck5.png
From what it looks like, I would guess that the scatter plot has hard coded axis max and mins. Check the "Axes" tab under chart properties, and uncheck the scale boxes. That should allow the chart to zoom in.
I have a line graph using jqPlot with one series and several data points across it and smoothed lines. I'm using the Cursor plugin to show crosshairs and a tooltip to show x and y points.
Is it possible to have the cross hairs follow the line on the series? So the horizontal line would fix to the y position of the line and not following the mouse. I see you can get the x/y position of each data point but not of the lines inbetween points.
Thanks
If you are using the built in smoothing options the smoothed data points are stored at:
plotObj.series[0].renderer._smoothedPlotData
with pixel locations at:
plotObj.series[0].renderer._smoothedData
So I am using jqPlot to display distance (y-axis) over time (x-axis) in a simple line graph.
However, while I have actual distances as the underlying data used to position the points, I'm not interested in displaying those distances on the y-axis.
Instead, there are a series of landmarks at given distances, that I want to appear on the y-axis as a 'tick' next to the appropriate point for the distance to that landmark. That way the line appears to "pass" each landmark as it travels upward.
Currently I'm "faking" this by hiding the ticks and putting a manually-created series of labels next to the graph. This works well enough, but I had to disable vertical zooming because if the user chose to zoom in, the labels would not match up with the actual distances. My users would really like to zoom in vertically, however, and I want to allow them to.
Therefore, does anyone know of a way (a plugin or similar) that would allow me to associate custom labels with given tick marks in jqPlot, that will match up nicely and respond to zooming? It would be necessary to hide some of the landmarks if the graph is zoomed out too much, so that would have to be a feature.
Alternatively, if someone knows of a "zoom event" that passes in the min and max y values, I could probably recreate my manual labels with that data, so let me know if you know of a way to get that information. I haven't been able to find one.
I would need to see a bit of your code to customize it to the distance but to start with you could label the ticks and it will display over the size of the chart.
axes:{yaxis:{ticks:['DiscanceA','DiscanceB', 'DiscanceC', 'DiscanceD', 'DiscanceE'],
renderer: $.jqplot.CategoryAxisRenderer,},
Let me know how it goes and if you have any code lets see it!