将网站添加到本地IIS时不显示AmCharts

时间:2017-06-09 11:01:32

标签: asp.net iis amcharts

我创建了asp.net webform项目,包括使用visual studio的amcharts。当我运行项目时,一切都有效。但是当我在本地IIS上发布它(当前版本是7 - Windows 7 64位)时,它不会显示。我google了一下但还没找到解决方案。 (其中一个是设置IIS以正确处理SVG文件,但它也没有帮助。)是否有人遇到过这个问题?

1 个答案:

答案 0 :(得分:0)

我使用Chrome。当我运行项目时,它工作。但在部署到IIS后无效。

这是代码我减少了额外的部分。

Visual basic.Net代码,从SQL获取数据并创建JS函数字符串

    Protected Sub btn1_Click(sender As Object, e As EventArgs) Handles btn1.Click
    comm.CommandText = "Select DateMeasr, data1, data2 from dbo.Measurements where DateMeasr>'2017-06-13 12:04:30' and DateMeasr<'2017-06-13 17:00:00' Order by DateMeasr"
    If conn.State <> ConnectionState.Open Then conn.Open()
    da.Fill(dtC)
    If dtC.Rows.Count > 0 Then
        DataCollect()
    End If
End Sub

Protected Sub DataCollect()
    Dim sb As New StringBuilder
    Dim strtime As DateTime
    sb.Append("<script type=""text/javascript"">")
    sb.Append("function generateChartData() {")
    For i = 0 To dtC.Rows.Count - 1
        strtime = CDate(dtC.Rows(i).Item(0))
        sb.Append("var newDate = new Date(" + strtime.Year.ToString + ", " + (strtime.Month - 1).ToString + ", " + strtime.Day.ToString + ", " + strtime.Hour.ToString + ", " + strtime.Minute.ToString + ", " + strtime.Second.ToString + ");")
        sb.Append("var data1 = " + dtC.Rows(i).Item(1).ToString + ";")
        sb.Append("var data2 = " + dtC.Rows(i).Item(2).ToString + ";")
        sb.Append("chartData1.push({")
        sb.Append("date: newDate,")
        sb.Append("data1: data1,")
        sb.Append("data2: data2")
        sb.Append("});")
    Next
    sb.Append("}")
    sb.Append("</script>")
    ScriptManager.RegisterStartupScript(btn1, btn1.GetType, "teststring", sb.ToString, False)
End Sub

创建Amchart的Javascript函数

<script type="text/javascript">
       var chart1;
       var chartData1 = [];

       AmCharts.ready(function () {
  
           chart1 = new AmCharts.AmSerialChart();
           chart1.dataProvider = chartData1;
           chart1.dataDateFormat = "YYYY-MM-DD, JJ:NN:SS";
           chart1.categoryField = "date";
           chart1.rotate = true;
           chart1.autoMargins = false;
           chart1.marginLeft = 85;
           chart1.marginTop = 200;
           chart1.pathToImages = "https://www.amcharts.com/lib/3/images/";
 
           chart1.synchronizeGrid = true; // this makes all axes grid to be at the same intervals

           // AXES
           // category
           var categoryAxis1 = chart1.categoryAxis;
           categoryAxis1.parseDates = true; // as our data is date-based, we set parseDates to true
           categoryAxis1.minPeriod = "ss";
           categoryAxis1.minorGridEnabled = true;
           categoryAxis1.axisColor = "#DADADA";
           categoryAxis1.twoLineMode = true;
           categoryAxis1.dateFormats = [{
               period: 'fff',
               format: 'JJ:NN:SS'
           }, {
               period: 'ss',
               format: 'JJ:NN:SS'
           }, {
               period: 'mm',
               format: 'JJ:NN'
           }, {
               period: 'hh',
               format: 'JJ:NN'
           }, {
               period: 'DD',
               format: 'DD'
           }, {
               period: 'WW',
               format: 'DD'
           }, {
               period: 'MM',
               format: 'MMMM'
           }, {
               period: 'YYYY',
               format: 'YYYY'
           }];

           // first value axis (on the left)
           var valueAxis1 = new AmCharts.ValueAxis();
           valueAxis1.offset = 175;
           valueAxis1.position = "right";
           valueAxis1.axisColor = "#04a016";
           valueAxis1.axisThickness = 2;
           chart1.addValueAxis(valueAxis1);

           var valueAxis2 = new AmCharts.ValueAxis();
           valueAxis2.offset = 125;
           valueAxis2.position = "right";
           valueAxis2.axisColor = "#ea0e19";
           valueAxis2.axisThickness = 2;
           chart1.addValueAxis(valueAxis2);

           // GRAPHS
           // first graph
           var graph1 = new AmCharts.AmGraph();
           graph1.valueAxis = valueAxis1; // we have to indicate which value axis should be used
           graph1.lineColor = valueAxis1.axisColor;
           graph1.title = "data1graph";
           graph1.valueField = "data1";
           graph1.hideBulletsCount = 30;
           graph1.bulletBorderThickness = 1;
           graph1.lineThickness = 2;
           chart1.addGraph(graph1);

           var graph2 = new AmCharts.AmGraph();
           graph2.valueAxis = valueAxis2; // we have to indicate which value axis should be used
           graph2.lineColor = valueAxis2.axisColor;
           graph2.title = "data2graph";
           graph2.valueField = "data2";
           graph2.hideBulletsCount = 30;
           graph2.bulletBorderThickness = 1;
           graph2.lineThickness = 2;
           chart1.addGraph(graph2);

           // CURSOR
           var chartCursor1 = new AmCharts.ChartCursor();
           chartCursor1.cursorAlpha = 0.1;
           chartCursor1.fullWidth = true;
           chartCursor1.valueLineBalloonEnabled = true;
           chart1.addChartCursor(chartCursor1);

           // SCROLLBAR
           var chartScrollbar1 = new AmCharts.ChartScrollbar();
           chart1.addChartScrollbar(chartScrollbar1);

           // LEGEND
           var legend1 = new AmCharts.AmLegend();
           legend1.markerLabelGap = 3;
           legend1.spacing = 1;
           legend1.position = "absolute";
           legend1.position = "top";
           chart1.addLegend(legend1);

       });

       function clicktodrawchart() 
		{
           generateChartData();
           chart1.write("chartdiv1");
        }
</script>

Asp.net标签用于显示图表的按钮和div

<div>
  <ajaxToolkit:TabPanel ID="TabPanel3" runat="server" HeaderText="TabPanel3">
                <HeaderTemplate>
                    Charts<br />
                </HeaderTemplate>
                <ContentTemplate>
                <br />
                <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="btn1" EventName="Click" />
    </Triggers>
    <ContentTemplate>
        <asp:Button runat="server" ID="btn1" Text="Get data from DB" />
    </ContentTemplate>
    </asp:UpdatePanel>
    <br />
    <input id="btnforchart" value="Click to draw charts" type="button" style="color: black; font-size:15px; padding:4px;" onclick="clicktodrawchart()" />
    <div id="chartdiv1" style="width: 400px; height: 1000px; position: absolute; top: 260px; left: 40px; border: 2px solid #9ccfed;"></div>
                        </ContentTemplate>
            </ajaxToolkit:TabPanel>
     </ajaxToolkit:TabContainer>
    </div>