HighCharts：缩小图表大小答案

【问题标题】：HighCharts: Reduce size of chartHighCharts：缩小图表大小
【发布时间】：2013-03-26 15:17:06
【问题描述】：

有谁知道如何减小这个饼图的大小？我正在使用 Lazy High Charts gem。

return LazyHighCharts::HighChart.new('pie') do |f|
      f.chart({:defaultSeriesType=>"pie" , :margin=> [0, 0, 0, 0],  backgroundColor: "#F5F5F5", renderTo: "mediamix#{akid.to_s}"} )
      f.series({:type=> 'pie', :name=> "Count",:data=> data_val, borderWidth: 0})
      f.title({ :text=> nil})
      f.plot_options({:pie=>{:allowPointSelect=>true, :cursor=>"pointer" , dataLabels: {enabled: true}, showInLegend: false}})
    end

【问题讨论】：

标签： highcharts lazy-high-charts

【解决方案1】：

您还可以通过 Highchart API 显式定义宽度和高度：

 $('#container').highcharts({
       chart: {
                height: 200,
               width:100
            });

【讨论】：

【解决方案2】：

Highcharts 渲染图表以填充您在 renderTo 选项中指定的包含 div。在您的情况下，您正在指定：

renderTo:"mediamix#{akid.to_s}"

我不使用 Lazy Highcharts Gem，所以我不知道这是指什么，但是您需要查看代码以了解此 div 的定义位置，并将其高度和宽度设置为您需要的大小。

【讨论】：

我正在动态生成 DIV ID，如您所见 (mediamix#{akid.to_s}) ...因此我无法从样式表中设置这个未知 ID 的样式。 ID 在 high_chart 命令中使用 = high_chart("mediamix#{f.id.to_s}", Gakie.pie(f.id))
你必须以某种方式给 div 一个大小。给它一个类，设置它的高度/宽度属性，或者使用 javascript/jquery 修改它的大小。