Question

我已经推出了下面的代码线图可视化。任何人都告诉我如何在gwt vissualization graph的linechart中设置动态widht？ options.setWidth（1000）;我希望代替1000而不是一些动态值。

在这里输入代码

public class CPUChart extends VerticalPanel{
    private LineChart lineChart;
    private DataTable data;

    public CPUChart(final CPUChartDataQueue cpuChartDataQueue) {
        VisualizationUtils.loadVisualizationApi(new Runnable() {
            public void run() {

                setLayoutData(new FitLayout());
                lineChart = new LineChart(createTable(cpuChartDataQueue), createOptions("CPU Chart"));
                add(lineChart);

            }}, LineChart.PACKAGE);
    }

    private Options createOptions(String title) {
        Options options = Options.create();
        **options.setWidth(1000);
        options.setHeight(300);**
        options.setTitleFontSize(11);
        options.setShowCategories(true);
        options.setLegend(LegendPosition.BOTTOM);
        options.setTitle(title);
        options.setSmoothLine(true);
        options.setAxisFontSize(12);
        options.setColors(Color3D.create("#A4C735", "#4F7512"),Color3D.create("#FF4C4C", "#FF0303"));
        options.setMin(0);
        options.setMax(100);
        options.setTitleY("Percentage(%)");
        options.setTitleX("Time");
        return options;
    }
    private AbstractDataTable createTable(CPUChartDataQueue cpuChartDataQueue) {
        DataTable data = DataTable.create();
        data.addColumn(ColumnType.STRING, "Time");
        data.addColumn(ColumnType.NUMBER, "CPU Usage Percentage");

        Queue<CPUChartData> chartDatas = cpuChartDataQueue.getQue();
        if(chartDatas!=null && chartDatas.size()>0){
            data.addRows(chartDatas.size());
            int i=0;
            for (CPUChartData chartData : chartDatas) {
                data.setValue(i, 0, chartData.getLable());
                data.setValue(i, 1, Integer.parseInt(chartData.getValue()));        
                i++;
            }
        }

        return data;
    }

    public void refreshChart(CPUChartDataQueue cpuChartDataQueue){
        data = DataTable.create();
        data.addColumn(ColumnType.STRING, "Time");
        data.addColumn(ColumnType.NUMBER, "CPU Usage Percentage");

        Queue<CPUChartData> chartDatas = cpuChartDataQueue.getQue();
        if(chartDatas!=null && chartDatas.size()>0){
            data.addRows(chartDatas.size());
            int i=0;
            for (CPUChartData chartData : chartDatas) {
                data.setValue(i, 0, chartData.getLable());
                data.setValue(i, 1, Integer.parseInt(chartData.getValue()));        
                i++;
            }
        }

        lineChart.draw(data,createOptions("CPU Chart"));
    }
}

Answer 1

大多数Google可视化图表都需要明确的像素大小。只有一些FLASH图表支持百分比尺寸解决方法是在窗口中添加onResize处理程序，并在调整浏览器窗口大小时重绘/重新创建图表。

GET线图的动态宽度

1 个答案: