How to set axis margin in WinRT XAML Toolkit line chart? - xaml

Answer
Finally I solved my answer with this.
((LineSeries)MyChart.Series[0]).IndependentAxis = new LinearAxis
{
Minimum = 1,
Maximum = 5,
Orientation = AxisOrientation.X,
Interval = 1,
Margin = new Thickness(10, 0, 10, 0)
};
((LineSeries)MyChart.Series[0]).Clip = null;
((LineSeries)MyChart.Series[0]).Margin = new Thickness(10, 0, 10, 0);
I am drawing line chart with help of WinRT XAML Toolkit. I am setting X axis manually, but when I set I am getting wierd start & end point. I tried to set margin and padding but it's not working. Will you please suggest me how can I do that ?
((LineSeries)MyChart.Series[0]).IndependentAxis = new LinearAxis
{
Minimum = 1,
Maximum = 5,
Orientation = AxisOrientation.X,
Interval = 1,
//Margin = .... Not working
//Padding = .... Not working
};

I'd use a visual tree debugger to walk up the visual tree from these data points to see where the Clip property is set. In fact I just did that on the samples project and it is set on the LineSeries. See if it's set as part of its XAML template or if it is done in C# and remove it there. Also you could change the Minimum/Maximum values on your X axis to make more space. I'll add cleaning this all up to my TODO list.

Related

PathGraphics not working in real-time or runtime generated

Have simple app using Cesium. I have basic entity with ellipse graphics, moving around, and I need to display its path, using PathGraphics, but it doesn't seem to work for me.
Here's code sample.
const position = new SampledPositionProperty();
const start = [16.096912, 40.4100289];
const startTime = JulianDate.now();
position.addSample(startTime, Cartesian3.fromDegrees(...start));
const diff = 0.0002;
const [x, y] = start;
for (let i = 0; i < 10; i += 1) {
const d = JulianDate.addSeconds(startTime, i + 1, new JulianDate());
const newPos = [x + diff * (i + 1), y + diff * (i + 1)];
position.addSample(d, Cartesian3.fromDegrees(...newPos));
}
app.entities.add({
ellipse: {
semiMinorAxis: 10,
semiMajorAxis: 10,
material: Color.RED,
},
path: {
resolution: 1,
width: 5,
material: Color.YELLOW,
},
position,
});
But when I launch it all I see is moving ellipse, but no path is drawn. Everywhere I searched they say you just have to have position as SampledProperty and it will work, but it doesn't seem to work for me.
In this case, as you can see, I generate data beforehand, but I also tried adding it in runtime - same result. The only working examples i was able to find where using czml - but it doesn't fit my needs - it will be real-time app.
I found the solution by digging through Cesium Sandcastle - you have to set availability property to entity with time range you want path to be shown. Would be cool if it was covered in documentation at least in some way.

TweenJS rect command "grow from center"

