2015-06-15 39 views
1

我正在使用Highchart在我的應用程序中顯示圖表。現在,此圖表在除Safari瀏覽器之外的任何其他瀏覽器中都可以正常工作highcharts不會在dafari瀏覽器中加載。以下是我的代碼來顯示數據:在Safari瀏覽器中未載入高圖表

function Bloodfunction(data) { 
      var BloodPressureCurrentDate = $('#txtDate').val(); 
      DataHR = data; 
      var userid = $("#<%=useriddata.ClientID%>").val(); 
      var Authorizationdata = $("#<%=Authorizationdata.ClientID %>").val(); 
      var YAsisLabel; 
      var UserName; 
      var Url = "/IntelliHAPIs/api/TrendChart/GetParameters?userId=" + userid + "&ChartName=BloodPressure&N=" + 10 + "&BoodPresure=" + parseInt(data) + "&BloodPressureCurrentDate=" + BloodPressureCurrentDate; 
      $.ajax({ 
       url: Url, 
       crossDomain: true, 
       beforeSend: function (xhr) { 
        xhr.setRequestHeader("Authorization", "Basic " + btoa(Authorizationdata)) //Some characters have been replaced for security but this is a true BASE64 of "username:password" 
       }, 
       xhrFields: { 
        withCredentials: true 
       }, 
       cache: false, 
       dataType: 'json', 
       success: function (chartdata) { 

        var FactoreSB = []; 
        var FactoreDB = []; 
        var FactoreHR = []; 
        var GoalRangeSB = []; 
        var GoalRangeLimitSB = []; 

        var GoalRangeDB = []; 
        var GoalRangeLimitDB = []; 


        var NormalRangeLimitDB = []; 
        var NormalRangeLimitHR = []; 
        var SBgoalPoints = []; 
        var Goallimit = []; 
        var Goallimitline = []; 
        var ChartName; 
        var subChartName; 
        UserName = chartdata["PatientName"]; 
        if (chartdata["DataPointsSB"] != null) { 
         for (var i = 0; i < chartdata["DataPointsSB"].length; i++) { 
          FactoreSBRange(FactoreSB, "DataPointsSB", chartdata, i, "GoalPointsSB", GoalRangeSB, GoalRangeLimitSB); 
         } 
        } 
        if (chartdata["DataPointsDB"] != null) { 
         for (var i = 0; i < chartdata["DataPointsDB"].length; i++) { 
          FactoreSBRange(FactoreDB, "DataPointsDB", chartdata, i, "GoalPointsDB", GoalRangeDB, GoalRangeLimitDB); 
         } 
        } 
        if (chartdata["DataPointsHR"] != null) { 

         for (var i = 0; i < chartdata["DataPointsHR"].length; i++) { 
          FactoreSBRange(FactoreHR, "DataPointsHR", chartdata, i, "NormalRangePointsHR", NormalRangeLimitHR, GoalRangeLimitDB); 
         } 
        } 

        var options = new Object(); 
        options.series = new Array(); 
        if (data == 1) { 
         ChartName = "Blood Pressure"; 
         subChartName = "SBP & DBP"; 
         YAsisLabe = "mm Hg"; 
         var sb = 0; 
         var db; 
         if (chartdata["DataPointsSB"] != null) { 
          //createSeriesObject(options.series, FactoreSB, "SBP", 0); 
          options.series[0] = new Object(); 
          options.series[0].name = "SBP"; 
          options.series[0].data = FactoreSB; 
          options.series[0].type = 'spline'; 
          options.series[0].color = '#6699FF'; 
          options.series[0].plotOptions = { 
           spline: { 
            marker: { 
             enable: false 
            } 
           } 
          }; 
          if (chartdata["GoalPointsSB"] != null) { 

           if (GoalRangeSB != 0) { 
            createSeriesObjectRange(options.series, GoalRangeSB, "SBP Goal", 1); 
           } 
           else { 
            createSeriesObjectRange(options.series, GoalRangeLimitSB, "SBP Goal", 1); 
           } 

          } 
          sb = 1; 
         } 
         else { 

          //createSeriesObject(options.series, FactoreDB, "DBP", 0); 
          options.series[0] = new Object(); 
          options.series[0].name = "DBP"; 
          options.series[0].data = FactoreDB; 
          options.series[0].type = 'spline'; 
          options.series[0].plotOptions = { 
           spline: { 
            marker: { 
             enable: false 
            } 
           } 
          }; 
          if (chartdata["GoalPointsDB"] != null) { 

           if (GoalRangeDB != 0) { 
            createSeriesObjectRange(options.series, GoalRangeDB, "DBP Goal", 1); 
           } 
           else { 
            createSeriesObjectRange(options.series, GoalRangeLimitDB, "DBP Goal", 1); 
           } 

          } 
         } 
         if (chartdata["DataPointsDB"] != null) { 
          if (sb == 1) { 
           createSeriesObject(options.series, FactoreDB, "DBP", 2); 
           options.series[2] = new Object(); 
           options.series[2].name = "DBP"; 
           options.series[2].data = FactoreDB; 
           options.series[2].type = 'spline'; 
           options.series[2].color = '#00CC00'; 

           options.series[2].plotOptions = { 
            spline: { 
             marker: { 
              enable: false 
             } 
            } 
           }; 
           if (chartdata["GoalPointsDB"] != null) { 

            if (GoalRangeDB != 0) { 
             createSeriesObjectRange(options.series, GoalRangeDB, "DBP Goal", 3); 
            } 
            else { 
             createSeriesObjectRange(options.series, GoalRangeLimitDB, "DBP Goal", 3); 
            } 

           } 
          } 

         } 




        } 
        else { 
         ChartName = "Blood Pressure"; 
         subChartName = "Heart Rate"; 
         YAsisLabe = "bpm"; 
         if (chartdata["DataPointsHR"] != null) { 

          //createSeriesObject(options.series, FactoreHR, "Heart Rate", 0); 
          options.series[0] = new Object(); 
          options.series[0].name = "Heart Rate"; 
          options.series[0].data = FactoreHR; 
          options.series[0].type = 'spline'; 
          options.series[0].plotOptions = { 
           spline: { 
            marker: { 
             enable: false 
            } 
           } 
          }; 
          if (chartdata["NormalRangePointsHR"] != null) { 
           createSeriesObjectRange(options.series, NormalRangeLimitHR, "Normal Range Heart Rate", 1); 
          } 
         } 
        } 
        //Chart Information 
        if (chartdata["DataPointsSB"] != null || chartdata["DataPointsHR"] != null || chartdata["DataPointsDB"] != null) { 

         //CREATE CHART FOR CONTAINER DIV 
         // document.getElementById('container2').innerHTML = ""; 
         $('#container2').highcharts({ 
          chart: { 
           plotBackgroundColor: null, 
           plotBorderWidth: null, 
           plotShadow: false, 
           style: { 

            color: "red", 
            fontFamily: '\'Lato\', sans-serif', 
            lineHeight: '18px', 
            fontSize: '19px', 
            fontweight: '900' 
           } 
          }, 
          title: {//TOP MESSAGE INFORMAITON 
           text: UserName + ", Latest " + 10 + " Reading ," + ChartName + " - " + subChartName, 
           x: -20 //center 

          }, 
          xAxis: { 

           type: 'datetime', 

           dateTimeLabelFormats: { // don't display the dummy year 


            month: ' %e.%b \'%y', 
            day: ' %e.%b' 

           }, 
           title: { 
            text: '' 
           } 
          }, 
          yAxis: { 
           title: { 
            text: "---" + YAsisLabe + "---" 
           }, 
           min: 0 
          }, 
          plotOptions: { 
           spline: { 
            marker: { 
             enabled: true 
            } 
           } 
          }, 
          series: options.series 

         }); 
         return false; 
        } 
        else { 
         document.getElementById('container2').innerHTML = ""; 
         document.getElementById('container2').innerHTML = "Data does not exist"; 
        } 

       }, 
       error: function (xhr) { 
        alert(JSON.stringify(xhr)); 
       } 
      }); 


     } 

