jQuery UI Widgets › Forums › Gauges and Maps › Gauges › Linear Gauge problem parsing NaN
Tagged: gauge, jqxLinearGauge, linear, nan, parsing
This topic contains 1 reply, has 2 voices, and was last updated by Dimitar 11 years, 4 months ago.
-
Author
-
I have a linear gauge set up with a range of -.5 to .5 with a couple of ranges. Whenever the value for this gauge changes, I get the following error in the console and Chrome says it hits over 100 occurrances:
Error: Problem parsing d=”M 80.5 NaN L 106.5 NaN L 106.5 NaN” jqxchart.js:7
a.jqx.svgRenderer.attr jqxchart.js:7
a._performArrowPointerLayout jqxgauge.js:7
a._setValue jqxgauge.js:7
(anonymous function)I have four other gauges on the same page and they all work fine. None of them use negative or decimal values though, just positive whole numbers. Here is my initialization code and the code I am calling to update the gauge’s value:
$(‘#gauge1’).jqxLinearGauge({
orientation: ‘vertical’,
labels: { interval: .5, position: ‘near’ },
ticksMajor: { size: ‘10%’, interval: .2 },
//ticksMinor: minorTicks,
max: .5,
min: -.5,
value: GlassApp.viewModel.GaugeValue1(),
height: ‘400px’,
width: ‘180px’,
pointer: { pointerType: ‘arrow’, size: ‘15%’, style: { fill: ‘#000000’, stroke: ‘#000000’ } },
colorScheme: ‘scheme05’,
background: { visible: false, showGradient: false },
ranges: [
{ startValue: -.5, endValue: -.1, style: { fill: ‘#FF4800’, stroke: ‘#FF4800’ } },
{ startValue: -.1, endValue: .1, style: { fill: ‘#87ceeb’, stroke: ‘#87ceeb’ } },
{ startValue: .1, endValue: .5, style: { fill: ‘#FF4800’, stroke: ‘#FF4800’ } }]
});And to update the gauge’s value I call: $(‘#gauge1’).val(Number(val).toFixed(3));
Any idea what could be going on here?
Hello jclason,
We tested the following example, based on yours but encountered no issues:
<!DOCTYPE html><html lang="en"><head> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxchart.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgauge.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#gaugeContainer').jqxLinearGauge({ orientation: 'vertical', labels: { interval: .5, position: 'near' }, ticksMajor: { size: '10%', interval: .2 }, //ticksMinor: minorTicks, max: .5, min: -.5, value: 0, height: '400px', width: '180px', pointer: { pointerType: 'arrow', size: '15%', style: { fill: '#000000', stroke: '#000000'} }, colorScheme: 'scheme05', background: { visible: false, showGradient: false }, ranges: [ { startValue: -.5, endValue: -.1, style: { fill: '#FF4800', stroke: '#FF4800'} }, { startValue: -.1, endValue: .1, style: { fill: '#87ceeb', stroke: '#87ceeb'} }, { startValue: .1, endValue: .5, style: { fill: '#FF4800', stroke: '#FF4800'}}] }); $('#setValueButton').click(function () { $('#gaugeContainer').jqxLinearGauge('value', .25); }); }); </script></head><body class='default'> <div id="gaugeContainer"> </div> <br /> <br /> <button id="setValueButton" style="display: inline;"> Set value</div></body></html>
Please make sure you are using the latest versions of jQWidgets (3.0.3) and Chrome.
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.