new to createjs here:
Created this fiddle: example. I would like the rect to grow from the center and not from the top left corner. I couldn't find any help, I don't know what to search for.
Code:
const PAGE_WIDTH = 150,
PAGE_HEIGHT = 75;
var stage = new createjs.Stage("canvas");
createjs.Ticker.setFPS(60);
createjs.Ticker.on("tick", tick);
var page = new createjs.Shape();
page.regX = PAGE_WIDTH/2;
page.regY = PAGE_HEIGHT/2;
page.x = 50;
page.y = 50;
stage.addChild(page);
var pageCommand = page.graphics
.beginFill('red')
.drawRect(0, 0, 1, 1).command;
createjs.Tween.get(pageCommand)
.to({w:PAGE_WIDTH, h: PAGE_HEIGHT}, 700, createjs.Ease.elasticOut)
function tick() {
stage.update();
}
Thanks.
The best way is to change the registration point of your graphics so it grows from the center.
Your code:
.drawRect(0, 0, 1, 1).command;
.to({w:PAGE_WIDTH, h: PAGE_HEIGHT})
Instead:
.drawRect(-1.-1, 2, 2);
.to({x:-PAGE_WIDTH/2, y:-PAGE_WIDTH/2, w:PAGE_WIDTH, h: PAGE_HEIGHT})
Fiddle: http://jsfiddle.net/1kjkqo2v/
[edit: I said 2 options initially, but the second (using regX and regY) wouldn't work well, since you have to tween that value as well as your size changes.]

QGroupBox sizing with my QT5 custom widget

I am trying to make a custom widget: for displaying a processor register which has a name, a value and can be displayed in octal/decimal hexa. The code is shown at the bottom. I receive better result when I use the code as shown (i.e I insert QRadioButtons):
If I use
mainLayout->addWidget(DisplayMode);
instead (I guess this is the correct method) then the resulting picture is
Do I misunderstand something? What is wrong?
RegisterWidget::RegisterWidget(QWidget *parent)
:QFrame (parent)
{
mValue = 0;
mName = "";
setFrameStyle(QFrame::Panel | QFrame::Sunken);
QHBoxLayout *mainLayout = new QHBoxLayout(this);
label = new QLabel(tr("mName"),this);
label->setText(mName);
label->setLineWidth(2);
QGroupBox *DisplayMode = new QGroupBox("");
QRadioButton *OctalR = new QRadioButton(this);
QRadioButton *DecimalR = new QRadioButton(this);
DecimalR->setChecked(true); DecimalR->setDown(true);
QRadioButton *HexaR = new QRadioButton(this);
QHBoxLayout *hbox = new QHBoxLayout;
hbox->addWidget(OctalR);
hbox->addWidget(DecimalR);
hbox->addWidget(HexaR);
hbox->addStretch(1);
DisplayMode->setLayout(hbox);
mainLayout->addWidget(label);
Value = new QLCDNumber(this);
Value->setDigitCount(8);
Value->setSegmentStyle(QLCDNumber::Flat);
Value->display(mValue);
mainLayout->addWidget(Value);
/* mainLayout->addWidget(DisplayMode);*/
mainLayout->addWidget(OctalR);
mainLayout->addWidget(DecimalR);
mainLayout->addWidget(HexaR);
setLineWidth(3);
setLayout(mainLayout);
connect(OctalR, SIGNAL(clicked()), this, SLOT(setOctal()));
connect(DecimalR, SIGNAL(clicked()), this, SLOT(setDecimal()));
connect(HexaR, SIGNAL(clicked()), this, SLOT(setHexa()));
}
Call QLayout::setContentsMargins() for both mainLayout and hbox. Try (3, 3, 3, 3) as parameters for a starting point and tweak. Layouts have default margins of 11 pixels on most platforms, according to the docs.

VB.Net make a image in background task using Win2d

Dependency : Win2D
I am trying to generate a Livetile image from background task.
However, the generated PNG file only looks transparent, no single dot is painted at all.
So, I simplified the important code as below to test, yet no result was changed.
I imported Microsoft.Canvas.Graphics(+Effects,+Text),
Dim device As CanvasDevice = New CanvasDevice()
Dim width = 150, height = 150
Using renderTarget = New CanvasRenderTarget(device, width, height, 96)
Dim ds = renderTarget.CreateDrawingSession()
'ds = DrawTile(ds, w, h)
Dim xf As CanvasTextFormat = New CanvasTextFormat()
xf.HorizontalAlignment = CanvasHorizontalAlignment.Left
xf.VerticalAlignment = CanvasVerticalAlignment.Top
xf.FontSize = 12
renderTarget.CreateDrawingSession.Clear(Colors.Red)
ds.Clear(Colors.Blue)
ds.DrawText("hi~", 1, 1, Colors.Black, xf)
renderTarget.CreateDrawingSession.DrawText("hi~", 1, 1, Colors.Black, xf)
Await renderTarget.SaveAsync(Path.Combine(ApplicationData.Current.LocalFolder.Path, "_tile_150x150.png"))
End Using
The file is created, but it's filled with neither Red or Blue. No text at all. It's transparent with only 150x150 pixel canvas.
Is there any problem with the code? or any other reason?
Thanks a lot!
The CanvasDrawingSession ("ds" in your sample) needs to be Closed / Disposed before you call SaveAsync.
You can use "Using ds = renderTarget.CreateDrawingSession()" to do this for you - put the call to SaveAsync after "End Using".
From there you should use the same "ds" rather than call "CreateDrawingSession" multiple times.

Print Layout Not showing Properly after Set page settings in rdlc

I creating a report in rdlc in winforms. This is working properly. But after i add the page settings to the report viewer the print layout view not showing properly. Only black dots showing. When i comment the page settings it is working properly.
My report binding coding are below
this.reportViewer1.Width = this.Width - 15;
this.reportViewer1.Height = this.Height - 15;
this.reportViewer1.LocalReport.DataSources.Clear();
this.reportViewer1.LocalReport.ReportEmbeddedResource = "Report1.rdlc";
ReportDataSource rds = new ReportDataSource("DataSet1", CustomerList);
rds.Value = _deliveryNote.CustomerList;
this.reportViewer1.LocalReport.DataSources.Add(rds);
System.Drawing.Printing.PageSettings pg = new System.Drawing.Printing.PageSettings();
pg.Margins.Top = 100;
pg.Margins.Bottom = 100;
pg.Margins.Left = 100;
pg.Margins.Right = 100;
pg.Landscape = false;
System.Drawing.Printing.PaperSize size = new PaperSize();
size.RawKind = (int)PaperKind.A4;
pg.PaperSize = size;
this.reportViewer1.SetPageSettings(pg);
this.reportViewer1.LocalReport.Refresh();
this.reportViewer1.RefreshReport();
This is because you have not specified the height and width of the paper. Changing your code as follows will solve your problem:
System.Drawing.Printing.PageSettings pg = new PageSettings();
// Set margins
pg.Margins = new System.Drawing.Printing.Margins(100, 100, 100, 100);
// Set paper size
pg.PaperSize = new PaperSize("A4", 827, 1169); // 8.27 in x 11.69 in
pg.RawKind = (int)PaperKind.A4; // Before .NET Framework 4.5
// Update report and refresh
this.reportViewer1.SetPageSettings(pg);
this.reportViewer1.RefreshReport();
// Switch to print Layout (optional)
this.reportViewer1.SetDisplayMode(DisplayMode.PrintLayout);
For .NET Framework 4.5 and newer, the RawKind needs to be set as follows. Thanks for pointing out #Tyler Durden.
pg.PaperSize.RawKind = (int)PaperKind.A4;
Hope this helps someone in the future.