zoukankan      html  css  js  c++  java
  • 使用FusionCharts Free显示图表(JSP)

    FusionCharts Free的下载地址:http://www.fusioncharts.com/goodies/fusioncharts-free/

    接下来在jsp页面中引入js

    <script type="text/javascript" src="FusionChartsFree/JSClass/FusionCharts.js"></script>

    然后写入

    1 <script type="text/javascript">
    2         var chart = new FusionCharts("FusionChartsFree/Charts/FCF_Column3D.swf", "column1", "800", "600");
    3         chart.setDataURL("FusionChartsFree/Gallery/Data/Column3D.xml");
    4         chart.render("div1");
    5 </script>

    第二行的参数分别为:要显示图形的SWF地址,图形的id(可以任意起,但是一个页面有多个图形时是唯一的),图形的宽,图形的高;
    第三行是设置要显示数据XML的地址;

    第四行是渲染图形参数是DIV的id;

    附:

     1 <%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
     2 <%
     3 String path = request.getContextPath();
     4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
     5 %>
     6 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
     7 <html>
     8   <head>
     9     <base href="<%=basePath%>">
    10     
    11     <title>Demo</title>
    12     <script type="text/javascript" src="FusionChartsFree/JSClass/FusionCharts.js"></script>
    13   </head>
    14   
    15   <body>
    16     <div id="div1"></div>
    17     <script type="text/javascript">
    18         var chart = new FusionCharts("FusionChartsFree/Charts/FCF_Column3D.swf", "column1", "800", "600");
    19         chart.setDataURL("FusionChartsFree/Gallery/Data/Column3D.xml");
    20         chart.render("div1");
    21     </script>
    22   </body>
    23 </html>

    显示效果:

  • 相关阅读:
    vue 组件的简单使用01
    vue 绑定 class 和 内联样式(style)
    input select 值得绑定与获取
    computed 计算属性
    v-for 循环 绑定对象 和数组
    过滤器 filter
    v-model 双向数据绑定以及修饰符
    v-on 绑定单个或多个事件
    v-bin:href 绑定链接
    .net core自动发送后台请求写法
  • 原文地址:https://www.cnblogs.com/yiban/p/FusionChartsFree.html
Copyright © 2011-2022 走看看