2017-12-04 10 views
0

나는 바 차트를 위해 jqplot을 사용하고있는 플러그인을 개발 중이다. 나는 documentaion에서 말한 것과 같은 방식으로 작업을했지만 워드 프레스에서는 작동하지 않지만 아래 코드는 정상적인 PHP에서 작동한다.wordpress에 jqplot을 포함시키는 방법은 무엇입니까?

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="<?php echo WP_PLUGIN_URL; ?>/js/jquery.jqplot.js"></script> 
 
<script type="text/javascript" src="<?php echo WP_PLUGIN_URL; ?>/js/jqplot.barRenderer.js"></script> 
 
<script type="text/javascript" src="<?php echo WP_PLUGIN_URL; ?>/js/jqplot.pieRenderer.js"></script> 
 
<script type="text/javascript" src="<?php echo WP_PLUGIN_URL; ?>/js/jqplot.categoryAxisRenderer.js"></script> 
 
<script type="text/javascript" src="<?php echo WP_PLUGIN_URL; ?>/js/jqplot.pointLabels.js"></script> 
 
<link rel="stylesheet" type="text/css" href="<?php echo WP_PLUGIN_URL; ?>/css/jquery.jqplot.css" /> 
 
<script> 
 
$(document).ready(function(){ 
 
     $.jqplot.config.enablePlugins = true; 
 
     var s1 = [2, 6, 7, 10]; 
 
     var ticks = ['a', 'b', 'c', 'd']; 
 
      
 
     plot1 = $.jqplot('chart1', [s1], { 
 
      // Only animate if we're not using excanvas (not in IE 7 or IE 8).. 
 
      animate: !$.jqplot.use_excanvas, 
 
      seriesDefaults:{ 
 
       renderer:$.jqplot.BarRenderer, 
 
       pointLabels: { show: true } 
 
      }, 
 
      axes: { 
 
       xaxis: { 
 
        renderer: $.jqplot.CategoryAxisRenderer, 
 
        ticks: ticks 
 
       } 
 
      }, 
 
      highlighter: { show: false } 
 
     }); 
 
     
 
     $('#chart1').bind('jqplotDataClick', 
 
      function (ev, seriesIndex, pointIndex, data) { 
 
       $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data); 
 
      } 
 
     ); 
 
    }); 
 
    </script>
<div id="chart1" style="height:400px;width:300px; "></div>

+0

디버그 콘솔에 오류가 있습니까? –

+0

은 워드 프레스가 작동하지 않고 비어 있습니다. 워드 프레스에서 정상적으로 작동합니다. –

+0

브라우저 콘솔에서 자바 스크립트 오류를 ​​확인하십시오. –

답변

0

당신은 제대로 enqueue scripts 종속성이 충족되어 있는지 확인하는 방법에 읽어해야합니다. 귀하의 경우, 여기에 첫 번째 스크립트를 대기열에 넣는 방법이 있습니다. jquery는 WordPress에서 이미 제거해야합니다. 또한 아래에서 수행 한 것처럼 모든 하위 스크립트를 하위 테마 디렉토리 아래로 이동하십시오. 어느 쪽이든 또는 적절한 플러그인을 만들고 루트 플러그인 디렉토리가 아닌 것처럼 그 아래에 중첩 시키십시오.

function wpb_adding_scripts() { 
    wp_register_script('jqplot', get_template_directory_uri() . '/js/jquery.jqplot.js', array('jquery'),'1.1', true); 
    wp_enqueue_script('jqplot'); 
} 


add_action('wp_enqueue_scripts', 'wpb_adding_scripts');