Google Visualization Сокращающие метки столбцов

Используя API визуализации google, есть способ иметь таблицу с заголовками столбцов, которые сокращены, но, скажем, круговая диаграмма с использованием того же набора данных отображает полную метку столбца?Google Visualization Сокращающие метки столбцов

Вот Snippit из JavaScript:

//create the dashboard and table chart 
    var dashboard = new google.visualization.Dashboard(
      document.getElementById('dashboard_div')); 
    table = new google.visualization.ChartWrapper({ 
     'chartType': 'Table', 
     'containerId': 'chart_div', 
     'view': {'columns': ViewColumns}, 
     'options': { 
      height: 400, 
     }, 
    }); 
    dashboard.bind(table); 

    //bind the data to the table 
    baseData = new google.visualization.DataTable(response); 
    dashboard.draw(baseData); 

//add a column chart bound to the same data 
var columnChart = new google.visualization.ChartWrapper({ 
    'chartType': 'ColumnChart', 
    'containerId': 'column_chart_div', 
    'options': { 
     isStacked: true, 
     height: 400, 
     width: 800, 
    }, 
}); 
columnChart.setDataTable(table.getDataTable()); 
columnChart.draw();

HTML:

<div id="dashboard_div"> 
    <div id="column_chart_div" class="inline"> </div> 
    <div id="chart_div"></div>

источник

2016-11-13 mjr

Я заметил, что есть способ указать классы CSS для строки заголовка (https://developers.google.com/chart/interactive/docs/gallery/table#configuration-options), так что, возможно, есть css решение, которое ограничивало бы ширину моей ячейки. – mjr

Не могли бы вы разместить достаточно своего кода, чтобы мы могли воспроизвести вашу проблему? Я понимаю, что вы ответили самим собой, но, поскольку ваш самоуважение оставляет некоторые из ваших неудовлетворенных потребностей, я не могу не чувствовать, что ваша проблема не полностью решена. Покажите нам код, и мы сможем помочь. –

th.google-visualization-table-th { 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    max-width: 50px; 
} 

th.google-visualization-table-th:hover { 
    white-space: nowrap; 
    overflow: visible; 
}

Это было бы идеально, если бы я мог получить полный текст всплывают при наведении курсора мыши (над верхней частью соседний столбец), но мне не повезло с этим.

источник

2016-11-13 15:59:41 mjr

Google Visualization Сокращающие метки столбцов

ответ

Смежные вопросы