Google圖表類別過濾器-隱藏html標記或將元素轉換為鏈接

Question

是否有人知道如何在類別過濾器中隱藏html標簽或將其轉換為html鏈接？ 我遇到以下問題：

在圖表表的其中一列中，我提供了html鏈接。 我在ChartWrapper()設置屬性allowHtml:true 。 在表格中，鏈接顯示正確。 當我對該列進行過濾時，下拉列表將獲取包括html在內的整個列的值。 不幸的是ControlWrapper()沒有屬性allowHtml。 這是過濾器的外觀。

過濾器的屏幕截圖

Answer 1

從CategoryFilter刪除html，
對於數據表列中的每個單元格，
將value屬性（ v:用於要在過濾器中顯示的值，
以及鏈接的格式化值屬性（ f: ：）

請參閱以下工作片段...

 google.charts.load('current', { callback: function () { var data = new google.visualization.DataTable({ cols: [ {label: 'Link', type: 'string'} ], rows: [ {c:[{v: 'Test 1', f: '<a href="https://www.google.com/">Test 1</a>'}]}, {c:[{v: 'Test 2', f: '<a href="https://www.google.com/">Test 2</a>'}]}, {c:[{v: 'Test 3', f: '<a href="https://www.google.com/">Test 3</a>'}]}, {c:[{v: 'Test 4', f: '<a href="https://www.google.com/">Test 4</a>'}]}, {c:[{v: 'Test 5', f: '<a href="https://www.google.com/">Test 5</a>'}]}, {c:[{v: 'Test 6', f: '<a href="https://www.google.com/">Test 6</a>'}]} ] }); var dashboard = new google.visualization.Dashboard( document.getElementById('dashboard') ); var control = new google.visualization.ControlWrapper({ controlType: 'CategoryFilter', containerId: 'control', options: { filterColumnIndex: 0, ui: { allowTyping: false, } } }); var chart = new google.visualization.ChartWrapper({ chartType: 'Table', containerId: 'table', options: { allowHtml: true } }); dashboard.bind(control, chart); dashboard.draw(data); }, packages: ['controls', 'table'] }); 

 <script src="https://www.gstatic.com/charts/loader.js"></script> <div id="dashboard"> <div id="control"></div> <div id="table"></div> </div> 

---

注意：不確定如何獲取實際鏈接以顯示在過濾器中，
但這可能會干擾實際選擇值