Hello,
I am creating chart in asp.net c#,while i am creating chart i want to pass script value from csharp page.
I need to use in csharp code ---> div.innerhtml= javascript call.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SplineSymbols.aspx.cs" Inherits="Graph_Chart.SplineSymbols" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Highcharts Example</title>
<style type="text/css">
</style>
</head>
<body>
<%--<script src="jquery/highcharts.js"></script>
<script src="jquery/series-label.js"></script>
<script src="jquery/exporting.js"></script>
<script src="jquery/export-data.js"></script>--%>
<div id="container" runat="server" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<%--<script type="text/javascript">
Highcharts.chart('container', {
chart: {
type: 'spline'
},
title: {
text: 'Monthly Average Temperature'
},
subtitle: {
text: 'Source: WorldClimate.com'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Temperature'
},
labels: {
formatter: function () {
return this.value + '°';
}
}
},
tooltip: {
crosshairs: true,
shared: true
},
plotOptions: {
spline: {
marker: {
radius: 4,
lineColor: '#666666',
lineWidth: 1
}
}
},
series: [{
name: 'Tokyo',
marker: {
symbol: 'square'
},
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {
y: 26.5,
marker: {
symbol:'url(file:///C:/Users/Amol/Documents/Visual%20Studio%202015/Projects/Graph-Chart/Graph-Chart/Images/snow.png)'
//'url(https://www.highcharts.com/samples/graphics/sun.png)'
}
}, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'London',
marker: {
symbol: 'diamond'
},
data: [{
y: 3.9,
marker: {
symbol: 'url(file:///C:/Users/Amol/Documents/Visual%20Studio%202015/Projects/Graph-Chart/Graph-Chart/Images/snow.png)'
//'url(https://www.highcharts.com/samples/graphics/snow.png)'
}
}, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
</script>--%>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Graph_Chart
{
public partial class SplineSymbols : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
container.InnerHtml = @"<script src='jquery / highcharts.js'></script>< script src = 'jquery/series-label.js'></ script > < script src = 'jquery/exporting.js' ></ script > < script src = 'jquery/export-data.js' ></ script >< script type='text /javascript'>Highcharts.chart('container', { chart:{type: 'spline'},title:{text: 'Monthly Average Temperature'},subtitle:{text: 'Source: WorldClimate.com'},xAxis:{categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']},yAxis:{title:{text: 'Temperature'},labels:{formatter: function() {return this.value + '°';}}},tooltip:{crosshairs: true,shared: true},plotOptions:{spline:{marker:{radius: 4,lineColor: '#666666',lineWidth: 1}}},series: [{name: 'Tokyo',marker:{symbol: 'square'},data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {y: 26.5,marker:{symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)'}}, 23.3, 18.3, 13.9, 9.6]}, {name: 'London',marker:{symbol: 'diamond'},data: [{y: 3.9,marker:{symbol: 'url(https://www.highcharts.com/samples/graphics/snow.png)'}}, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]}]});</ script >";
}
}
}
