Highcharts 定制 PHP/MySQL

Question

我正在尝试自定义图表并向我们的客户提供演示以供他们批准。

我们现在面临的一些最终问题是，

1. 问题：在柱状图的高图中是否可以分页。假设我们有 50 或 100 列。

   我们怎样才能避免我们的图表变得拥挤。

   例如看看这个 js fiddle

   http://jsfiddle.net/justin69/4xSNU/1/

2. 问题：如果我们在图表中嵌入图像或徽标并尝试使用jpg/jpeg 将其导出，则会出现错误。

   在 jsfidlle 上它可以工作，

   但在我们的本地主机上，它会给出以下错误消息。

   About to transcode 1 SVG file(s) Converting 551bc090a93c120f987375135e7744db.svg to temp/551bc090a93c120f987375135e7744db.jpg ... ... error ( SVGConverter.error.while.rasterizing.file)
Error while converting SVG. SVG code for debugging:

Answer 1

1.拥挤的图表

a.您是否尝试过旋转标签？这将显着减少您之前拥有的标签上的过度拥挤。

这是你的 Fiddle with label mod：http://jsfiddle.net/kayen/YSwk4/

b. 如果您有很多值并且受 x 轴上的空间限制，您可以将 柱形 类型的图表转换为 条形型图表。

这是您的 Fiddle 条形图 mod：http://jsfiddle.net/kayen/QqPha/

我建议使用第一个选项，因为您可以在同一空间中容纳更多的值，并且图表更清晰。

Answer 2

看看能不能帮到你……

“图表拥挤”

我可以想象三种避免图表“拥挤”的方法：

方法一：让用户选择看什么。

隐藏将visible: false 添加到您的部分或全部系列中，使用它可以让用户选择他想查看的数据。例如：

series: [
            {
                name: ...,
                data: ...,
                visible: false
            },
            ...
        ]

---

如果您选择此示例，您还可以考虑添加一个按钮来显示/隐藏全部，您可以通过以下方式实现：

隐藏所有内容：

for(i=0; i < chart.series.length-1; i++)
    chart.series[i].hide();

显示所有内容：

for(i=0; i < chart.series.length-1; i++)
    chart.series[i].show();

---

方法 2：解决问题

替代方案您可以在图表中使用zoomType: 'x'，允许用户缩放并查看详细数据，然后用户可以滚动缩放到图表的左右两侧或重置缩放并选择另一个要查看的点。

---

方法三：溢出

替代方案您可以创建一个巨大的图表并使用溢出来允许图表 div 可滚动，或者隐藏溢出并通过 jQuery 管理 scrollX 和 scrollY 槽。

---

您能否提供 svg 示例的代码或链接，以便我检查您的代码，看看是否可以帮助您？

谢谢。