I'm currently developing my iOS app and want to depict a graph whose shape is a circle like pie chart, but its radius is dependent on each specific values. Sorry I don't know what the name of such chart is, but I'm sure every sane baseball fans or any sports fans I think should have ever seen such chart. For example, if a team's batting average is the best in the league which consists of 5 teams, its radius is length 5 (or any other length proportional to the other values), and if the same team's earned runs average is fourth in the league, its length is 2, etc, etc... and then those points or "tips" are connected to each other within the chart, and finally the area of the connected figure is filled with any colors.
Sorry for the awful explanation (it's quite difficult for non-English native to explain it more clearly), but my question is, is it feasible to depict such graphs in iOS application? If it can be done in iOS app, how/what library do I use to plot such graphs?
I've read Core Graphics documentation as well as CorePlot example page but I wasn't able to find any such charts in those pages. I don't like the idea of using D3 embedded in UIWebView as suggested in this post since it's slow due to network latency. I don't know any other libraries to be as flexible and versatile as the two libraries above.
I use iOS 7.1 and Xcode 5.1.
[Update]
It's not a bubble chart. Let me explain it a little bit more concretely. The chart is a hexagon if every component of a record or sample is the best among the other competing records or samples and the number of the component to be described is six. In other words, the length of the component from the origin is whatever the longest possible values. But if one component, say, stolen bases, is NOT the best in the samples - say, it's the second best -, then the length of the component from the origin is not the longest; it's the second longest among the samples. And once every components (6 in this case) is plotted on the graph, those plotted points are connected to each other, and it finally is filled with whatever colors to make it the "area" of the record. And then this might be repeated in other records or samples as well. But unlike the bubble chart, one graph is made of one record and six features (or columns or variables) in this case - not all records and one feature (actually, three, but only one is used to make a bubble) which it is in the case of the bubble chart. Hope you get it...
[Update 2]
I finally got such charts on the Internet! The chart is something like this:
.
You're describing a bubble chart. You can make one with Core Plot using a scatter plot. Implement one of the following datasource methods to provide custom plot symbols. Use your data to determine the size of each symbol. They can be different shapes and have varying fills and border line styles, too.
-(NSArray *)symbolsForScatterPlot:(CPTScatterPlot *)plot recordIndexRange:(NSRange)indexRange;
-(CPTPlotSymbol *)symbolForScatterPlot:(CPTScatterPlot *)plot recordIndex:(NSUInteger)idx;
Related
I'm creating a chart showing the minimum and maximum salary by level within a company. I have both of these measures displaying as circles. Is it possible to create a bar/line connecting them so that users can clearly see how large the ranges are for each level? I've seen some barbell chart tutorials, but I think I'd need significant data wrangling to get data in a structure that would work for that.
Sidenote: My goal is really just to show the span, so I also thought a stacked bar/column chart could work, with min(salary) as the bottom bar, which I'd make white/transparent, and max(salary)-min(salary) as the top bar, but I could only get them to stack on top of each other when using dual axis.
In Vaadin 14.6.1, I tried to create a Vaadin heatmap foollowing the documentation / example from here.
However, I encountered a few problems/questions, listed in descending order of importance below:
The heatmap supported 30 rows by 30 columns; but when I tried 40 rows by 40 columns, the entire heatmap showed a single color (blue in my case).
Is it possible to manually set the minimum numeric value and maximum numeric value for the color scheme. This way, if I plot my data one day and it has values in the range of 0 to 1, but on another dataset from another day, the numeric values range from between 0 and 0.5, the color scheme range won't automatically change (to being between 0 and 0.5) and confuse the user.
In the documentation, it has the following methods listed, but they do not seem to exist in Vaadin 14.6.1
plotOptions.setBorderColor(SolidColor.WHITE);
plotOptions.setBorderWidth(2);
When I hover over the datapoints, is there a way that the tooltip can only show the numeric value (and not the x, y coordinate or the series name etc.?)
Is there any limit to the number of datapoints? I'm hoping that if #1 above is resolved that I can plot a 100 by 100 (ie 10,000) point heatmap.
If I plot 100by100, there will be many labels on the x and y axis. In my case, the x and y axis are actually numerical, so I did what the documentation suggested and just placed category labels in the xaxis and yaxis spots. However, is there any way to only display every "nth" label, so that the x-axis and y-axis is not so crowded? (This would essentially mimic what Vaadin does for normal line charts' xaxis and yaxis).
I'm not that experienced with Vaadin Chart, but these are the questions that I can comment on:
(1) With 40x40 items you go over the threshold of 1000 in which the Chart switches into "turbo" mode for performance reasons. This seems to not be compatible with the heatmap series. You can disable turbo mode by setting plotOptions.setTurboThreshold(0);
(2) Unfortunately the ColorAxis doesn't support this, it only has an API for min and max color. Definitely a valid use-case though, and it seems to be supported by the Highcharts library that the Vaadin Chart uses under the hood. You should consider opening a feature request for this in the Github repo.
(3) This seems to be a documentation issue. The methods are available in later Vaadin platform versions, but not in 14.6.
(5) In theory not, but in practice there will be a huge performance hit in the browser due to the excessive amount of DOM elements (quick test of 100x100 froze the browser for 10s). I'm afraid the component isn't really made for such extreme use-cases. In this case it might be better to utilize a low-level JS drawing library using the canvas, or draw an image on the server-side and display that in the browser. Maybe you can also consider modifying your use-case so that you only display one slice of your data and allow the user to switch between slices.
I have a chart with several series on it, one of which is a flag series. The data on the flag series is reasonably sparse, but very bursty. As a result when I am showing a large amount of data, ~10 flags tend to line up up next to each other all pointing to basically the same point on the graph.
What I'd like is for those flags to get downsampled (in a sense) so I only show 1 flag indicator that points to the general area where all the flag points are, then when the user zooms in, all the flag points are displayed since it's now possible to actually distinguish what they are pointing at.
This seems like a job for data grouping and when I am zoomed out and showing large data ranges, all my other series end up getting downsampled by data grouping. However, this isn't being applied to the flag series, I suspect because the series doesn't qualify since it has relatively few points across the range being shown.
Does anyone know if there's anything built in that will help me achieve this? Or do I have to write my own downsampling that's tied into the setExtremes event somehow?
Thanks.
Im drawing a simple map in spotfire using US cities as geo location. The values I want to show on the map is the location of 'specific gas stations' by the geo code.
For larger cities there are many but im only able to get one 'shape'. I can work on the coloring or size. But im interested to get all 5 dots next to each other or a call-out highlighting there are five..?
Is there a way to show all values, or does spotfire need to combine them?
I know I can get more details with lat/long but that is not an option.
are your shapes literally being combined? that shouldn't happen unless you are doing a "Marker by: City". double check this setting.
if they aren't being literally combined into one point on the map, but instead they are sitting on top of each other, you could adjust the jitter settings on your Marker Layer (check the Appearance page in the Properties dialog) to spread them out a little bit.
if that doesn't suit your needs, and the former case is true, please update your question with some screencaps of your map chart's configuration and I'll see if I can provide a better answer :)
While using Delphi Seattle 10 and Steema TeeChart Pro VCL FMX 2016.18, I am looking to Highlight a Selection of a Line Graph (multiple series) in the way that Zooming allows / makes a square around a highlighted selection of a Line Graph to indicate which part of it to zoom into (as long as the onmousedown action is in progress).
The purpose of this would be to allow the selection to remain highlighted while the mouse is no longer being clicked, to potentially "Delete" the highlighted Data points. All I need this for is to obtain the (X0 Y0 X1 Y1) values to possibly obtain the CalcPosPoint(X) and remove all the points inside. The data is currently obtained through a Record Struct (Memory Mapped) file, and it will there for be used to set/check for a property "deleted" to indicate on the next redraw of the graph which rows to completely ignore and which to continue printing.
I hope to be able to do this (select from 1 chart), and have it simultaneously draw on multiple graphs. I have tried to look for an example of this feature through the use of TSelectorTool (FMXTee). One of the pages I found referring to such a tool is Interactive data point selection as well as Multiple selections with Selector Tool
And my second question has to do with TeeCharts directly. Where would I find fmx240.bpl as TeeChart_Pro_Firemonkey_Demo.exe requires this file in order to run? I did manage to copy vcl240.bpl from "Embarcadero\Studio\18.0\bin" and put it into "Embarcadero\Studio\17.0\bin"
[Edited]
I have managed to capture / create a sample code (MVCE) from which I can now select a portion and create a square around a particular sample of graph lines.
The control graph right now is the bottom graph (Chart5). If anyone is interested in seeing the code, I have put up a pastebin sample.
PasteBin Sample Code
And a TeeCharts.tar.gz is accessible to anyone who wishes to see a sample of the code, as well as the data sample.
filetolink.com Source Files
I no longer feel the need for mathematical equation to differentiate the top graphs from the bottom (because the bottom axes are automatic where as the top are defined). I intend to only use the space which is adherent to the visible space, and do not intend to extend in either direction (left or right). That means at this point the size of the graph does not matter, because once I over populate the charts above, the position in the bottom graph would become irrelevant, and therefor I do not intend to use the bottom chart.
The next step is to save the positions of the boxes so that they can reappear when the graph is shift from left (past data) to the right (live data). And then uses the buttons above to make the appropriate action to the graphs.
I would like to know what way would be the most sufficient way to record the positions of the rectangles, so when the chart is shifted (via the ScrollBar1), the rectangles are moving with the direction of the scrollbar. But I'm sure I can achieve that.
I think I have found a solution. The red squares are only prevalent for the visual aspect, they can be drawn on, I don't need to do anything special with each chart, as I already know what the X0..Y1 parameters are, they are known from the initial chart. The problem h/e has to do with the initial chart. As long as the screens are all full, I can zoom in correctly w/ alignment with on all the charts (ZoomRect/Rectf(X0..Y1))
But what kind of equation would it take to adjust the charts that are not in the same zoom / max / min when the Chart5.Axes.Bottom.Automatic = True?
From there I just simply have to disable the immediate zoom feature, and allow buttons to become functional, to decide what the next course of action would be.