2013-05-08 2 views
-1

저는 Kendo를 처음 사용하고 있으며 시험 중에 있습니다. 데모에서 제공되는 꺾은 선형 차트 샘플에서 그룹 바인딩을 찾고 있습니다. 나는 원격 json을 데모에 링크 시켰지만 차트를 작동시키지 못했습니다. json 링크로 이동하면 json이 정상적으로 표시됩니다. 어떤 도움이라도 대단히 감사하겠습니다.Kendo 자신의 샘플을 원격 코드로 사용할 수 없습니다.

링크는 데모하기 : http://demos.kendoui.com/dataviz/line-charts/remote-data.html

링크 내 코드에 : http://jsfiddle.net/Grjsn/3/

코드 텍스트 :

XMLHttpRequest cannot load http://demos.kendoui.com/content/dataviz/js/spain-electricity.json . Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.

이 때문이다 다음 JSON로드

<div id="example" class="k-content absConf"> 
    <div class="chart-wrapper" style="margin: auto;"> 
     <div id="chart"></div> 
</div> 

<script> 
function createChart() { 
        $("#chart").kendoChart({ 
         dataSource: { 
          transport: { 
           read: { 
            url: "http://demos.kendoui.com/content/dataviz/js/spain-electricity.json", 
            dataType: "json" 
           } 
          }, 
          sort: { 
           field: "year", 
           dir: "asc" 
          } 
         }, 
         title: { 
          text: "Spain electricity production (GWh)" 
         }, 
         legend: { 
          position: "top" 
         }, 
         seriesDefaults: { 
          type: "line" 
         }, 
         series: 
         [{ 
          field: "nuclear", 
          name: "Nuclear" 
         }, { 
          field: "hydro", 
          name: "Hydro" 
         }, { 
          field: "wind", 
          name: "Wind" 
         }], 
         categoryAxis: { 
          field: "year", 
          labels: { 
           rotation: -90 
          } 
         }, 
         valueAxis: { 
          labels: { 
           format: "N0" 
          }, 
          majorUnit: 10000 
         }, 
         tooltip: { 
          visible: true, 
          format: "N0" 
         } 
        }); 
       } 

       $(document).ready(function() { 
        setTimeout(function() { 
         // Initialize the chart with a delay to make sure 
         // the initial animation is visible 
         createChart(); 

         $("#example").bind("kendo:skinChange", function(e) { 
          createChart(); 
         }); 
        }, 400); 
       }); 
</script> 

답변

관련 문제