jqPlot 선형 차트 div의 가장자리로 그리지 않음

Question

아름답게 그리는 jqPlot 선 그림이 있는데, 포함되어있는 div 가장자리에 그리게 할 수 없습니다 (이는 내 응용 프로그램에 중요합니다). 내가 할 수있는 모든 옵션을 시도했는데 여백, 패딩 등을 제거하는 것과 관련이 있으며 마지막에는 여전히 상당한 격차가 있습니다. 또한 div 자체가 페이지의 오른쪽 가장자리까지 도달했는지 확인했습니다. 그림은 여기에서 찾을 수 있습니다

optionsObj = { 
    stackSeries: true, 
    axesDefaults: { 
    show: false, 
    showTicks: false, 
    showTickMarks: false 
    }, 
    axes: { 
    grid: { 
     drawBorder: false 
    }, 
    xaxis: { 
     pad: 0, 
     tickOptions: { 
     showGridline: false 
     } 
    }, 
    yaxis: { 
     pad: 0, 
     tickOptions: { 
     showGridline: false 
     } 
    } 
    }, 
    grid: { 
    background: '#ffffff', 
    borderColor: '#888888', 
    borderWidth: 0.5, 
    shadow: false 
    }, 
    seriesDefaults: { 
    lineWidth: 0.5, 
    color: '#1A95ED', 
    fill: true, 
    markerOptions: { 
     show: false 
    } 
    }, 
    series: seriesGroup, 
    gridPadding: { top: 0, right: 0, bottom: 0, left: 0 } 
}; 

: 슬라이더 위의 더 큰 음모에 그래프로 표시되는 그래프의 부분 집합을 선택하는 데 사용됩니다 https://www.dropbox.com/s/js32405l6z16f2m/Capture.PNG

다음은 플롯에 대한 내 옵션 코드입니다. 문제는 그래프가 왼쪽으로 약간 조정되고 슬라이더와 동일한 길이로 채워지지 않기 때문에 선택이 해제되어 있다는 것입니다. 예를 들어 왼쪽 손잡이는 두 번째 봉우리의 왼쪽에 있다고 생각하고 오른쪽 핸들은 4 번째 봉우리의 왼쪽에 있다고 생각합니다. jqPlot에 익숙하지 않은 사람들을 위해

, 사업부 선언이 : 함수 호출에 의해 그려진

<div id="overview" style="width:100%;height:200px"></div> 

:

이외의 다른 차트에 적용되는 어떤 CSS가 없습니다

$.jqplot('overview', eval('([' + sessionStorage.throughputData + '])'), optionsObj); 

HTML 선언의 "style"속성.

Answer 1

차트에 몇 개의 데이터 요소가 있었는지에 따라 선이 꺼져있는 양이 변할 것으로 나타났습니다. 나는 실험을 해본 결과 각 픽셀이 얼마나 많은 픽셀을 가져야 하는지를 결정할 때 jqPlot이 그래프의 총 너비에 대해 "좋은"수의 단위로 끌어 내려고 노력한다는 것을 발견했습니다. 예를 들어 1440 개의 데이터 포인트가있는 경우 그래프의 범위는 1600이 될 것이고 데이터는 끝까지 가지 않을 것입니다. 2880 데이터 포인트가있을 때, 그래프의 범위는 3000이 될 것이고, 다시 한번 데이터가 채워지지는 않을 것입니다. 그러나 데이터의 양은 변경 될 것입니다. 필자는 수동으로 데이터의 "min"과 "max"값을 단위로 설정하여 데이터를 일치 시켰습니다. 0

내가 패드 분노 (최소 및 최대) 줄 수를 곱한 생각 하나 하지에 패드 : 내 자신의

Answer 2

나는 이걸로 무엇을해야한다고 생각 하느냐는 min, max를 설정하거나 진드기를 직접 설정하는 것이다.

사진은 당신이 날짜로 작업하고 있지만 옵션에서 내가 DateAxisRenderer을 사용하지 않는다는 것을 보여줍니다.

I think you should check out my other answer here. 특히 아무것도 작동하지 않으면 틱을 직접 설정하는 것을 고려해야합니다. 나는 당신이 그들을 보여주지 않는다는 것을 압니다.하지만 어쨌든 당신은 그것을 차트의 형식을 정하는 수단으로 사용할 수 있습니다. 내 생각에 당신은 연결된 대답의 첫 번째 샘플에서 관찰 된 것과 비슷한 행동을 경험합니다.

Answer 3

일부 관찰 : 가 나는 X- 축/y 축으로 설정하여 작동있어 차트의 실제 범위 이것은 @brandon이 알아 차린 행동을 설명 할 것입니다. 또한 범위가 틱의 짝수 또는 배수인지 확인하십시오. 나는 정말로 확신하지 못한다. 당신은 이걸 가지고 실험해야만한다. 11 개의 값 집합을 사용하여 양쪽 끝에 공백이 있지만 10 개의 값 집합은 양쪽 끝으로 플러시됩니다.