Подсказка Google Chart HTML отображает текст html

Я указал всплывающие подсказки HTML в параметрах, но он по-прежнему отображает текст HTML во всплывающей подсказке вместо результата HTML. Как я могу это исправить, чтобы он отображал результат HTML?

Я создаю представление данных и устанавливаю столбцы следующим образом:

projectView.setColumns([0,1,3,{
    type:'string',
    role:'tooltip',
    calc:function(dt,row){
        var date = dt.getFormattedValue(row,0);
        var totalErrors = dt.getFormattedValue(row,3);
        var percent = Math.round((dt.getValue(row,3)/dt.getValue(row,1))*100);  
        return '<div><b>'+ date +'</b><br><b>Error Percent: </b>' + percent + '<br><b>Total Errors: </b>' + totalErrors + '</div>';
    }
}]);

А варианты такие:

var options = {
    width:850,
    height:375,
    chartArea: {width: '70%', height: '70%',left: 40,top:25},
    hAxis:{format:'MM/dd/yy'},
    vAxis:{logScale:false},         
    series:{0:{type:'line'},1:{type:'area'}},
    tooltip: { isHtml: true }};

Затем рисую график:

var projectChart = new google.visualization.ComboChart(document.getElementById('project_chart_div'));
projectChart.draw(projectView, options);

html charts google-visualization tooltip dataview
person scifirocket    schedule 18.02.2014    source источник

Ответы (1)


arrow_upward
5
arrow_downward

Укажите свойство html как true в вычисляемом столбце для представления:

projectView.setColumns([0,1,3,{
    type:'string',
    role:'tooltip',
    properties: {
        html: true
    },
    calc:function(dt,row){
        var date = dt.getFormattedValue(row,0);
        var totalErrors = dt.getFormattedValue(row,3);
        var percent = Math.round((dt.getValue(row,3)/dt.getValue(row,1))*100);  
        return '<div><b>'+ date +'</b><br><b>Error Percent: </b>' + percent + '<br><b>Total Errors: </b>' + totalErrors + '</div>';
    }
}]);
person asgallant    schedule 18.02.2014
comment
Я пытался решить эту проблему, но нигде не мог найти свойства этой опции: { html: true }. Даже здесь: developers.google.com/chart/interactive/docs/ Я использовал p: {html: true}, но у меня это не сработало. Вы спасли мой день. - person herr; 15.10.2020