jQWidgets Forums

Tagged: #chartzooming #colorFunction

This topic contains 3 replies, has 2 voices, and was last updated by Hristo 8 years, 4 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

colorFunction not working chart with zooming Posts
February 2, 2017 at 4:41 pm colorFunction not working chart with zooming #91215

wpd
Participant

Hi,

I have chart with zooming functionality i need color change for value greater than 150 if the chart is not zoomed in it works perfectly but when zoomed in it is not working correctly
below is my code
HTML code
<HTML>
<HEAD>
</HEAD>
<BODY>
<div>
<div id=’chartContainer’ style=”width: 800px; height: 500px;”>
</div>
<!– you can optionally render the selecor in this container –>
<div id=’selectorContainer’ style=”width: 500px; height: 100px;”>
</div>
</div>

</BODY>
</HTML>

JAVASCRIPT Code

$(document).ready(function () {
// prepare the data
var source =
{
datatype: “csv”,
datafields: [
{ name: ‘Date’ },
{ name: ‘Open’ },
{ name: ‘High’ },
{ name: ‘Low’ },
{ name: ‘Close’ },
{ name: ‘Volume’ },
{ name: ‘AdjClose’ }
],
url: ‘https://www.jqwidgets.com/jquery-widgets-demo/demos/sampledata/TSLA_stockprice.csv’

};
var dataAdapter = new $.jqx.dataAdapter(source, { async: false, autoBind: true, loadError: function (xhr, status, error) { alert(‘Error loading “‘ + source.url + ‘” : ‘ + error); } });
//console.log(dataAdapter)
var months = [‘Jan’, ‘Feb’, ‘Mar’, ‘Apr’, ‘May’, ‘Jun’, ‘Jul’, ‘Aug’, ‘Sep’, ‘Oct’, ‘Nov’, ‘Dec’];

var toolTipCustomFormatFn = function (value, itemIndex, serie, group, categoryValue, categoryAxis) {
var dataItem = dataAdapter.records[itemIndex];
return ‘<DIV style=”text-align:left”><b>Date: ‘ +
categoryValue.getDate() + ‘-‘ + months[categoryValue.getMonth()] + ‘-‘ + categoryValue.getFullYear() +
‘</b><br />Open price: $’ + dataItem.Open +
‘</b><br />Close price: $’ + dataItem.Close +
‘</b><br />Daily volume: ‘ + dataItem.Volume +
‘</DIV>’;
};

// prepare jqxChart settings
var settings = {
title: “Tesla Motors Stock Price”,
description: “(June 2010 – March 2014)”,
enableAnimations: true,
animationDuration: 1500,
enableCrosshairs: true,
padding: { left: 5, top: 5, right: 30, bottom: 5 },
titlePadding: { left: 30, top: 5, right: 0, bottom: 10 },
source: dataAdapter,
xAxis:
{
dataField: ‘Date’,
minValue: new Date(2012, 0, 1),
maxValue: new Date(2013, 11, 31),
type: ‘date’,
baseUnit: ‘day’,
labels:
{
formatFunction: function (value) {
return value.getDate() + ‘-‘ + months[value.getMonth()] + ‘\” + value.getFullYear().toString().substring(2);
}
},
rangeSelector: {
// Uncomment the line below to render the selector in a separate container
//renderTo: $(‘#selectorContainer’),
size: 80,
padding: { /*left: 0, right: 0,*/top: 0, bottom: 0 },
minValue: new Date(2010, 5, 1),
backgroundColor: ‘white’,
dataField: ‘Close’,
baseUnit: ‘month’,
gridLines: { visible: false },
serieType: ‘area’,
labels: {
formatFunction: function (value) {
return months[value.getMonth()] + ‘\” + value.getFullYear().toString().substring(2);
}
}
}
},
valueAxis:
{
title: { text: ‘Price per share [USD]<br><br>’ },
labels: { horizontalAlignment: ‘right’ }
},

colorScheme: ‘scheme01’,
seriesGroups:
[
{
type: ‘line’,
toolTipFormatFunction: toolTipCustomFormatFn,
series: [
{ dataField: ‘Close’,
displayText: ‘Close Price’,
lineWidth: 1,
colorFunction: function (value, itemIndex, serie, group) {
return (value > 150) ? ‘#CC1133’ : ‘#55CC55’;
},
lineWidthSelected: 1 }

]
}

]
};

$(‘#chartContainer’).jqxChart(settings).on(‘rangeSelectionChanging’, function (event) {
var args = event.args;
// alert(‘rangeSelectionChanging event appear’);
args.instance.description = args.minValue.getFullYear() + ” – ” + args.maxValue.getFullYear();
});

});

February 3, 2017 at 12:43 pm colorFunction not working chart with zooming #91255

Hristo
Participant

Hello wpd,

Thank you for this feedback.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

February 3, 2017 at 2:01 pm colorFunction not working chart with zooming #91257

wpd
Participant

Hi,

Do you have any information when this will be fixed?
As i have submit in a week to my client. please provide estimate.

Thanks.

February 6, 2017 at 8:20 am colorFunction not working chart with zooming #91290

Hristo
Participant

Hello wpd,

Unfortunately, we do not have such practice.
I would suggest you check regularly our “Roadmap”.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.