问题标签 [plottable]

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 投票
0 回答
1111 浏览

javascript - 从Typescript中的JS替换$(美元符号函数)不起作用

我有一个用 typescript 编写的 angular-2-application,效果很好;但是,我偶然发现了这个问题,$-function 的各种相关答案对我没有帮助。我还包含“plottable”库,这就是问题发生的地方:有一个工具提示教程(恰好是我在图表中需要的)。在本教程中,可以找到以下代码:

我现在的问题是这一行:

我似乎无法在这里找到 $-function 的有效替代品。我有以下问题:

  • 这是 jQuery 吗?(因为我对 jQuery 没有真正的了解,所以我不知道,其余的代码对我来说似乎很像纯 JavaScript)
  • 如何在我的 typescript-code 中替换它以执行与此处相同的操作?

我试过简单地删除它(不会抛出任何语法错误,但也不会显示任何工具提示),但这当然不起作用;我也尝试用它替换它,document.getElementById(tooltipAnchorSelection.node())但这也不起作用

这是一个显示这些工具提示的工作版本的JSFiddle ;因为这是用 JavaScript 编写的,所以它可以工作,但是将完全相同的代码复制到 typescript 会显示美元符号处的语法错误。

感谢您的帮助,我将不胜感激

编辑:我不允许在这个项目中集成 jQuery,所以这样做不能解决我的问题。


PS:我想过将这个问题命名为“可绘制的工具提示在打字稿中不起作用”之类的东西,但是正如 JSFiddle 显示的那样,它们确实以某种方式工作,这似乎是 $-function 的问题,而不是其他任何问题

0 投票
1 回答
172 浏览

angularjs - 从 Angular 指令在 plottablejs 线图上设置工具提示

我得到了一个显示可绘制折线图的角度指令。但是当光标悬停在正在绘制的线时,我需要设置工具提示的值。

我得到了这样的东西:

并用

这很好用:) 然后我尝试从这个例子中添加一些工具提示:http: //jsfiddle.net/gv1xsnkr/

在他们使用 jquery 的示例中,我不想为此导入 jquery

所以我试着这样做

但我得到一个错误

angular.js:14516 TypeError: tooltipAnchor.tooltip 不是函数

任何人有线索热这样做?

0 投票
2 回答
4244 浏览

twitter-bootstrap - 在 Vuejs 单文件组件中包含 bootstrap.js 外部脚本

我正在使用几个外部库在 vue 应用程序中构建带有工具提示的图表。我正在使用单文件组件

我有一个工作小提琴,但无法将它翻译成一个工作组件。

尝试的方法:

  1. <head>在标签中加载 3 个 tooltip-realted 脚本

    • "TypeError: tooltipAnchor.tooltip is not a function"
  2. 加载标签中的 3 个 tooltip-realted 脚本<body>,在已编译 vue 代码的标签之前 ( build.js)

    • "TypeError: tooltipAnchor.tooltip is not a function"
  3. 在钩子中的Chart.vue组件中加载 3 个 tooltip-realted 脚本mounted

    • "TypeError: tooltipAnchor.tooltip is not a function"

图表.vue:

  1. 要求所有三个脚本都位于顶部Chart.vue

    • Bootstrap 无法加载,因为jQuery它没有可用的全局变量

我怀疑当我将它们放入时加载的订单脚本有问题index.html,但我不知道是什么。有谁知道jsfiddle如何编译它的html?我还缺少什么?

0 投票
1 回答
139 浏览

javascript - 如何导入 Plottable.js

我对javascript相当陌生。我在查找如何导入和使用 Plottalbe.js(以及其中的 D3)库时遇到问题。谁能给我看一个使用 Plottable 的 HTML 和 .js 文件的工作示例?我一定是严重失明,因为我在这方面找不到任何东西。

我使用 npm 并将包放入 C:\Users\me\node_modules。

这是我到目前为止所尝试的。请原谅我的代码。我尝试了不同的方法,但仍然失败。

然后是 app.js。

0 投票
1 回答
112 浏览

javascript - 为什么 Plottable 没有显示完整的图表?

我没有错误(最终),但我得到的只是没有任何数据的 x 轴。我错过了什么?我从 vsCode 中的 Live Server 插件运行它。此外,plottable 有两个标签:plottable 和 plottable.js。有没有办法摆脱一个而只使用另一个?因此,当有更多 Plottable 问题时,它们不会分散开来。

你可以在这里找到图片:https ://imgur.com/a/ATiF3tU

HTML

JavaScript

0 投票
1 回答
89 浏览

plotly - Plotly.js - 多层时间轴

有没有办法使用类似于 Plottable.js 的解决方案的 Plotly.js 创建时间轴?

这里的例子。

我计划迁移到 Plotly.js,但我真的爱上了时间轴的这种演示,因为我必须绘制很多时间序列,所以用 plotly 实现类似的东西会很棒。

0 投票
1 回答
21 浏览

matplotlib - 如何通过 matplotlib 在 spyder3 中绘图?

一开始我可以在 Spyder3(变量资源管理器)的右上方窗口中查看绘图但现在没有任何东西被绘制(没有错误)

我想知道我的代码是否有问题:

否则我该怎么办?

0 投票
1 回答
29 浏览

javascript - 从本地存储的 .csv 文件中获取数据以传递到 Plottable.js 表后,从 Promise 中提取值

我试图在其中实现预期结果的项目是运行 Storybook.js 的 TypeScript、React 项目。

我有一个 csv 文件,存储在我的 React 应用程序的公共文件夹中。csv 包含我想用来绘制图表以进行测试的日期和值数据。

就目前而言,我目前使用以下函数来获取数据:

返回:

Plottable.js 需要这种格式的坐标表:

如何从 Promise 中提取数据表?

或者,我可以填充一个值表作为 fetch 函数的一部分吗?

0 投票
1 回答
28 浏览

plottable - Plottable.js entityNearest 没有给我最近的实体

我在 React、Typescript 项目中实现以下代码。

当悬停在我的图表上时,在我的 x 轴(时间)上,我没有得到最近的实体大约 5 年。

我试过换掉entityNearestentityNearestXThenY但它产生了类似的结果。

下面是我的指针交互函数:

指针跟踪也很跳跃。我的数据集是自 1950 年以来每月的黄金价格。我检查了数据集以确保那里没有问题。

在下图中,我的鼠标大致悬停在红色圆圈所在的位置。

在此处输入图像描述

如果我可以提供任何进一步的信息,请告诉我。

0 投票
2 回答
333 浏览

reactjs - ReferenceError:在我的 Next.js 存储库上安装包含 D3 图表的 npm 包后未定义窗口

我有 2 个存储库,一个包含我的所有组件,这些组件被打包并上传到私人提要,一个使用它们。两个 repos 都使用 React 和 TS 以及使用包的 repo 也运行 Next.js

我在组件仓库中使用 Plottable.js 和 D3 构建了一个图表组件。

在将我的包的最新版本安装到我的主仓库后,我收到构建错误,说,

转到它提到的第一行:

对呈现图形的函数的调用以及我在生成图形的函数中对窗口的唯一调用

我收到这些错误,甚至没有在页面上包含组件。

我正在使用 TS 编译器编译我的组件存储库,tsc并且在包含图表组件之前没有任何问题。

我需要做什么来解决这个问题?