2012-01-31 4 views
2

배경 이미지 위에 그래프를 플로팅하려면 어떻게합니까?jQuery Flot : 배경 이미지 위에 그래프를 그리는 방법은 무엇입니까?

몇 가지 방법을 시도했지만 아무 효과가 없습니다. Argh;)

아래 코드는 이미지 만 표시되지만 그래프는 표시되지 않습니다. 어째서? 그래프가 이미지 뒤에 그려지기 때문일 수 있습니까? 내가 도움이되기를 바랍니다.

미리 감사드립니다.

var data = [ [ ["overview_track_v2.png", -36627, -72447, 35374, 109983] ] , [ [-36627, 35374 ], [-72447, 109983] ] ]; 

    var options = { 
       series: { images: { show: true } }, 
       xaxis: { min: -36627, max: 35374 }, 
       yaxis: { min: -72447, max: 109983 }, 
       lines: { show: true }, 
       grid: { hoverable: true, clickable: true }, 

      }; 

      var graph = $.plot.image.loadDataImages(data, options, function() { 
       $.plot($("#graphPosition"), data, options); 
      }); 
+2

- 그것은 미리 렌더링 그래프에 그리드를 추가하는 것입니다. 즉 당신의 이미지는 ** 그래프 일 것입니다. 모든 flot은 축 추가입니다. – Ryley

+0

확인. 이 정보에 감사드립니다. – OrangeTux

답변

1

을 수행하는 쉬운 방법은 FLOT의 자리 표시 자입니다 그리드가 어떤 배경 색상이 없습니다 확인 만드는 DIV의 배경으로 이미지를 넣어하는 것입니다.

+0

이것은 사실이며 쉽게 수행 할 수 있습니다. 그러나 FYI에서 플롯을 이미지로 저장하는 것과 같은 다른 플러그인을 사용하는 경우에는 배경이 포함되지 않습니다. – ChelseaStats

1

의견 작성자가 틀렸습니다. 나는 이것이 당신이 원하는 믿는 :

var data = [ 
      [["overview_track_v2.png", -36627, -72447, 35374, 109983]], 
      { data: [[-36627, 35374 ], [-72447, 109983]]], 
       images: {show: false}, bars: {show: false}, points: {show: false}} 
      ]; 

또는 무슨 일이 일어나고 있는지 좀 더 명확하게하기 위해 : 그냥 이미지 플러그인이하는 일이다

var data = [ 
      { data: [["overview_track_v2.png", -36627, -72447, 35374, 109983]], 
       images: {show: true}, bars: {show: false}, points: {show: false}, lines: {show: false}}, 
      { data: [[-36627, 35374 ], [-72447, 109983]]], 
       images: {show: false}, bars: {show: false}, points: {show: false}, lines: {show: true}} 
      ]; 
관련 문제