Plotly.js 是开源的 JavaScript 图表库,它基于 d3.js 和 stack.gl 。是一个高层次的、描述性的图表库。
npm安装:
npm install plotly.js --save
如果您想手动选择要包含的plot .js模块,您可以使用plotly创建一个定制包js/lib/core,并且只加载所需的跟踪类型(例如violin)
// in custom-plotly.js
var Plotly = require('plotly.js/lib/core');
// Load in the trace types for pie, and choropleth
Plotly.register([
require('plotly.js/lib/violin'),
require('plotly.js/lib/groupby'),
]);
module.exports = Plotly;
注:本人将文件放在plugins文件夹下,创建的文件名为custom-plotly.js
使用:
//html
<div id="graph"></div>
//js
let Plotly = require('@/plugins/custom-plotly.js'); //引入
initViolin(){
//渲染violin图
let rows = [
{
EXPRESSION_VALUE: 5.2984,
GROUP_NAME: "group1",
GROUP_SHORT: "group1",
},
{
EXPRESSION_VALUE: 4.2984,
GROUP_NAME: "group1",
GROUP_SHORT: "group1",
},
{
EXPRESSION_VALUE: 4.8884,
GROUP_NAME: "group1",
GROUP_SHORT: "group1",
}