• 所有问题

    • EXTJS3.0如何画柱状图

    <link rel="stylesheet" type="text/css"href="ExtJS/resources/css/ext-all.css" />
    <script type="text/javascript" src="ExtJS/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="ExtJS/ext-all.js"></script>
    <script type="text/javascript" src="ExtJS/src/locale/ext-lang-zh_CN.js"></script>
    <script type="text/javascript" src="JScript1.js"></script>
    这是我的引入文件，但是不知道为什么
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(7:61231) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1111) : 应为函数
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:2029) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1466) : 未将对象引用设置到对象的实例。
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\JScript1.js(2:16) : 应为函数
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(7:61231) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1111) : 应为函数
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:2029) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1466) : 未将对象引用设置到对象的实例。
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(7:61231) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1111) : 应为函数
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:2029) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1466) : 未将对象引用设置到对象的实例。
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\JScript1.js(2:16) : 应为函数
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(7:61231) : 需要对象
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:1111) : 应为函数
    Javascript Intellisense Message: C:\Users\jiang\Documents\Visual Studio 2010\Projects\shui\shui\ExtJS\ext-all.js(11:2029) : 需要对象

    举报该问题
    推荐答案   2012-05-10
    用ext3.0实现的，我测试的整个文件如下
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" type="text/css"
    href="../extjs/resources/css/ext-all.css" />
    <script type="text/javascript" src="../extjs/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="../extjs/ext-all.js"></script>
    //以上的3个文件的引用很重要，要和你自己的相关路径对应。
    <script type="text/javascript">
    Ext.chart.Chart.CHART_URL = '../extjs/resources/charts.swf ';//这个是要引用的图形
    Ext.onReady (function(){

    var store = new Ext.data.JsonStore({
    fields:['name', 'visits', 'views'],
    data: [
    {name:'Jul 07', visits: 245000, views: 3000000},
    {name:'Aug 07', visits: 240000, views: 3500000},
    {name:'Sep 07', visits: 355000, views: 4000000},
    {name:'Oct 07', visits: 375000, views: 4200000},
    {name:'Nov 07', visits: 490000, views: 4500000},
    {name:'Dec 07', visits: 495000, views: 5800000},
    {name:'Jan 08', visits: 520000, views: 6000000},
    {name:'Feb 08', visits: 620000, views: 7500000}
    ]
    });

    var panel = new Ext.Panel({
    title: 'ExtJS.com Visits Trend, 2007/2008 (No styling)',
    renderTo: 'container',
    width:500,
    height:300,
    layout:'fit',

    items: {
    xtype: 'linechart',
    store: store,
    xField: 'name',
    yField: 'visits',
    listeners: {
    itemclick: function(o){
    var rec = store.getAt(o.index);
    Ext.example.msg('Item Selected', 'You chose {0}.', rec.get('name'));
    }
    }
    }
    });
    new Ext.Panel({
    iconCls:'chart',
    title: 'ExtJS.com Visits Trend, 2007/2008 (Simple styling)',
    frame:true,
    renderTo: 'container',
    width:500,
    height:300,
    layout:'fit',

    items: {
    xtype: 'linechart',
    store: store,
    url: '../extjs/resources/charts.swf',
    xField: 'name',
    yField: 'visits',
    yAxis: new Ext.chart.NumericAxis({
    displayName: 'Visits',
    labelRenderer : Ext.util.Format.numberRenderer('0,0')
    }),
    tipRenderer : function(chart, record){
    return Ext.util.Format.number(record.data.visits, '0,0') + ' visits in ' + record.data.name;
    }
    }
    });

    // more complex with a custom look
    new Ext.Panel({
    iconCls:'chart',
    title: 'ExtJS.com Visits and Pageviews, 2007/2008 (Full styling)',
    frame:true,
    renderTo: 'container',
    width:500,
    height:300,
    layout:'fit',

    items: {
    xtype: 'columnchart',
    store: store,
    url:'../extjs/resources/charts.swf',
    xField: 'name',
    yAxis: new Ext.chart.NumericAxis({
    displayName: 'Visits',
    labelRenderer : Ext.util.Format.numberRenderer('0,0')
    }),
    tipRenderer : function(chart, record, index, series){
    if(series.yField == 'visits'){
    return Ext.util.Format.number(record.data.visits, '0,0') + ' visits in ' + record.data.name;
    }else{
    return Ext.util.Format.number(record.data.views, '0,0') + ' page views in ' + record.data.name;
    }
    },
    chartStyle: {
    padding: 10,
    animationEnabled: true,
    font: {
    name: 'Tahoma',
    color: 0x444444,
    size: 11
    },
    dataTip: {
    padding: 5,
    border: {
    color: 0x99bbe8,
    size:1
    },
    background: {
    color: 0xDAE7F6,
    alpha: .9
    },
    font: {
    name: 'Tahoma',
    color: 0x15428B,
    size: 10,
    bold: true
    }
    },
    xAxis: {
    color: 0x69aBc8,
    majorTicks: {color: 0x69aBc8, length: 4},
    minorTicks: {color: 0x69aBc8, length: 2},
    majorGridLines: {size: 1, color: 0xeeeeee}
    },
    yAxis: {
    color: 0x69aBc8,
    majorTicks: {color: 0x69aBc8, length: 4},
    minorTicks: {color: 0x69aBc8, length: 2},
    majorGridLines: {size: 1, color: 0xdfe8f6}
    }
    },
    series: [{
    type: 'column',
    displayName: 'Page Views',
    yField: 'views',
    style: {
    image:'bar.gif',
    mode: 'stretch',
    color:0x99BBE8
    }
    },{
    type:'line',
    displayName: 'Visits',
    yField: 'visits',
    style: {
    color: 0x15428B
    }
    }]
    }
    });
    // panel.render('container');

    });
    </script>
    </head>
    <body>

    <div id="container">

    </div>
    </body>
    </html>
    温馨提示：答案为网友推荐，仅供参考
    其他回答
    第1个回答  2012-05-09
    如果用extjs3.0实现比较难的话可以考虑采用其他易用插件，如amichart
    相似回答
    extjs xtype有哪些样式答：基本组件：xtype Class 描述 button Ext.Button 按钮 splitbutton Ext.SplitButton 带下拉菜单的按钮 cycle Ext.CycleButton 带下拉选项菜单的按钮 buttongroup Ext.ButtonGroup 编组按钮(Since 3.0)slider Ext.Slider 滑动条 progress Ext.ProgressBar 进度条 st...
    RaphaelRaphael Javascript(网页矢量图型处理库)答：利用 SVG W3C 推荐标准和 VML 作为基础，Raphael允许开发者轻松创建复杂的图表，如柱状图、走势图和曲线图，甚至能够处理任意复杂度的图像，并支持裁剪、旋转等高级操作。它的跨浏览器特性使得它在 Internet Explorer 6.0 及以上版本中都能稳定运行。2010年的一次重要合并事件中，Raphael 与ExtJS、jQTouch等...
    大家正在搜
    如何做柱状图表格如何做柱状图画柱状图怎么画柱状图简单柱状图怎么画柱状图怎么手画柱状图的画法科学柱状图怎么画word画柱状图
    相关问题
    EXTJS画柱状图怎么做，给个例子
    word怎么画柱状图？
    谁能做个extjs3.0的柱状图？？从后台传过来的 json...
    extjs charts做柱状图怎么设置柱子宽度
    急，急，急 EXTJS画柱状图怎么做，给个例子？
    Extjs chart 柱状图如何让数据显示到 柱状图的上边...
    Extjs中做Chart柱状图统计时怎么限制柱子的最大宽度？
    extjs4 charts做柱状图怎么设置柱子宽度