x 축의 눈금 레이블 변경

Question

x 축에 표시된 눈금에 y 축 값을 지정합니다 (값만 변경해야하며 위치는 변경하지 말아야 함). 이하

https://jsfiddle.net/sonal215/337afs1h/1/

보다는 1, 2는 X 축 상에 도시되고 JsFiddle, 난 10 (5) (각각의 y 축 값) x 축 눈금 라벨에 표시해야 할 것이다.

틱 값을 설정하는 라이브러리에 jqplot-xaxis-tick 클래스가 있습니다. 디버깅을 시도했습니다.

<div class="jqplot-axis jqplot-xaxis" style="position: absolute; width: 180px; height: 18px; left: 0px; bottom: 0px;"><div class="jqplot-xaxis-tick" style="position: absolute; left: 47px;">1</div><div class="jqplot-xaxis-tick" style="position: absolute; left: 127px;">2</div></div> 

어떤 식 으로든 라이브러리의 값을 표시하는 논리를 변경할 수 있으면 작동합니다. 또는 다른 방법이 있습니다.

는 작성 후에

Answer 1

당신은 jqplot-xaxis-tick 된 div를 조작 할 수 있도록하고 s1 데이터 배열에서 그들에게 y 값을 지정하십시오.

$(document).ready(function() { 
    var s1 = [ 
    [1, 10], 
    [2, 5] 
    ]; 
    plot1 = $.jqplot('chart1', [s1], { 
    seriesColors: ["#EB2300", "#FFCC00"], 
    seriesDefaults: { 
     renderer: $.jqplot.BarRenderer, 
     rendererOptions: { 
     varyBarColor: true, 
     barWidth: 30, 
     barMargin: -30 
     }, 
     pointLabels: { 
     show: true 
     } 
    }, 
    grid: { 
     drawBorder: false 
    }, 
    axes: { 
     xaxis: { 
     renderer: $.jqplot.CategoryAxisRenderer 
     }, 
     yaxis: { 
     tickOptions: { 
      show: false 
     }, 
     rendererOptions: { 
      drawBaseline: false 
     } 
     } 
    } 
    }); 
//assign x values with y values// 
$('.jqplot-xaxis-tick').each(function(i,elem) { 
     $(this).text(s1[i][1]); 
    }); 
}); 

은 바이올린의 작업 예를 참조하십시오

https://jsfiddle.net/337afs1h/2/