如何在php中ajax成功后生成图形?

问题描述 投票:2回答:1

码:

<?php 
    include('config.php'); 
?>
<html>
    <head>
        <style>
            html,
            body,
            #myChart {
                height: 100%;
                width: 100%;
            }
        </style>
    </head>
<body>

    <select id="jid">
        <option>Select Job</option>
        <option value="jid1">Java Developer</option>
        <option value="jid2">Dot Net Developer</option>
        <option value="jid3">PHP Developer</option>
    </select>
    <div id='myChart'></div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    <script>
    zingchart.MODULESDIR = "https://cdn.zingchart.com/modules/";
    ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "ee6b7db5b51705a13dc2339db3edaf6d"];
    </script>
    <script>
        $(document).ready(function(){
            $("#jid").change(function(){
                jid = $(this).val();
                $.ajax({
                    type:"POST",
                    data:{"jid":jid},
                    url:"success.php",
                    success:function(data){
                        var myData = [data];
                        var myConfig = {
                            "graphset": [{
                                "type": "bar",
                                "title": {
                                    "text": "Resume Tracking System"
                                },
                                "scale-x": {
                                    "labels": ["Uploaded", "Shortlist", "Interview", "Final", "Offer"]
                                },
                                "series": [{
                                    "values": myData
                                }]
                            }]
                        };
                        zingchart.render({
                            id: 'myChart',
                            data: myConfig,
                            height: "100%",
                            width: "100%"
                        });
                    }
                });
            });
        });
    </script>
</body>
</html>

success.php

<?php 
include('config.php');
$jid = $_POST['jid'];
$sql = mysqli_query($con,"select * from test where jid='".$jid."'");
while($row = mysqli_fetch_array($sql))
{
    echo $row['val'];
}

?>

我正在尝试使用jquery ajax生成更改下拉值的动态图。现在,当我调用ajax成功值时,我在这里做什么,然后它不生成图形但是手动输入值而不是data我输入20然后图形生成成功。我不知道为什么我做错了?请帮我。

谢谢

javascript php jquery ajax graph
1个回答
0
投票

zingcharts文档说明系列数据应采用以下格式:

{
  "type": "bar", /* or "vbar" */
  "series": [
    {"values":[20,40,25,50,15,45,33,34]},
    ]
}

console.log(myData)并确保它匹配

© www.soinside.com 2019 - 2024. All rights reserved.