2

我的代码中有以下内容。有选择

 legend: {show:true}

把图表弄得一团糟。图例部分太长了，没有图表。我在此处粘贴了图表外观的图像： http ://tinypic.com/view.php?pic=2eqgbgy&s=7

虽然没有图例选项它显示很好，但图表当然没有图例。

在 Chrome 中，我看到以下异常 Uncaught Error: INDEX_SIZE_ERR: DOM Exception 1

<script type="text/javascript"> 
        line2 = [['Living Expenses',1000], ['Loans',2000], ['Credit 
Card',500]]; 
    $j(document).ready(function() { 
        $j.jqplot.config.enablePlugins = true; 
        $j.jqplot('piechartdiv', [line2], { 
            title: 'Where is my money going?', 
            seriesDefaults:{renderer:$j.jqplot.PieRenderer, 
rendererOptions:{sliceMargin:8}}, legend:{show:true} 
        }); 
}); 

</script> 

<div style="width: 450px;margin: 0px auto;"> 
    <div id='piechartdiv'></div> 
</div>

任何帮助表示赞赏。

4

4 回答 4

11

您使用的是Bootstrap还是其他一些 CSS 重置库？

如果您进入 firebug 并选择<table class="jqplot-table-legend" ...>元素，您可能会看到有一个width:100%默认属性设置table元素。您可以在 CSS 布局中修复它：

#piechartdiv table.jqplot-table-legend {
    width:auto;
}
于 2012-02-11T01:22:58.763 回答
1

唯一让我觉得奇怪的是：

$j.jqplot

为什么您的代码中有一些J？除此之外，一切似乎都很好，也许可以尝试在图例上放置一个位置，看看是否可以解决问题，这是一个示例：

plot = $.jqplot('chart2', [arr], {
        grid: {
            drawBorder: true,
            drawGridlines: false,
            background: '#FFFFFF',
            shadow: true
        },
        seriesDefaults: {
            renderer: $.jqplot.PieRenderer,
            rendererOptions: {
                showDataLabels: true
            }
        },
        legend: {
            show: true,
            location: 'e'
        }
    });
于 2010-12-28T07:28:56.500 回答
1

您是否在代码中包含了 jqplot.css 文件。

确保它包含在代码中，并且该文件也存在于您所引用的目录中。

谢谢

于 2012-10-20T10:37:27.157 回答
0

我遇到了类似的事情。尝试检查 CSS 属性 text-align:left

<div id='piechartdiv' style="text-align:left;"></div>

恐怕我不知道为什么，但这些为我解决了错误

于 2011-01-20T20:21:31.400 回答