ChartControl - How to plot a line on X Axis (x - fixed coordinate, y - infinity) - microsoft-chart-controls

I'm developing a C# winforms application in which I want to plot lines on X axis such that the X coordinate is a fixed value, but there is no Y coordinate specified.
Something like this:
Can this be done?

Stripline did the trick!
Here's the code:
public Series series1 = new Series
{
Name = "Series1",
Color = Color.Black,
IsVisibleInLegend = false,
ChartType = SeriesChartType.Line,
BorderWidth = 0,
XValueType = ChartValueType.Double,
YValueType = ChartValueType.Double
};
public StripLine startPositionLine = new StripLine
{
BorderColor = Color.Red,
BorderWidth = 2,
IntervalOffset = 7
};
public StripLine endPositionLine = new StripLine
{
BorderColor = Color.Blue,
BorderWidth = 2,
IntervalOffset = 11
};
private void Form1_Load(object sender, EventArgs e)
{
chart1.Series.Clear();
chart1.ChartAreas[0].AxisX.Minimum = 0;
chart1.ChartAreas[0].AxisX.Interval = 1;
//Apparently some series with some points have to be present on the chart before the striplines get displayed
series1.Points.AddXY(0, 0);
series1.Points.AddXY(10, 0);
chart1.Series.Add(series1);
chart1.ChartAreas[0].AxisX.StripLines.Add(startPositionLine);
chart1.ChartAreas[0].AxisX.StripLines.Add(endPositionLine);
chart1.Invalidate();
}
And here's how the striplines are plotted:
One thing I need to check is whether or not a series needs to be plotted first before a stripline can be plotted.

Related

In UITextfield, When applying color using NSMutableAttributedString the color is not applied correctly when unfocusing

Using NSMutableAttributedString, I applied color for a specific character in a string using UITextfield. My Code:
uITextField = new UITextField(); uITextField.BackgroundColor = UIColor.LightGray;
uITextField.Frame = new CGRect(10, 150, 350, 40);
uITextField.Text = "Hai i am ________________";
uITextField.TextColor = UIColor.Green;
uITextField.EditingChanged += UITextField_EditingChanged;
private void UITextField_EditingChanged(object sender, EventArgs e)
{
var promptStringAttributes = new UIStringAttributes
{
ForegroundColor = UIColor.Red
};
var promptString = new NSMutableAttributedString(uITextField.Text);
char[] mText = uITextField.Text.ToCharArray();
Char prchar = '_';
for (int i = 0; i < mText.Length; i++)
{
if (!string.IsNullOrEmpty(uITextField.Text) && prchar == mText[i])
{
promptString.SetAttributes(promptStringAttributes.Dictionary, new NSRange(i, 1));
}
}
uITextField.AttributedText = promptString;
}
Initially, the text will be in Green color. See the below image:
After deleting the last character in the UItextfield, I will change the color of some character to red
The problem which I am facing is after unfocusing the UITextfield, the Red color is applied to all the character in the UITextField and the text color is not displayed correctly. Only the set attribute color is applied for all the character in the string. See the below image:
Please give a possible solution to restrict of applying the set attribute color for all the string when unfocusing the UITextField in xamarin iOS.
Improve your method
var promptStringAttributes_Red = new UIStringAttributes
{
ForegroundColor = UIColor.Red
};
var promptStringAttributes_Green = new UIStringAttributes
{
ForegroundColor = UIColor.Green
};
var promptString = new NSMutableAttributedString(uITextField.Text);
char[] mText = uITextField.Text.ToCharArray();
Char prchar = '_';
for (int i = 0; i < mText.Length; i++)
{
if (!string.IsNullOrEmpty(uITextField.Text) && mText[i] ==prchar)
{
promptString.SetAttributes(promptStringAttributes_Red.Dictionary, new NSRange(i, 1));
}
else
{
promptString.SetAttributes(promptStringAttributes_Green.Dictionary, new NSRange(i, 1));
}
}
uITextField.AttributedText = promptString;

How to draw speedometer or circular chart using xamarin forms

