mootools bubble chart

I'm trying to get this mootools bubble chart demo (http://moochart.coneri.se/) to work in my code but am having a bit of difficulty. Can anyone help with this? Here is the code that I have (I think it's what the documentation is saying, but please correct me if I'm wrong).

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MootoolsChart.aspx.cs" Inherits="BubbleChart.MootoolsChart" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://moochart.coneri.se/dl1/moochart-0.1b1.js"&gt;&lt;/script&gt;
    <script type="text/javascript" src="http://moochart.coneri.se/dl1/moochart-0.1b1-nc.js"&gt;&lt;/script&gt;
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools.js"&gt;&lt;/script&gt;
    <script type ="text/javascript">
        var myChart = new Chart.Bubble('myChart',{
            width: 300,
            height: 200,
            bubbleSize: 20
        });

        myChart.addBubble(10, 20, 30, '#fff', 'Bubble 1');
        myChart.addBubble(0, 40, 20, '#000', 'Bubble 2');

        myChart.redraw();
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div id="myChart"></div>
    </div>
    </form>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <script src="Scripts/mootools-1.2-more.js" type="text/javascript"></script> <script src="Scripts/mootools-1.2-core.js" type="text/javascript"></script> <script src="Scripts/moochart-0.1b1.js.js" type="text/javascript"></script> <script src="Scripts/mainScript.js" type="text/javascript"></script> </head> <body> <div id="chart1"> </div> </body> </html> window.addEvent('domready', function () { var chart1 = new Chart.Bubble('chart1', { width: 600, height: 350, lineColor: '#3f3f3f', zmin: 0, zmax: 100, bubbleSize: 40 }); chart1.bubbles = [ { x: 82, y: 70, z: 90, color: '#318bd6', tip: '<b>HTML</b> is allowed in <span style="color: #71a8d6;">tooltips</span>' }, { x: 21, y: 11, z: 0, color: '#000', tip: 'This bubble is the minimum size' }, { x: 0, y: 0, z: 100, color: '#319344', tip: 'Bubbles can <u>never</u> fall outside the grid' } ]; chart1.redraw(); });

ansaurus

tags:

views:

answers:

mootools bubble chart

related questions