function FactoreSBRange(FactoreValueArrayName, chartdataName, chartdata, loopvalue, NormalRangeName, NormalArrayGoalName, NormalArrayGoalLimitName) { 
      var loop = parseInt(loopvalue); 
      var dateinfo = chartdata[chartdataName][loop].Date1.split("T"); 
      var hour = dateinfo[1].split(":"); 
      var hour1 = hour[0]; 
      var min = hour[1]; 
      var mydate = dateinfo[0].split('-'); 
      var month = mydate[1]; 
      var year = mydate[0]; 
      var day = mydate[2]; 
      var date = dateinfo[0] + " " + dateinfo[1], 
      values = date.split(/[^0-9]/), 
      yearNew = parseInt(values[0], 10), 
      monthNew = parseInt(values[1], 10) - 1, 
      dayNew = parseInt(values[2], 10), 
      hoursNew = parseInt(values[3], 10), 
      minutesNew = parseInt(values[4], 10), 
      secondsNew = parseInt(values[5], 10), 
      formattedDateNew; 

      formattedDateNew = new Date(yearNew, monthNew, dayNew, hoursNew, minutesNew, secondsNew); 
      var newdate = formattedDateNew 
      //var date = "2013-05-12 20:00:00", 

      //var daty = parseInt(day).toString(); 
      var daty = parseInt(dayNew).toString(); 
      var chartDatainfo = chartdata; 
      FactoreValueArrayName[loop] = []; 

      FactoreValueArrayName[loop][0] = Date.UTC(newdate.getFullYear(), newdate.getMonth(), daty); 
      FactoreValueArrayName[loop][1] = parseInt(chartdata[chartdataName][loopvalue].Value); 
      DataPointDate = Date.UTC(newdate.getFullYear(), newdate.getMonth(), parseInt(daty)); 
      var teampdata; 
      if (DataPointDate < teampdata) { 
       DataPointDate = teampdata; 
      } else { 
       teampdata = DataPointDate; 
       DataPointDate = teampdata; 
      } 
      if (chartdata[NormalRangeName] != null) { 

       var normaldata = chartdata[NormalRangeName]; 
       if (DataHR == 1) 
        GoalRangeInf(loop, NormalArrayGoalName, NormalRangeName, chartDatainfo, NormalArrayGoalLimitName); 
       else 
        NormalRangeInf(loop, NormalRangeName, NormalArrayGoalName, chartDatainfo); 
       //NormalRangeInf(loop, normalRangeName, normalRangeArray, chartdata) 
      } 
     } 