Recently, I started development using Xamarin.Forms in Visual Studio.
I need to draw something like this:
Is it possible using xamarin forms or is there any sample code for reference?
Thanks
I would look at the Syncfusion Circular Guage
See images below:
I am not 100% sure on the licencing, but I think they provide a Community Licence
Sorry for my English.
I have made something like that, see the picture below.
I copied some codes from some forums and made some ajusts of my own. But the principle is there, maybe adjust a few things and you can manage to achieve what you want. The adjusts that I made don't respect the proportional size in xaml (widht, height), I used the Request = 200. I hope that it can help you.
using System;
using System.Collections.Generic;
using System.Text;
using Microcharts.Forms;
using Microcharts;
using SkiaSharp;
using System.Linq;
namespace MES_App1.Chart
{
class SpeedometerChart : RadialGaugeChart
{
public SpeedometerChart()
{
BackgroundColor = SKColors.White;
}
private const float startAngle = 150;
private const float backgroundSweepAngle = 240;
public override void DrawContent(SKCanvas canvas, int width, int height)
{
var diferenceX = width > height ? (width - height) / 2 : 0;
var diferenceY = height > width ? (height - width) / 2 : 0;
var strokeWidth = (4 * (width - diferenceX)) / 100;
var rect = new SKRect(
5 + strokeWidth + diferenceX,
5 + strokeWidth + diferenceY + 50,
width - (5 + strokeWidth + diferenceX),
height - (5 + strokeWidth + diferenceY)+50);
var paint = new SKPaint
{
Style = SKPaintStyle.Stroke,
Color = SKColor.Parse("#008000"),
StrokeWidth = strokeWidth*4,
IsAntialias = true,
IsStroke = true
};
float[] angulos = { 1, 0.85f, 0.7f, 0.55f, 0.4f, .25f };
string[] angulosStr = { "100%", "85%", "70%", "55%", "40%", "25%" };
string[] cores = { "#008000", "#32CD32", "#5F9EA0", "#FFA500", "#FFD700", "#FF0000" };
for (int i = 0; i < angulos.Length; i++)
{
using (SKPath backgroundPath = new SKPath())
{
paint.Color = SKColor.Parse(cores[i]);
backgroundPath.AddArc(rect, startAngle, backgroundSweepAngle * angulos[i]);
canvas.DrawPath(backgroundPath, paint);
}
using (SKPath labelPath = new SKPath())
{
var rectLabels = new SKRect
{
Left=rect.Left-strokeWidth*2-20,
Top=rect.Top-strokeWidth*2-20,
Right=rect.Right+strokeWidth*2+20,
Bottom=rect.Bottom+strokeWidth*2+20
};
var labelPaint = new SKPaint
{
Style = SKPaintStyle.Stroke,
BlendMode = SKBlendMode.Clear,
Color = SKColors.Black,
StrokeWidth = 0,
IsAntialias = true,
IsStroke = true
};
labelPath.AddArc(rectLabels, startAngle, backgroundSweepAngle * angulos[i]);
canvas.DrawPath(labelPath, labelPaint);
canvas.DrawCaptionLabels(string.Empty, SKColor.Empty, angulosStr[i], SKColors.Black, 20,labelPath.LastPoint, SKTextAlign.Center);
}
}
float[] angulosLabel = { 1f, 0.85f, 0.7f, 0.55f, .25f };
float[] offsetLabels = { 20, 25, 20, 30, 30};
string[] labelsStr = { "Ideal", "Alta", "Tipico", "Precisa Melhoria", "Inaceitavel" };
for (int i = angulosLabel.Length-1; i >= 0; i--)
{
float anguloInicial;
if (i == angulosLabel.Length-1)
{
anguloInicial = startAngle;
}
else
{
anguloInicial = startAngle+backgroundSweepAngle * angulosLabel[i + 1];
}
using (SKPath labelPath = new SKPath())
{
var labelPaint = new SKPaint
{
TextSize=18
};
labelPath.AddArc(rect, anguloInicial, backgroundSweepAngle * angulosLabel[i]);
canvas.DrawTextOnPath(labelsStr[i], labelPath, offsetLabels[i], -10, labelPaint);
if (labelsStr[i] == "Alta")
{
labelPaint.TextSize = 16;
canvas.DrawTextOnPath("Performance", labelPath, 0, 10, labelPaint);
}
}
}
using (SKPath circlePath = new SKPath())
{
var circlePaint = new SKPaint
{
Style = SKPaintStyle.Fill,
Color = SKColors.Black,
IsAntialias = true
};
circlePath.AddCircle(rect.MidX, rect.MidY, 20);
canvas.DrawPath(circlePath, circlePaint);
}
foreach (var entry in Entries.OrderByDescending(e => e.Value))
{
using (SKPath pointerPath = new SKPath())
{
var colors = new[]
{
SKColors.SlateGray,
SKColors.Gray,
SKColors.Black
};
var shader = SKShader.CreateLinearGradient(
new SKPoint(128.0f, 0.0f),
new SKPoint(128.0f,256.0f),
colors,
null,
SKShaderTileMode.Clamp);
var labelPaint = new SKPaint
{
Style = SKPaintStyle.Fill,
StrokeJoin = SKStrokeJoin.Miter,
Shader = shader,
IsAntialias = true
};
canvas.Save();
canvas.RotateDegrees(entry.Value/100*backgroundSweepAngle-120, rect.MidX, rect.MidY);
pointerPath.MoveTo(rect.MidX-10, rect.MidY);
pointerPath.LineTo(rect.MidX, rect.Top);
canvas.DrawCaptionLabels(string.Empty, SKColor.Empty, entry.Value.ToString() + "%", SKColors.Black, 20, pointerPath.LastPoint, SKTextAlign.Center);
pointerPath.LineTo(10+rect.MidX, rect.MidY);
pointerPath.Close();
canvas.DrawPath(pointerPath, labelPaint);
canvas.Restore();
}
}
}
}
}

