Forum Replies Created by Vishwas R
-
Sorry, controlling the first label on the axes & showing labels at every interval as per position of first label is not available, as of now. Minimum & maximum will set the axis range & not the position from where the axis labeling should start. However, you can disable axis labels & use striplines to achieve this. Below is the code-snippet that shows adding striplines with labels to y-axis.
function addStripLines(chart) { for (var i = chart.axisY[0].minimum; i <= chart.axisY[0].maximum; i += chart.axisY[0].interval) { chart.options.axisY.stripLines.push({ value: i, label: i, labelPlacement: "outside", labelFontColor:"black", labelBackgroundColor: "transparent", color: chart.axisY[0].gridColor }); } chart.render() }Please take a look at this updated JSFiddle for complete code.
—
Vishwas R
Team CanvasJS@fg,
You can use Range Charts like Range Column Chart, Range Area Chart, etc. in this scenario. Please check out gallery for more examples along with source code.
—
Vishwas R
Team CanvasJSYou can perform AJAX request to fetch stripline values & render chart. Please check the code-snippet below.
/* Index.cshtml.cs */ public JsonResult OnGetStriplineData() { List<StripLine> stripLines = new List<StripLine>(); DateTime currentTime = DateTime.Now; DateTime sTime = new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc); stripLines.Add(new StripLine((long)(currentTime - sTime).TotalMilliseconds, "Label 1")); JsonSerializerSettings _jsonSetting = new JsonSerializerSettings() { NullValueHandling = NullValueHandling.Ignore }; return new JsonResult(JsonConvert.SerializeObject(stripLines, _jsonSetting)); } /* Index.cshtml */ $.ajax({ type: "GET", url: "/?handler=StriplineData", contentType: "application/json", dataType: "json", success: function (response) { chart.options.axisX.stripLines = JSON.parse(response); chart.render(); }, failure: function (response) { console.log(response); } });Please take a look at this updated sample project for complete code.
—
Vishwas R
Team CanvasJSIn case of numeric axis chart, labels will be shown at every interval of the axis. Because of this, it’s showing 1 & -1. If there is just one datapoint and your requirement is to show label just for datapoint, you can use category axis (use label instead of x-value). Please take a look at this JSFiddle for an example.
Considering this as duplicate of Single data row barcharts showing 1, -1 rows, hence closing the same.
—
Vishwas R
Team CanvasJSIn case of numeric axis chart, labels will be shown at every interval of the axis. Because of this, it’s showing 1 & -1. If there is just one datapoint and your requirement is to show label just for datapoint, you can use category axis (use label instead of x-value). Please take a look at this JSFiddle for an example.
—
Vishwas R
Team CanvasJSPlease take a look at this JSFiddle for an example on adding background image to the chart.
—
Vishwas R
Team CanvasJSPlease take a look at this Gallery Page for an example on setting color based on datapoint close values in StockChart.
—
Vishwas R
Team CanvasJSYou are using value in labelFormatter instead of label, as you are passing date as label instead of x-value. Please find the updated code-snippet below.
labelFormatter: function(e) { return CanvasJS.formatDate(e.label, "HH:MMTT"); }Please take a look at this updated JSFiddle for complete code.
—
Vishwas R
Team CanvasJSY-axis Striplines can be used to show a horizontal line at any desired value. You can set value property to 250 in your case. Please find the code-snippet below.
axisY: { stripLines: [{ value: 250 }] }
—
Vishwas R
Team CanvasJS
