问题标签 [react-google-charts]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
1857 浏览

javascript - React-google-chart 不占用选项

react-google-chart用于以图形形式(条形图)显示我的数据,根据要求我必须制作一个dual-y-axis chart

我已经制作了该图表,但问题是该图表没有占用options. Bar当我放置图表时它是一个图表,ColumnChart然后它正在接受选项但不呈现dual-y-axis-chart,如果我将Bar其作为图表类型,它不接受选项

我错过了什么?这是我的代码:

工作示例

编辑

我什至不采取chartEvent任何方式来实现这些目标,如果不是 react-google-chart 那么我对任何开源图表库开放的任何其他库。

0 投票
1 回答
1398 浏览

angular6 - 如何在 angular google chart-angular 2+ 中获取数据事件点击

我在我的角度项目仪表板中使用了谷歌图表。

在此处输入图像描述

通过阅读文档:https ://github.com/FERNman/angular-google-charts ,我使用下面的代码来获取事件(它应该包含我选择的图表元素)

根据文档,当图表中的元素被选中时,会发出 select 事件。

我在我的代码中使用了相同的方法。

html:`

组件.Ts

但我没有得到我选择的值..在此处输入图像描述

我需要成熟度和年份的值......我怎么得到它?我做了什么改变吗??

0 投票
1 回答
129 浏览

reactjs - Google chart range selector chart type as column chart

In the example I added a column chart with range selector. I changed the chartType of range selector to ColumnChart. But its not changing to column chart. can some one help on this.

Also is there is any way to customize the design of the range selector as in this image.

enter image description here

0 投票
0 回答
19 浏览

reactjs - 谷歌图表:自定义范围选择器设计

有没有办法在谷歌图表中自定义范围选择器设计。请看下文。

现存的:

现有设计

必需的:

所需设计

0 投票
0 回答
128 浏览

javascript - 如何使谷歌日历图表移动响应?

我正在尝试在谷歌日历图表中绘制前 50 天。但是当涉及到像移动设备这样的小屏幕时,有些月份就被砍掉了。

我也无法减小单元格宽度。它将影响更大屏幕上的视图。

这是我的html。

<div id="calendar_basic" style = "width: 100%;"></div>

这是我的 Java 脚本。

我尝试提供 100% 的内联样式元素宽度。它适用于所有其他谷歌图表,如条形图、柱形图、饼图,但不适用于这个日历图表。我猜默认单元格大小为 16 是罪魁祸首。但是是否有任何选项可以使其响应。

0 投票
0 回答
969 浏览

javascript - 如何在 JavaScript/React 中创建水平时间线/日历?

我有要显示的事件,如下所示:

在此处输入图像描述

对我来说很重要的功能: 1. 工作日/日历日显示为行而不是列 2. 显示一天的整个 24 小时

我曾尝试使用 react-google 图表。但这完全是一团糟,因为我必须在 0 小时和 24 小时添加虚拟事件,并将每个事件设置为幕后的同一天,因为时间线图只显示同一天的元素。 在此处输入图像描述

我查看了几个日历包,但它们都使用垂直时间线。在此处输入图像描述

你会推荐什么图书馆?
我必须从头开始构建这样的组件吗?

0 投票
1 回答
278 浏览

javascript - 如何更改 React Google Charts 中的语言?

我需要更改我的 Google 图表仪表板的语言/区域设置。我正在为这个项目使用包 react-google-charts。它的分发文件中有一个语言参数:

文件名:index.cjs.js

我怎样才能得到它?要在我的项目中使用这个包,他们给你的只是一个<Chart />组件,我假设到那时库已经加载了。

0 投票
1 回答
1491 浏览

javascript - 反应:如何制作半个甜甜圈

我是 react-google-charts 的新手,我正在开发一个半馅饼甜甜圈,但尽管成功了,但我遇到了一个问题,这个问题是可见半馅饼的百分比总和只有 50%,因为其他 50% 被隐藏。

我怎样才能使那个可见的部分是 100%?

这里你有图表的代码:

如您所见,可见部分的总和仅为 50% 而不是 100%。

在此处输入图像描述

那么,我怎样才能使可见部分占总数的 100%?

您可以在此处查看所有代码:

编辑 stupefied-euclid-wdcvo

0 投票
1 回答
1597 浏览

javascript - 修改 React Google Chart 中的数据

我正在学习反应并获得 API 数据,但我不知道如何在 React Google Charts 中显示。在 React Google Charts 中显示的格式是这样的:

这是我的代码:

我用我的失败尝试评论了这条线。我尝试了很多东西,但我无法显示收到的数据

谢谢你的时间

0 投票
0 回答
84 浏览

javascript - 谷歌折线图在微软边缘工作,但不在谷歌浏览器上

我正在使用 Google Chart 绘制 2 个图表,饼图在两个平台上都可以正常工作,但线条未Google Chrome中显示Line Chart

我不太确定这是否是由于我在绘制图表时缺少的东西,还是由于选项,或者其他我不知道的东西。如果您知道发生了什么,请提供帮助。

在 Microsoft Edge 中:

微软边缘

在谷歌浏览器中:

谷歌浏览器