Oxyplot: Prevent X-Axis label from overlapping

I'm plotting a ScatterPlot showing the last one month's data using OxyPlot. But the X axis labels are overlapping. X axis is a date time axis.
Here's the function that I use to get X Axis.
DateTimeAxis GetXAxis ()
{
var axis = new DateTimeAxis {
Position = AxisPosition.Bottom,
MinorIntervalType = DateTimeIntervalType.Days,
MinorTickSize = 0,
MajorTickSize = 0,
MajorGridlineStyle = LineStyle.None,
MinorGridlineStyle = LineStyle.None,
FontSize = 8,
TextColor = OxyColor.Parse (ColorHex.DarkGray),
Maximum = DateTimeAxis.ToDouble (DateTime.Now),
MajorStep = 1,
};
if (type == Constants.QUESTION_ANSWER_TYPE_WEEK) {
axis.Minimum = DateTimeAxis.ToDouble (DateTime.Now.AddDays (-7));
axis.StringFormat = "ddd";
} else if (type == Constants.QUESTION_ANSWER_TYPE_MONTH) {
axis.Minimum = DateTimeAxis.ToDouble (DateTime.Now.AddDays (-30));
axis.StringFormat = "MMM dd";
} else {
axis.StringFormat = "MMM dd";
}
return axis;
}
How can I prevent them from overlapping? Do I need manually skip labels? or is there a setting in oxyplot which automatically does this? Also, Is it possible to adjust the labels automatically when zooming in and out?
This is how I solved it.
I made use of the property 'MajorStep' of the axis.
var axis = new DateTimeAxis ();
...
DateTime maxDate = .... // Max of DateTime from my data
DateTime minDate = .... // Min of Datetime from my data
double totalDays = (MaxDate - MinDate).TotalDays;
if (totalDays > 8)
axis.MajorStep = (MaxDate - MinDate).TotalDays / 8; // I want to show only 8 labels on X-Axis
And to adjust the labels while Zooming In and Out:
axis.AxisChanged += (sender, e) => {
if (e.ChangeType == AxisChangeTypes.Zoom) {
axis.MajorStep = (DateTimeAxis.ToDateTime (axis.ActualMaximum) - DateTimeAxis.ToDateTime (axis.ActualMinimum)).TotalDays / 8;
}
};

