在gwt HTMLPanel中使用JavaScript运行Google图表 我试图从谷歌图表示例中运行一个测试图，它位于我的网页中间的一个HTML面板中。我想对图表进行大量定制，这就是为什么我不想使用从google图表派生的任何类型的api。我想在HTMLPanel中简单地运行javascript。这是我试过的 public class TwitterTimeSeries implements EntryPoint { public void onModuleLoad() { Element script2 = DOM.createElement("script"); DOM.setElementAttribute(script2,"language","text/javascript"); DOM.setElementAttribute(script2,"src","https://www.google.com/jsapi"); Element script = DOM.createElement("script"); DOM.setElementAttribute(script,"language","text/javascript"); script.setInnerText("google.load('visualization', '1.0', {'packages' ['corechart']});" + "google.setOnLoadCallback(drawChart);" + "function drawChart() {" + "var data = google.visualization.arrayToDataTable([['Year', 'Sales', 'Expenses'], ['2004', 1000, 400], ['2005', 1170, 460], ['2006', 660, 1120], ['2007', 1030, 540]]);" + "var options = {title: 'Company Performance'};" + "var chart = new google.visualization.LineChart(document.getElementById('chart_div'));" + "chart.draw(data, options); }" ); HTMLPanel html = new HTMLPanel("<div id=\"chart_div\"></div>"); RootPanel.get().add(html); DOM.appendChild(DOM.getElementById("chart_div"),script); } }; 公共类TwitterTimeSeries实现入口点 { moduleload（）上的公共void{ 元素script2=DOM.createElement（“脚本”）； setElementAttribute（script2，“语言”，“文本/javascript”）； setElementAttribute（脚本2，“src”https://www.google.com/jsapi"); 元素脚本=DOM.createElement（“脚本”）； setElementAttribute（脚本，“语言”，“文本/javascript”）； script.setInnerText（“google.load（'visualization'，'1.0'，{'packages'['corechart']}”） +“google.setOnLoadCallback（绘图图）；” +“函数drawChart（）{” +“var data=google.visualization.arrayToDataTable（['Year'，'Sales'，'Expenses']，['2004'，1000400]，'2005'，1170460]，'2006'，6601120]，'2007'，1030540]；” +“var options={title:'公司绩效'}；” +“var chart=new google.visualization.LineChart（document.getElementById（'chart_div'））；” +chart.draw（数据、选项）；} ); HTMLPanel html=新HTMLPanel（“”）； RootPanel.get（）.add（html）； appendChild（DOM.getElementById（“chart_div”），脚本）； } };

谁能给我指出正确的方向吗

对不起，你不应该直接这么做。你应该使用

大多数图表都有包装器，如果没有包装器，您可以轻松编写自己的包装器

除此之外，编写包装器/小部件是一种很好的做法，因为它们可以很容易地在其他项目中重复使用。
如果包装中缺少一些东西（例如图表外观的一些定制），您仍然可以依赖纯Javascript（JSNI）来实现它

代码应该是这样的：

public class TwitterTimeSeries implements EntryPoint 
{
    public void onModuleLoad() {
        VisualizationUtils.loadVisualizationApi(new Runnable() {
            @Override
            public void run() {
                DataTable dataTable = DataTable.create();
                            dataTable.addColumns(ColumnType.String,"Year");
                            dataTable.addColumns(ColumnType.Number,"Sales");
                            dataTable.addColumns(ColumnType.Number,"Expenses");
                            dataTable.addRows(1)
                            dataTable.setValues(0,0,"2004");
                            dataTable.setValues(0,1,1000);
                            dataTable.setValues(0,2,400);
                            Options options = Options.create();
                            options.set("title","Company Performance");
                            LineChart chart = new LineChart(dataTable,options);
                            panel.add(chart);
                            RootPanel.get().add(panel);
            }
        }, CoreChart.PACKAGE, MotionChart.PACKAGE);
    }
}

---

我目前正在使用gwt的包装器。除了这个包装器，我如何实现纯javascript。我很难找到这个示例。只需对包装器进行子类化，并使用添加一个方法。