标签: google-visualization

我正在创建一个树形图，以使用google 可视化 api提供的树形图工具来可视化代码库中的代码复杂性。默认情况下，每个节点中显示的文本是data 中 ID 列的值。对于我的数据集，ID 很长（文件路径），因此我只想显示文件名（如果可能，请将复杂性放在括号中）。有没有办法指定替代文本来显示每个树形图节点？

请帮助我如何在窗口大小调整时自动调整 Google 图表的大小。

这是一些代码：

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("visualization", "1", {packages:["corechart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        var data = google.visualization.arrayToDataTable([
            ['Day', 'Open ticket', 'Closed ticket'],
            ['Day 1',  10,   400],
            ['Day 2',  170,  460],
            ['Day 3',  60,   1120],
            ['Day 4',  30,   540],
        ]);
        var options = {
            title: 'DAILY GRAPH',
            hAxis: {title: 'NOVEMBER',  titleTextStyle: {color: '#333'}},
            vAxis: {minValue: 0}
        };
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
    }
</script>

任何人都可以帮助获得 Y 轴值的百分比symbol[%]。

我已附上.png。在y axis 0 t0 18数值方面，我希望将其视为 0% 到 18%。 https://i.stack.imgur.com/pF6U0.png

我正在使用谷歌图表中的面积图，我想知道是否有办法设置每条线的不透明度？

看这个例子：

https://developers.google.com/chart/interactive/docs/gallery/areachart?hl=nl#SimpleExample

如果我在参数 array 中使用areaOpacity: 0.0，它将隐藏线条下方的所有颜色，但我希望红线（销售额）的不透明度为 0.0（应该隐藏它）。另一行应该是1.0，有什么办法可以完成它吗？

我已经搜索这个有一段时间了，我感觉我正在寻找错误的关键字。任何帮助表示赞赏！

我需要在谷歌图表标记星期一添加一条垂直线。如图所示。

所有其他事情都已完成..但无法弄清楚如何在每个星期一放置垂直线标记。我找到了这个

hAxis: {
            ticks: ""
        },

谷歌图表中的功能我可以让用户使用..但不知道如何在每个星期一使用它....

我有一个包含 4 条不同颜色线条的图表。使用复选框我可以隐藏/显示特定的行。现在，当显示所有行（选中所有框）时，第 1 行是红色，第 2 行是黄色。当第 1 行隐藏时，第 2 行是红色，第 3 行是黄色。

这可能会让用户感到困惑，所以我希望将这些行分配给特定的列。有办法吗？

我目前为线条分配颜色，如下所示：

    colors: [red, yellow, green, blue]

这张图可能会让事情变得更清楚。

当显示所有行时：

当第 1 行被隐藏时：

我希望我的问题很清楚。

编辑：我还尝试在options.series如下所示分配颜色，但结果相同

series: {
            0: { color: '#e2431e' ,targetAxisIndex: 0},
            1: { color: '#e7711b' ,targetAxisIndex: 1},
            2: { color: '#f1ca3a' ,targetAxisIndex: 0},
            3: { color: '#6f9654' ,targetAxisIndex: 0},       

我正在使用他们 CDN 中的 google script 标签（尝试过身体和头部） <script src="https://wikitags.com/js/googlecharts.min.js"></script>

我的应用程序中的 Google Chart 工作正常，但是它导致我的 Jest 测试失败......

里面的 <ChartComponent />

componentDidMount() {
    // Load the Visualization API and the corechart package.
    console.log('Chart mounted');
    google.charts.load('current', { packages: ['corechart', 'line'] });
    google.charts.setOnLoadCallback(this.getSocialData({ days: this.state.days }));
}

有没有简单的方法来解决这个问题？

我试过的

import React from 'react'
import { mount, shallow } from 'enzyme'
import toJson from 'enzyme-to-json'
import Trends from './Trends'
import Chart from '../entity/Chart'
const body = { subject: { id: 0 } };
const TrendComponent = shallow(<Trends …

在下面的屏幕截图中找到示例问题。当我们使用 google charts 加载图形 UI 时，图例数据即将到来但未正确显示。此问题在笔记本电脑中的频率较低，但在台式机中的频率较高。请指导。

目前我有这个公式：

   =QUERY(A:C,"select SUM(B), SUM(C) where A = date """&text("26/10/2017","yyyy-mm-dd")&""" label SUM(B) '', label SUM(C) '' ")

如果我放第二个标签，这个公式会给我一个错误。该公式仅适用于一个选择和一个标签，但不适用于两个。

搜索时我没有找到这种方法的替代方法？

我也尝试过：

label sum SUM(B) '', SUM(C) ''

我怎么能有多个标签，有什么想法吗？

遵循使用 vue-google-charts 插件的说明：https : //www.npmjs.com/package/vue-google-charts

想要创建组织结构图：https : //developers.google.com/chart/interactive/docs/gallery/orgchart

想我必须使用 onChartReady() 但不知道如何使用组织结构图。

<template >
  <div class="container">
    <GChart
      type="OrgChart"
      :data="chartData"
      @ready="onChartReady"
    />
  </div>
</template>

<script>
import { GChart } from 'vue-google-charts'


  export default {
    components: {
      GChart
    },
    data () {
      return {
              // Array will be automatically processed with visualization.arrayToDataTable function
        chartData: [
          [{v:'Mike', f:'Mike<div style="color:red; font-style:italic">President</div>'},
           '', 'The President'],
          [{v:'Jim', f:'Jim<div style="color:red; font-style:italic">Vice President</div>'},
           'Mike', 'VP'],
          ['Alice', 'Mike', ''],
          ['Bob', 'Jim', 'Bob Sponge'],
          ['Carol', 'Bob', '']
        ],
        options: …