将 Google 日历数据与基于 D3.js 的日历集成

Question

我最初是从一个按预期工作的 fullCalendar.js 实现开始的。但是，当我开始自定义 UI 时，问题就出现了。经过一番辛劳，我决定放弃 fullcalendar 的实现，并在视觉方面寻求更灵活的东西。

我已经使用 javascript 多年，并且已经熟悉了基础知识。我不认为自己是专家（至少现在还不是）。就制作视觉效果而言，D3.js 提供了更大的灵活性，但就我的专业知识而言，我似乎已经碰壁了。集成 Google 的日历 API（在 d3 界面中呈现日历数据）对我来说是个很大的问题。就我的理解而言，我觉得我有点碰壁了。

我正在使用 Cal-Heatmap（基于 d3 v3）来启动和运行日历。我的问题在于整合谷歌日历数据。老实说，我不知道从哪里开始或如何最好地去做。我在 javascript 中使用 API 并没有太多经验，并且正在继续研究如何最好地做到这一点。

与此同时，我将把它发布到社区以获得一些指导。我希望从中学习并提高我的知识和专业知识。

Answer 1

对于初学者，您可以查看documentation 中提供的quickstart projects 以更好地了解API。

要在不编写任何代码的情况下试用并查看 API 可以做什么，请访问 APIs Explorer。尝试使用calendar.events.list，将您的 Google 电子邮件作为日历 ID。 （您需要启用OAuth 2.0 授权。）

当您已经熟悉 API 的使用时，您可以访问 Google Charts，其中包含受 D3 日历可视化启发而实现 Calendar Chart 的示例。