I am trying to combine LineSeries, ScatterSeries and HeatmapSeries on a single OxyPlot instance. I am able to show the first two just fine on the same plot and it looks like the following:
The axes for this are generated by the following code:
var xAxis = new DateTimeAxis();
xAxis.Key = "X";
xAxis.Position = AxisPosition.Bottom;
xAxis.AbsoluteMinimum = DateTimeAxis.ToDouble(CurrentPass.AOS);
xAxis.AbsoluteMaximum = DateTimeAxis.ToDouble(CurrentPass.LOS);
xAxis.AxislineColor = xAxis.TextColor = xAxis.TicklineColor = xAxis.MajorGridlineColor = OxyColors.DarkGray;
var yAxis = new LinearAxis();
yAxis.Key = "Y";
yAxis.Position = AxisPosition.Left;
yAxis.AbsoluteMinimum = 0.0;
yAxis.AbsoluteMaximum = MaximumFrequency;
yAxis.Maximum = MaximumFrequency;
yAxis.AxislineColor = yAxis.TextColor = yAxis.TicklineColor = yAxis.MajorGridlineColor = OxyColors.DarkGray;
If I add in a third axes for the Heatmap (not even a HeatMapSeries yet), I get the following:
The extra code here for the axis for the HeatMap is:
var heatmapAxis = new LinearColorAxis();
heatmapAxis.AbsoluteMinimum = 0.0;
heatmapAxis.AbsoluteMaximum = MaximumFrequency;
heatmapAxis.Palette = OxyPalettes.Gray(1024);
heatmapAxis.Key = "HeatMap";
I am not sure what's going on here. The line series still shows. And all the ScatterPoints from the scatterseries I have are definitely there - the tracker shows up and I can interact with the points (hover, click etc.). But the points don't show. If I add a HeatMapSeries, the HeatMapSeries data does show up as expected, the LineSeries data still shows up but no ScatterSeries data.
Again, the HeatMap data and the Scatter Series data show up individually, but never together.
Has anyone encountered this before? Are there workarounds?
Thanks,
Aditya
Sorry this is a bit late but just stumbled upon this. I had something similar with a line not showing up on a Heatmap and after some experimenting i realized the order in which the series' are added to the plot model make a big difference. Make sure you add your ScatterSeries after you've added your Heatmap to the plot model.
Related
I have plotted two graphs using plotly dash. But when the y-axis / x-axis tick size is more it gets cut off.
Y-axis :
Code :
data = [go.Scatter(x = df[df['S2PName-Category']==category]['S2BillDate'],
y = df[df['S2PName-Category']==category]['totSale'],
mode = 'markers+lines',
name = category) for category in df['S2PName-Category'].unique()]
layout = go.Layout(title='Category Trend',
xaxis = dict(title = 'Time Frame', tickformat = '%d-%b-%y'),
yaxis = dict(tickprefix= '₹', tickformat=',.2f',type='log'),
hovermode = 'closest',
plot_bgcolor = colors['background'],
paper_bgcolor = colors['background'],
font = dict(color = colors['text'])
)
X-Axis :
Code :
data = [go.Scatter(x = df[df['S2PName']==item]['S2BillDate'],
y = df[df['S2PName']==item]['totSale'],
mode = 'markers+lines',
name = item) for item in items]
layout = go.Layout(title='Category Trend',
xaxis = dict(title = 'Time Frame' , tickformat = '%d-%b'),
yaxis = dict(tickprefix= '₹', tickformat=',.2f',type='log',autorange = True),
hovermode = 'closest',
plot_bgcolor = colors['background'],
paper_bgcolor = colors['background'],
font = dict(color = colors['text'])
)
In the above 2 graphs , as the length of the tick value increases, it gets cut off . Is there a better way to handle this ?
Credit for #Flavia Giammarino in comments for the reference to the docs. I'm posting the answer for completeness.
https://plotly.com/python/setting-graph-size/
From that link the example below shows how to set margin:
fig.update_layout(
margin=dict(l=20, r=20, t=20, b=20),
)
Where l r t b correspond to left, right, top, bottom.
I had a similar problem with some Dash/Plotly charts and long y axis labels being truncated or hidden. There didn't seem to be much information or documentation on this issue, so it took a while to solve.
Solution: add this code to the layout settings to prevent truncation of the y axes labels:
fig.update_layout(
yaxis=dict(
automargin=True
)
)
or you can update the yaxes setting specifically:
fig.update_yaxes(automargin=True)
Update: I tried another version of Plotly (5.10 or above) which mentions setting the automargin setting to any combination of automargin=['left+top+right+bottom'] with similar results. This still seems a bit unstable and doesn't solve all possible scenarios or corner cases, but works fine in most cases, especially when the browser window is maximized.
I need to get the co-ordinates of matched image within the actualImage so that I can perform operations on it. However, I tried below two approaches,but both doesn't seem to work:
Approach 1:
Using below, I'm able to find a match but co-ordinates returned are just the width & height of image to be matched(which I already know). I want to get the position of the same within actual image.
BufferedImage actualImg = ImageIO.read(new File("C:/Images/SrcImg.PNG"));
ImageTarget actualTgt = new ImageTarget(actualImg);
BufferedImage searchImg = ImageIO.read(new File("C:/Images/TgtImg.PNG"));
ImageTarget searchTgt = new ImageTarget(searchImg);
ScreenRegion scrReg = new StaticImageScreenRegion(actualTgt.getImage());
ScreenRegion resReg = scrReg.find(searchTgt);
ScreenLocation center = resReg.getCenter();
System.out.println(":getElementFromImage: x_loc,y_loc =["+center.getX()+","+center.getY()+"]");
Approach 2:
In below code I tried with sikulix Finder. However, with this src.hasNext() returned true BUT src.next() threw nullpointer exception.Not sure what is the problem here:
Finder src = new Finder("C:/Images/SrcImg.PNG");
Pattern pat = new Pattern("C:/Images/TgtImg.PNG").similar(0.5);
src.find(pat);
Match m;
while( src.hasNext())
m = src.next();
src.destroy();
java.lang.NullPointerException
at org.sikuli.script.Finder.next(Finder.java:484)
at com.work.ImageFinder.main(ImageFinder.java:38)
I already spent good amount of time to make this work. Any help would be much appreciated.
Thanks!
It works fine after passing the Region to Finder like below:
Finder src = new Finder("C:/Images/SrcImg.PNG", new Region(0,0,<width>,<height>))
Pattern pat = new Pattern("C:/Images/TgtImg.PNG").similar(0.5);
src.find(pat);
Match m;
while( src.hasNext())
m = src.next();
src.destroy();
More details can be found below link:
Is it possible to use Sikuli to assert that images are the same in GUI-less mode?
I am facing an issue in Octave. When I set custom tick labels of y axis, labels are not updated correctly when zoomed. It is easy to solve in Matlab:
plot(1:10);
ax = gca;
ax.YAxis.TickLabelFormat = '%,.1f';
My code with faulty y labels when zoomed:
ax2 = gca;
ytick = get (ax2, "ytick");
yticklabel = strsplit (sprintf ("%9.0f\n", ytick), "\n", true);
set (ax2, "yticklabel", yticklabel);
The above code formats y tick labels properly, but labels does not match plot when zoomed. There is a screenshot of my issue: nonzoomed vs zoomed.
I am using W10 64bit, Octave version 4.0.3.. Octave was configured for "i686-w64-mingw32".
Any ideas?
I have decided to add minimal code example to be more clear about the issue:
x=1:length(inv);
figure
hax1 = subplot(2,1,1);
stairs(x,inv);
hax2 = subplot(2,1,2);
x=1:length(mon);
% big numbers here, need to format to get rid of scientific notation
stairs(x,mon);
ax2 = gca;
ytick = get (ax2, "ytick");
yticklabel = strsplit (sprintf ("%9.0f\n", ytick), "\n", true);
set (ax2, "yticklabel", yticklabel);
linkaxes([hax1 hax2],'x');
I am trying to mask an image on another so that I only view the specific portion of the unmasked image through the masked one. My problem is that I cannot see anything on the screen.. no Image, no effect at all
cardMask = new Image(Root.assets.getTexture("card_mask"));
cardMask.y = Constants.STAGE_HEIGHT*0.40;
cardMask.x = Constants.STAGE_WIDTH *0.48;
trace("it's add mask");
cardLight = new Image(Root.assets.getTexture("card_light_mask"));
cardLight.y = Constants.STAGE_HEIGHT*0.46;
cardLight.x = Constants.STAGE_WIDTH *0.48;
cardLight.mask=cardMask;
maskedDisplayObject = new PixelMaskDisplayObject(-1,false);
maskedDisplayObject.addChild(cardLight);
maskedDisplayObject.x=cardLight.x;
maskedDisplayObject.y=cardLight.y;
maskedDisplayObject.mask=cardMask;
maskedDisplayObject.blendMode = BlendMode.SCREEN;
addChild(maskedDisplayObject);
First, for masking an object the mask object should also be added to the display list. Your code does not add cardMask to display list anywhere. Second, if your maskedDisplayObject should be visible at all times, the mask should be assigned not to it, but to some other object which displayed part you desire to control. And third, it is also possible that this.stage is null, therefore the entire tree (this -> maskedDisplayObject -> cardLight) is plain not rendered. You need to check all three of these conditions to get something displayed.
Also, if you desire cardLight as an object to move independently of maskedDisplayObject, you should add it to this instead, and check that it's displayed on top of maskedDisplayObject (call addChild(cardLight) after addChild(maskedDisplayObject)).
This all totals to this code:
trace("Stage is null:", (this.stage==null)); // if this outputs true, you're out of display
cardMask = new Image(Root.assets.getTexture("card_mask"));
cardMask.y = Constants.STAGE_HEIGHT*0.40;
cardMask.x = Constants.STAGE_WIDTH *0.48; // mask creation unaltered
trace("it's add mask");
cardLight = new Image(Root.assets.getTexture("card_light_mask"));
cardLight.y = Constants.STAGE_HEIGHT*0.46;
cardLight.x = Constants.STAGE_WIDTH *0.48;
cardLight.mask=cardMask; // this is right
maskedDisplayObject = new PixelMaskDisplayObject(-1,false);
// maskedDisplayObject.addChild(cardLight); this is moved to main part of display list
maskedDisplayObject.x=cardLight.x;
maskedDisplayObject.y=cardLight.y;
// maskedDisplayObject.mask=cardMask; NO masking of this, you're only masking cardLight
cardLight.blendMode = BlendMode.SCREEN; // display mode is also changed
addChild(maskedDisplayObject);
addChild(cardLight);
Introduction:
I have an AdvancedDataGrid displaying hierarchical data illustrated by the image below:
The branch nodes "Prosjekt" and "Tiltak" display the sum of the leaf nodes below.
Problem: I want the root node "Tavle" to display the total sum of the branch nodes below. When i attempted to do this by adding the same SummaryRow the sum of the root node was not calculcated correctly(Every node's sum was calculated twice).
dg_Teknikktavles = new AutoSizingAdvancedDataGrid();
dg_Teknikktavles.sortExpertMode="true";
dg_Teknikktavles.headerHeight = 50;
dg_Teknikktavles.variableRowHeight = true;
dg_Teknikktavles.addEventListener(ListEvent.ITEM_CLICK,dg_TeknikktavlesItemClicked);
dg_Teknikktavles.editable="false";
dg_Teknikktavles.percentWidth=100;
dg_Teknikktavles.minColumnWidth =0.8;
dg_Teknikktavles.height = 1000;
var sumFieldArray:Array = new Array(context.brukerList.length);
for(var i:int = 0; i < context.brukerList.length; i++)
{
var sumField:SummaryField2 = new SummaryField2();
sumField.dataField = Ressurstavle.ressursKey + i;
sumField.summaryOperation = "SUM";
sumFieldArray[i] = sumField;
}
var summaryRow:SummaryRow = new SummaryRow();
summaryRow.summaryPlacement = "group";
summaryRow.fields = sumFieldArray;
var summaryRow2:SummaryRow = new SummaryRow();
summaryRow2.summaryPlacement = "group";
summaryRow2.fields = sumFieldArray;
var groupField1:GroupingField = new GroupingField();
groupField1.name = "tavle";
//groupField1.summaries = [summaryRow2];
var groupField2:GroupingField = new GroupingField();
groupField2.name = "kategori";
groupField2.summaries = [summaryRow];
var group:Grouping = new Grouping();
group.fields = [groupField1, groupField2];
var groupCol:GroupingCollection2 = new GroupingCollection2();
groupCol.source = ressursTavle;
groupCol.grouping = group;
groupCol.refresh();
Main Question: How do i get my AdvancedDataGrid's (dg_Teknikktavles) root node "Tavle" to correctly display the sum of the two branch nodes below?
Side Question: How do i add a red color to the numbers of the root node's summary row that exceed 5? E.g the column displaying 8 will exceed 5 in the root node's summary row, and should therefore be marked red
Thanks in advance!
This is a general answer, without code examples, but I had to do the same just couple of days ago, so my memory is still fresh :) Here's what I did:
Created a class A to represent an item renderer data, extended it from Proxy (I had field names defined at run time), and let it contain a collection of values as it's data member. Once accessed through flash_proxy::getPropery(fieldName) it would find a corresponding value in the data member containing the values and return it. Special note: implement IUID, just do it, it'll save you couple of days of frustration.
Extended A in B, added a children property containing ArrayCollection of A (don't try to experiment with other collection types, unless you want to find yourself examining tons of framework code, trust me, it's ugly and is impossible to identify as interesting). Let B override flash_proxy::getPropery - depending of your compiler this may, or may not be possible, if not possible - call some function from A.flash_proxy::getPropery() that you can override in B. Let this function query every instance of A, which is a child of B, asking the same thing, as DataGrid itself would, when building item renderers - this way you would get the total.
When creating a data provider. Create an ArrayCollection of B (again, don't try to experiment with other collections--unless you are ready for lots of frustration). Create Hierarchical data that uses this array collection as a source.
Colors - that's what you use item renderers for, just look up any tutorial on using item renderers, that must be pretty basic.
In case someone else has the same problem:
The initial problem that everything was summed twice, was the result of using the same Array of SummaryField2 (sumFieldArray in the code) for both grouping fields(GropingField2 tavle and kategori)
The Solution to the main question: was to create a new array of summaryfields for the root node(in my intial for loop):
//Summary fields for root node
var sumFieldRoot:SummaryField2 = new SummaryField2();
sumFieldRoot.dataField = Ressurstavle.ressursKey + i;
sumFieldRoot.summaryOperation = "SUM";
sumFieldArrayRoot[i] = sumFieldRoot;
Answer to the side question:
This was pretty much as easy as pointed out by wvxyw. Code for this solution below:
private function summary_styleFunction(data:Object, col:AdvancedDataGridColumn):Object
{
var output:Object;
var field:String = col.dataField;
if ( data.children != null )
{
if(data[field] >5){
output = {color:0xFF0000, fontWeight:"bold"}
}
else {
output = {color:0x006633, fontWeight:"bold"}
}
//output = {color:0x081EA6, fontWeight:"bold", fontSize:14}
}
return output;
}