+1

好的,你在Javascript控制檯中有什麼錯誤? –

+0

在javascript中沒有錯誤,但圖表未在Safari瀏覽器中加載 – Developer

+0

有趣。我想然後格式化您的數據失敗。你可以附上'FactoreSBRange'方法嗎?數據樣本無法在Safari中呈現?另外,你的意思是哪個Safari版本?我認爲,這個原因是Date()對象,你的數據的格式不適合JS。 –

回答

0

感謝您的幫助。我剛剛找到答案。 FactoreSBRange中的日期無效發生錯誤。 Safari瀏覽器將日期視爲無效錯誤。所以我轉換爲以下日期:

function FactoreSBRange(FactoreValueArrayName, chartdataName, chartdata, loopvalue, NormalRangeName, NormalArrayGoalName, NormalArrayGoalLimitName) { 
      var loop = parseInt(loopvalue); 
      var dateinfo = chartdata[chartdataName][loop].Date1.split("T"); 
      var hour = dateinfo[1].split(":"); 
      var hour1 = hour[0]; 
      var min = hour[1]; 
      var mydate = dateinfo[0].split('-'); 
      var month = mydate[1]; 
      var year = mydate[0]; 
      var day = mydate[2]; 
      var date = dateinfo[0] + " " + dateinfo[1], 
      values = date.split(/[^0-9]/), 
      yearNew = parseInt(values[0], 10), 
      monthNew = parseInt(values[1], 10) - 1, 
      dayNew = parseInt(values[2], 10), 
      hoursNew = parseInt(values[3], 10), 
      minutesNew = parseInt(values[4], 10), 
      secondsNew = parseInt(values[5], 10), 
      formattedDateNew; 

      formattedDateNew = new Date(yearNew, monthNew, dayNew, hoursNew, minutesNew, secondsNew); 
      var newdate = formattedDateNew 
      //var date = "2013-05-12 20:00:00", 

      //var daty = parseInt(day).toString(); 
      var daty = parseInt(dayNew).toString(); 
      var chartDatainfo = chartdata; 
      FactoreValueArrayName[loop] = []; 

      FactoreValueArrayName[loop][0] = Date.UTC(newdate.getFullYear(), newdate.getMonth(), daty); 
      FactoreValueArrayName[loop][1] = parseInt(chartdata[chartdataName][loopvalue].Value); 
      DataPointDate = Date.UTC(newdate.getFullYear(), newdate.getMonth(), parseInt(daty)); 
      var teampdata; 
      if (DataPointDate < teampdata) { 
       DataPointDate = teampdata; 
      } else { 
       teampdata = DataPointDate; 
       DataPointDate = teampdata; 
      } 
      if (chartdata[NormalRangeName] != null) { 

       var normaldata = chartdata[NormalRangeName]; 
       if (DataHR == 1) 
        GoalRangeInf(loop, NormalArrayGoalName, NormalRangeName, chartDatainfo, NormalArrayGoalLimitName); 
       else 
        NormalRangeInf(loop, NormalRangeName, NormalArrayGoalName, chartDatainfo); 
       //NormalRangeInf(loop, normalRangeName, normalRangeArray, chartdata) 
      } 
     } 

在上面newdate給出錯誤給出無效的日期,所以我在代碼轉換它作爲表演和我的問題解決了代碼。

相關問題