How to create an event handler for objects in array?

I'm making a game in which an ellipse is created whenever random number generated is 6. But all of these objects are in an array. Whenever last object of ellipse is created then event handler only works for it and not for previous objects . I've used sender argument to recognize the source but it gives and exception . Here's my code
public static Ellipse[] greenEllipse = new Ellipse[10];
Game.green++;
Game.greenEllipse[green] = new Ellipse();
SolidColorBrush s = new SolidColorBrush();
s.Color = Colors.Green;
SolidColorBrush blackBrush = new SolidColorBrush();
blackBrush.Color = Colors.Black;
// Set Ellipse's width and color
greenEllipse[green].StrokeThickness = 2;
greenEllipse[green].Stroke = blackBrush;
// Fill rectangle with blue color
greenEllipse[green].Fill = s;
greenEllipse[green].Height = 40;
greenEllipse[green].Width = 45;
greenEllipse[green].RenderTransform = new TranslateTransform { X = -200, Y = -72 };
greenEllipse[green].PointerPressed += OnClickge;
g.Children.Add(greenEllipse[green]);
private void OnClickge(object sender, RoutedEventArgs e)
{
var ocg = sender;
tt.Text = nee.ToString();
if (green1 < 4 && nee != 5 && nee != 6)
{
Game.px += nee * 40;
Game.greenEllipse[Convert.ToInt32(ocg)].RenderTransform = new TranslateTransform { X = px, Y = py };
green1 += nee;
}
if (nee == 5)
{
Game.py += (nee) * (-20);
Game.greenEllipse[Convert.ToInt32(ocg)].RenderTransform = new TranslateTransform { X = px + nee, Y = py };
}
if (green1 > 4)
{
if (nee != 5)
{
green1--;
Game.py += nee * (-20);
Game.greenEllipse[Convert.ToInt32(ocg)].RenderTransform = new TranslateTransform { X = px + nee, Y = py };
}
}
}

Visifire.Charts How to disable vertical lines. WP

Chart is created by code. But I can't disable vertical lines in chart.
It is a code of creating chart:
public void CreateChart() {
CleanChart();
visiChart = new Chart()
{
ToolTipEnabled = true,
Width = 400,
Height = 200,
Padding = new Thickness(0),
Margin = new Thickness(0, 6, 0, -12),
Background = new SolidColorBrush(Colors.White),
};
ChartGrid grid = new ChartGrid()
{
Enabled = false
};
DataSeries dataSeries = new DataSeries();
DataPoint dataPoint;
Axis yAx = new Axis()
{
AxisLabels = new AxisLabels() { Enabled = false },
Grids = new ChartGridCollection() {grid}
};
int i = 0;
var deps = App.CurrentAgreement.Deposits.Deposit.Where(x => x.DepositIliv + x.DepositLink > 0).ToList();
foreach (var dep in deps) {
dataPoint = new DataPoint();
dataPoint.YValue = dep.DepositIliv + dep.DepositLink + dep.UValue + dep.WarrantyValue;
dataPoint.XValue = i;
i++;
dataPoint.LabelText = dataPoint.YValue.Out();
dataPoint.AxisXLabel = DateTime.Parse(dep.DepositDate).ToString("MMM yyyy");
dataPoint.MouseLeftButtonUp += dataPoint_MouseLeftButtonUp;
dataSeries.DataPoints.Add(dataPoint);
}
dataSeries.LabelEnabled = true;
dataSeries.RenderAs = RenderAs.Column;
dataSeries.Color = new SolidColorBrush(Colors.Green);
visiChart.Series.Add(dataSeries);
visiChart.AxesY.Add(yAx);
ChartPlaceHolder.Children.Add(visiChart);
}
But i dont need vertical lines visible. It is a screen of chart.
How i can disable lines??
Help me, please.
You have to disable the Grid lines from AxisX also.
Example:
ChartGrid grid = new ChartGrid()
{
Enabled = false
};
Axis xAx = new Axis();
xAx.Grids.Add(grid);
visiChart.AxesX.Add(xAx);

Resources