问题标签 [column-chart]

我想知道是否可以使用一些 JavaScript 库，如highcharts、google charts、amcharts或d3js来创建如下图表：

正如您在图像中看到的，顶部有每列中绘制的 3 个值的摘要，因此需要在顶部有自定义轴标签，可以显示所有这些信息。

并且绘制的每个值还有一个矩形框，其中包含值（即价格）、名称和所属的段。

我创建了一个柱形图，使用 google.visualization.ColumnChart 单击 Google 地图中的标记会弹出该柱形图。已创建一个div，在其上植入柱形图。

它工作正常，但我的问题是我不需要滚动条。所以，任何人都可以更喜欢如何从图表中取出滚动条。

这是我的柱形图代码部分

我已经看到这个SO Q/A但不知何故不符合要求。

所以请帮我解决这个问题。并提前感谢

我创建的图表有一个简单的问题。请参阅此链接。

在这里，如果您看到第一个示例，右侧的“Motivation Level”标签没有完全出现，我们必须将鼠标悬停在它上面才能阅读名称。

我想在不悬停的情况下显示完整名称。我尝试调整图表的宽度，但它不起作用，而是扩大了图表上的区域。

知道如何实现吗？

我在highchart中使用柱形图我想以日期格式显示x轴，我从我的帐户的谷歌分析数据中获取。我想查看x轴上的日期，而不是我的格式想要格式化的方式。它像这样“20151001”，我希望它像这样“01-10-2015”我的数据来自谷歌分析帐户，所以我不能使用 highchart 数据这是我的代码

我从中获取日期的php代码

通过 $date 的 var_dump 我得到这种格式的日期：

从这里编辑的代码

我只是在玩 GWT 图表，但我不太了解它是如何工作的。

我想绘制一个简单的柱形图，其中 x 轴上的书名和 y 轴上的书数。这是代码。

这不起作用，屏幕变为空白。我已经设置了图表大小和options变量中的所有内容。我错过了什么吗？

我正在使用带有日期或月份名称的序数刻度在 x 轴上处理多系列柱形图（不使用时间刻度）。我们有按日期或月份显示的大量数据，同时通过点击服务逐步拉取。由于 rangeBands 或 rangeRoundBands 方法，列缩小并且描述仅限于 svg 宽度。

我们需要允许水平滚动，同时在列上提供一些交互。为此，我们在一个带有 div 和另一个 SVG 文档的 foreignObject 中绘制了所有列及其父 SVG 'g' 元素。

现在，有没有一种方法可以避免 rangeRoundBands，以便列水平分布而不适合可用空间。

我试图根据用户可以手动处理的滑块更改条的高度。

http://jsfiddle.net/h0ow9kLk/2/ 示例代码：

HTML

Javascript

所以更新代码：chartColumn.series[0].data[0].value[0].update(parseInt(fuel));

底部用于尝试更新第一个栏。但是我认为路径是错误的，因为酒吧的高度没有变化。

我试图做的一个例子是这个 http://jsfiddle.net/ZmnWq/74/

有没有什么地方我可以学习如何使用正确的路径获取数据，如果可能的话，有人可以告诉我如何更改数据值。

这个问题听起来很基本，但我对此真的很陌生。感谢所有帮助！

谢谢！

我正在尝试使用以下格式的 json 数据创建列类型 highchart：

X 轴应显示日期值，Y 轴应显示计数。不知何故，我无法以所需的格式转换此 JSON。

这是我的代码。

控制台日志以上面指定的格式显示 JSON。我猜我必须从选项数组中形成 x 和 y 轴值。我该怎么做？

当我在我的实时站点中使用 highchart 时，它减少了演示服务器上图表的第一个日期，它运行良好，但是在实时它会产生问题，这里是快照

第一个标签日期在演示服务器上无法正确查看，它看起来很完美，但在现场它会产生问题。它应该是这样的。

任何帮助将不胜感激

更新

应用您的解决方案后，标签和栏之间有很小的差距，对此有任何解决方案吗？

美好的一天，我有一个谷歌柱形图并且工作完美，但是当我调整浏览器的大小时，柱形图溢出并且不会重新调整大小。我的网站是响应式的，我不想那样放我的条形图。如何让我的柱形图响应？

我从developers.google.com/chart/interactive/docs/gallery/columnchart得到了这个柱形图

这是代码

我也尝试从 div 添加 width="100%" 但它根本不起作用。