ikiw/customLineColumnChart.js

## customLineColumnChart.js
<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
		<title>SAP UI development toolkit for HTML5 in 20 Seconds</title>
		<!-- 1.) Load the toolkit (from a remote server), select theme and control library -->
		<script id="sap-ui-bootstrap"
		type="text/javascript"
		src="/sapui5/resources/sap-ui-core.js"
		data-sap-ui-theme="sap_goldreflection"
		data-sap-ui-libs="sap.ui.commons,sap.viz"></script>
		<script>
	var oModel = new sap.ui.model.json.JSONModel({
		businessData : [
			{Country :"Canada",profit:10},
			{Country :"China",profit:12},
			{Country :"France",profit:30},
			{Country :"Germany",profit:25},
			{Country :"India",profit:8},
			{Country :"United States",profit:19}
		]
	});

    // A Dataset defines how the model data is mapped to the chart
	var oDataset = new sap.viz.ui5.data.FlattenedDataset({

		// a Bar Chart requires exactly one dimension (x-axis)
		dimensions : [
			{
				axis : 1, // must be one for the x-axis, 2 for y-axis
				name : 'Country',
				value : "{Country}"
			}
		],

		// it can show multiple measures, each results in a new set of bars in a new color
		measures : [
		    // measure 1
			{
				name : 'Profit', // 'name' is used as label in the Legend
				value : '{profit}' // 'value' defines the binding for the displayed value
			}
		],

		// 'data' is used to bind the whole data collection that is to be displayed in the chart
		data : {
			path : "/businessData"
		}

	});

    // create a Bar chart
    // you also might use Combination, Line, StackedColumn100, StackedColumn or Column
    // for Donut and Pie please remove one of the two measures in the above Dataset.
	var oCChart = new sap.viz.ui5.Column({
		width : "600px",
		height : "400px",
		title : {
			visible : true,
			text : 'Profit and Revenue By Country'
		},
		dataset : oDataset,
		});

    // attach the model to the chart and display it
	oCChart.setModel(oModel);
	oCChart.placeAt("uiArea");
	oCChart.attachInitialized(this,function(){
		var aPlot  = d3.selectAll(".v-m-main");
		var height = $(".v-m-main>rect").attr("height");
		var width = $(".v-m-main>rect").attr("width");
		var xLineStartingPoint = $(".v-m-yAxis>rect").attr("width");
		debugger;
		var hLine = aPlot.append("line")
								 .attr("x1",xLineStartingPoint)
								 .attr("y1", height / 2)
								 .attr("x2", width)
								 .attr("y2", height / 2)
								 .attr("stroke", "black")
								 .attr("stroke-width", 1);
			});
		</script>
	</head>
	<body class="sapUiBody">
		<div id="uiArea"></div>
	</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
	<title>SAP UI development toolkit for HTML5 in 20 Seconds</title>
	<!-- 1.) Load the toolkit (from a remote server), select theme and control library -->
	<script id="sap-ui-bootstrap"
	type="text/javascript"
	src="/sapui5/resources/sap-ui-core.js"
	data-sap-ui-theme="sap_goldreflection"
	data-sap-ui-libs="sap.ui.commons,sap.viz"></script>
	<script>
	var oModel = new sap.ui.model.json.JSONModel({
	businessData : [
	{Country :"Canada",profit:10},
	{Country :"China",profit:12},
	{Country :"France",profit:30},
	{Country :"Germany",profit:25},
	{Country :"India",profit:8},
	{Country :"United States",profit:19}
	]
	});

	// A Dataset defines how the model data is mapped to the chart
	var oDataset = new sap.viz.ui5.data.FlattenedDataset({

	// a Bar Chart requires exactly one dimension (x-axis)
	dimensions : [
	{
	axis : 1, // must be one for the x-axis, 2 for y-axis
	name : 'Country',
	value : "{Country}"
	}
	],

	// it can show multiple measures, each results in a new set of bars in a new color
	measures : [
	// measure 1
	{
	name : 'Profit', // 'name' is used as label in the Legend
	value : '{profit}' // 'value' defines the binding for the displayed value
	}
	],

	// 'data' is used to bind the whole data collection that is to be displayed in the chart
	data : {
	path : "/businessData"
	}

	});

	// create a Bar chart
	// you also might use Combination, Line, StackedColumn100, StackedColumn or Column
	// for Donut and Pie please remove one of the two measures in the above Dataset.
	var oCChart = new sap.viz.ui5.Column({
	width : "600px",
	height : "400px",
	title : {
	visible : true,
	text : 'Profit and Revenue By Country'
	},
	dataset : oDataset,
	});

	// attach the model to the chart and display it
	oCChart.setModel(oModel);
	oCChart.placeAt("uiArea");
	oCChart.attachInitialized(this,function(){
	var aPlot = d3.selectAll(".v-m-main");
	var height = $(".v-m-main>rect").attr("height");
	var width = $(".v-m-main>rect").attr("width");
	var xLineStartingPoint = $(".v-m-yAxis>rect").attr("width");
	debugger;
	var hLine = aPlot.append("line")
	.attr("x1",xLineStartingPoint)
	.attr("y1", height / 2)
	.attr("x2", width)
	.attr("y2", height / 2)
	.attr("stroke", "black")
	.attr("stroke-width", 1);
	});
	</script>
	</head>
	<body class="sapUiBody">
	<div id="uiArea"></div>
	</body>
	</html>