FORUMS

Select any forum below to ask question

Home › Forums › Chart Support › Xpages Graph Issues › Reply To: Xpages Graph Issues

August 30, 2018 at 3:34 pm #22448

ajeetkumar786

Hi,

We have tried to do,but still same issues. Please find the below code details.

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:panel style="width:100%">
	<xp:table style="width:100.0%">
		<xp:tr>
			<xp:td>Parameter</xp:td>
			<xp:td>
				<xp:inputText id="inputText1"><xp:this.defaultValue><![CDATA[#{javascript:"[{ label: \"apple\",  y: 10  },{ label: \"orange\", y: 15  },{ label: \"banana\", y: 25  },{ label: \"mango\",  y: 30  },{ label: \"grape\",  y: 28  }]"}]]></xp:this.defaultValue></xp:inputText></xp:td>
		</xp:tr>
		<xp:tr>
			<xp:td></xp:td>
			<xp:td>
				<xp:button value="Save" id="button1">
					<xp:eventHandler event="onclick" submit="false">
						<xp:this.script><![CDATA[alert(document.getElementById("#{id:inputText1}").value)]]></xp:this.script>
					</xp:eventHandler>
				</xp:button>
			</xp:td>
		</xp:tr>
	</xp:table>
</xp:panel>

<!--  CanvasJS Charts -->
<html>
<head>

<script type="text/javascript">
//var dps=[{ label: "apple",  y: 10  },{ label: "orange", y: 15  },{ label: "banana", y: 25  },{ label: "mango",  y: 30  },{ label: "grape",  y: 28  }];
//var dps=document.getElementById("#{id:inputText1}").value;
window.onload = function(){

	require(['CanvasJS'], function(CanvasJS) {
       var dps=document.getElementById("#{id:inputText1}").value;
		var chart = new CanvasJS.Chart("chartContainer", {
			theme: "light1", // "light2", "dark1", "dark2"
			animationEnabled: false, // change to true		
			title:{
				text: "Basic Column Chart"
			},
			data: [
			{
				// Change type to "bar", "area", "spline", "pie",etc.
				type: "column",
				dataPoints: dps
				
				
				
			}]
		});
		chart.render();

	});
}
</script>
</head>
<body>
	<div id="chartContainer" style="height: 370px; width: 100%;"></div>
	<script src="https://canvasjs.com/assets/script/canvasjs.min.js"> </script>
</body>
</html>
<!-- CanvasJS Charts -->

</xp:view>