<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
<script type="text/javascript">
var chart,chart2;
window.onload = function(){
     drawChart("round");
};
function drawChart(preset){
    chart =  new dhtmlXChart({
        view:"scatter",
        container:"chartContainer",
        value:"#b#",
        xValue: "#a#",
        yAxis:{
            title:"Value Y"
        },
        xAxis:{
            title:"Value X"
        },
        preset:preset
    });
    chart.load("../common/data5.json","json");
}
function applyPreset(){
    var preset = document.getElementById("preset").value;
    chart.destructor();
    drawChart(preset);
}
</script>
 
<div style="padding: 5px;">
    <b>Preset:</b>
    <select id="preset" onchange="applyPreset()">
        <option value="round" selected>round</option>
        <option value="square">square</option>
        <option value="diamond">diamond</option>
    </select>
</div>
<div id="chartContainer" style="width:550px;height:250px;border:1px solid #A4BED4;"></div>