Please find attached image with highlighted markers. Is this functionality possible with arction lightning chart js. Chart needs to have the ability to draw multiple custom vertical lines and on moving custom lines the marker highlighted in yellow needs to update its position and delta value.
For the most part should be functionally possible.
The vertical lines (red, blue, green, etc.) with ConstantLines.
API: https://lightningchart.com/lightningchart-js-api-documentation/v3.4.0/classes/constantline.html
Example: https://lightningchart.com/lightningchart-js-interactive-examples/examples/lcjs-example-0701-bandsConstantlines.html?theme=darkGold&page-theme=dark
The horizontal lines with SegmentSeries. Note that dashed line style is not available as of yet.
API: https://lightningchart.com/lightningchart-js-api-documentation/v3.4.0/classes/segmentseries.html
Texts inside series area with UITextBoxes.
Example (UI positioned in axis coordinates): https://lightningchart.com/lightningchart-js-interactive-examples/examples/lcjs-example-0026-temperatureAnomalyChart.html?theme=darkGold&page-theme=dark
If this is for a commercial use case I would strongly suggest leaving a general inquiry at our web site. I will not be clarifying or extending this answer in Stack Overflow.
Related
I've developed an application to support drawing something like lines or points and adding some tags on the map using OpenLayers 3.
Many existing functions in OL3 enable me to draw and modify something.
But, when I select something I drew, I felt the need of a snapping function to make me select them more easily.
Unfortunately, current OL3 supports the snapping only for the drawing and modifying, like below:
var draw = ol.interaction.Draw({features: some_features});
var snap = ol.interaction.Snap({featrues: some_features});
map.addInteraction(draw);
map.addInteraction(snap);
Actually, I found that the snapping works by replacing ol.interaction.Draw to ol.interaction.Select, because I can select something I draw if I clicked points apart of them. But, the mouse pointer did not snap to them.
So, How can I implement select interaction with snapping function in OL3?
Added some codes to explain details.
See the link: https://jsfiddle.net/keltpower0/sej6z2q4/1/
After you draw some lines, you should click the very point where lines are placed if you select those lines.
I want to more easily select those lines with snapping function, like, if I move the mouse pointer near lines, the pointer "automatically" snap to the lines
Select with snapping sounds a bit weird to me. What about using the hitTolerance option of the select interaction ?
I'm using Google Charts line chart and I'm looking to create the effect where focus is put on the point that corresponds to the horizontal position of the cursor.
I'm currently using the line chart with only 3 options set: Title, Width and Height. At the moment, the user must place their cursor directly on top of the data point which sits on the line that has been drawn in order to see the tooltip/data for that point.
I'm wanting to give the user an experience more like that found here:
https://au.finance.yahoo.com/echarts?s=BHP.AX#symbol=BHP.AX;range=1d
...where the user does not have to place their cursor ON the line to focus the data point, they simply need to move their cursor horizontally and the point that corresponds to the cursor's position on the x-axis is focused.
Has anyone been able to achieve this, either through options settings or custom code?
Cheers
There is a chart option that does what I believe you are looking for:
focusTarget: 'category'
If that alone doesn't work, check the tooltip.trigger option.
I'm currently working on a Polar Chart that sits on top of the Google Map API. When you click a segment it zooms in, the polar chart disappears, and it shows the individual points within that segment. Here's a preview of it so far:
Everything works as expected from a technical point of view, I just need to make a couple of modifications to make it more useable:
1) Is it possible to get it so a user can click anywhere within the segment to trigger the next stage. At the moment you have to click the blue areas meaning it's quite tricky to click the smaller portions, especially when they're overlaid with labels.
2) In the example above, you can see the y-axis labels are all a bit squashed when nearer the centre. Ideally they'd be centred within the middle of the segment. Is it possible to position them in the centre of each segment?
Any help appreciated on this. I've gone through pretty much every option in the documentation so am suspecting I need to go one step further and maybe look at modifying the DOM directly.
Thanks in advance :)
I'm using the google charts library to make some interactive scatter plots. And I cannot find is whether you can have symbols other than circles as "markers" ? As far as I can see it was possible with the previous obsolete version of google charts. But is it impossible with the current one ?
Scatter chart "playground":
https://code.google.com/apis/ajax/playground/?type=visualization#scatter_chart
Currently (as of July, 2013) there is no way to do this within the chart options. You have a choice between circles and no markers, and that's it.
You could go through the code and change the SVG using javascript, changing the circles to rectangles, and manipulating the coordinates appropriately (or drawing paths, or whatever you'd like). That's really the only way to do it.
Edited to add:
Additionally, you could set a fill for the circles themselves using javascript, and make the fill any shape you'd like.
You can do it with the help of image charts. You can change the color and shape of the markers using this.Refer this link. An example for the different shape markers
Click here to see this. For more google charts related queries take a look at this jqfaq.com
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
JavaScript Chart Library
We are looking for a javascript charting component with following features:
mixed line graphs and column graphs
line graphs have to be stepped (no interpolation)
column charts must grow downwards from the top of the chart
multiple value axis
zooming and sliding
thanks!
Check - http://www.jqchart.com/
All these features are supported by amcharts.com:
1) mixed line graphs and column graphs:
http://amcharts.com/javascript/column-and-line-chart-mix/
2) Stepped line graph:
http://amcharts.com/javascript/step-line-chart/
3) I have no example of columns from top, but amcharts supports reversed value axes too, so you can simply have this example by changing graph type to "column" in this example:
http://amcharts.com/javascript/line-chart-with-reversed-value-axis/
4) multiple value axes:
http://amcharts.com/javascript/line-chart-with-multiple-value-axes/
5) zooming and sliding:
http://amcharts.com/javascript/line-chart-with-scroll-and-zoom/
All the features you mentioned can be combined in one chart, of course.
Take a look at TeeChart Javascript too.
Download it here: http://www.steema.com/download/html5
Find the online demos here:
http://www.steema.com/files/public/teechart/html5/v2012.06.1.1/demos/
mixed line graphs and column graphs
Supported. Just add the series and some values.
line graphs have to be stepped (no interpolation)
Supported. The Line series can be smoothed, but it isn't by default:
http://www.steema.com/files/public/teechart/html5/v2012.06.1.1/demos/series/line/linepoint.htm
column charts must grow downwards from the top of the chart
Supported. You can just invert the left axis. In the following example there's a checkbox for it:
http://www.steema.com/files/public/teechart/html5/v2012.06.1.1/demos/series/bar/bar.htm
multiple value axis
Supported. Find here an example:
http://www.steema.com/files/public/teechart/html5/v2012.06.1.1/demos/axes/multiple_axes.htm
zooming and sliding
Supported. Draw the rectangle with the left mouse button (from top-left to bottom-right) to zoom in the drawn area. Draw the rectangle on the other direction to zoom out (from bottom-right to top-left). Scroll dragging with the right mouse button.
If you find a problem with any of them, don't hesitate to let us know.