將Highstock放置在SVG中

Question

您能幫我將Highchart放置在SVG元素中而不是HTML中。級聯元素正常工作。我已經完成了jQuery SVG圖。但Highchart拋出一個錯誤13.我能做什麼？

親切的問候

馬庫斯Breitinger

Answer 1

您可以生成圖表DIV，這將有負面保證金。然後使用getSVG（）函數並將其粘貼到svg元素中。

http://api.highcharts.com/highcharts#Chart.getSVG()

Answer 2

不幸的是它不扶持產品，highcharts使得在額外的div圖表，並添加如標籤/ datalabels爲html對象的元素。

但是，您可以將SVG的SVG複製到SVG中。但是你會失去所有附加事件。 像拖放，點擊....

這裏的一個例子。 http://jsfiddle.net/L6SA4/10/

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) { 
     // Create a hidden and not attached div container. 
     var div = $('<div>This is an hidden unatached container.</div>'); 

     // Create the chart 
     div.highcharts('StockChart', { 

      chart: { 
       width: 480, 
       height: 400, 
       events: { 
        load: function() { 
         // If hidden div was generated, take the svg content and put it into svg. 
         var stockSvg = $('svg', this.container); 

         var svgObj = $('#mySvg').svg(); 

         // Force position of highstock 
         stockSvg.attr('x', 20); 
         stockSvg.attr('y', 30); 

         // Replace ugly rect with highstock 
         $('#container', svgObj).replaceWith(stockSvg); 
        } 
       } 
      }, 

      series : [{ 
       name : 'AAPL', 
       data : data, 
       tooltip: { 
        valueDecimals: 2 
       } 
      }] 
     });   

    });