|
 |
| |
สอบถามเรื่องวิธีทำให้ graph ให้แสดง 2อันใน 1 หน้า ผมยังไม่ค่อยเข้าใจว่าทำไรผิด |
| |
 |
|
|
 |
 |
|
มันไม่ขึ้นแสดงพร้อม 2 อันแต่มันขึ้นแสดงที่ละอันผมไม่เข้าใจว่าผิดตรงไหน
Code (PHP)
<?php
$dataPoints = array(
array("y" => 30165500, "label" => "Chongqing"),
array("y" => 24183300, "label" => "Shanghai"),
array("y" => 21707000, "label" => "Beijing"),
array("y" => 15029231, "label" => "Istanbul"),
array("y" => 14910352, "label" => "Karachi"),
array("y" => 14399000, "label" => "Dhaka"),
array("y" => 13200000, "label" => "Moscow"),
array("y" => 13081000, "label" => "Guangzhou"),
array("y" => 12528300, "label" => "Shenzhen"),
array("y" => 12528300, "label" => "Mumbai")
);
$dataPoints1 = array(
array("label" => "Chongqing", "y" => 30165500),
array("label" => "Shanghai", "y" => 24183300),
array("label" => "Beijing", "y" => 21707000),
array("label" => "Istanbul", "y" => 15029231),
array("label" => "Karachi","y" => 14910352),
array("label" => "Dhaka", "y" => 14399000),
array("label" => "Moscow", "y" => 13200000),
array("label" => "Guangzhou", "y" => 13081000),
array("label" => "Shenzhen", "y" => 12528300),
array("label" => "Mumbai", "y" => 12528300),
)
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Quiz4</title>
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
</head>
<div class="container">
<script>
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
theme: "light2",
title: {
text: "Range by country"
},
data: [{
type: "column",
yValueFormatString: "#,##0.## tonnes",
dataPoints: <?php echo json_encode($dataPoints, JSON_NUMERIC_CHECK); ?>
}]
});
chart.render();
}
</script>
</div>
<div class="container">
<script>
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer1", {
theme: "light2",
animationEnabled: true,
data: [{
legendText: "{label}",
showInLegend: true,
type: "doughnut",
//indexLabel: "{symbol} - {y}",
//yValueFormatString: "#,##0.0\"%\"",
dataPoints: <?php echo json_encode($dataPoints1, JSON_NUMERIC_CHECK); ?>
}]
});
chart.render();
}
</script>
</div>
<body>
<div id="chartContainer" style="height: 450px; width: 50%;"></div>
<div id="chartContainer1" style="height: 370px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="node_modules/popper.js/dist/umd/popper.min.js"></script>
</body>
</html>
Tag : PHP
|
|
|
 |
 |
 |
 |
| Date :
2020-07-19 09:03:48 |
By :
byte00789 |
View :
463 |
Reply :
2 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
onload เป็น event ไม่ต้องแยกร่าง
และไม่ต้องมี tag div ครอบ script
เพราะมี chartContainer, chartContainer1 ตอนสร้าง object แล้ว
Code (PHP)
<?php
$dataPoints = array(
array("y" => 30165500, "label" => "Chongqing"),
array("y" => 24183300, "label" => "Shanghai"),
array("y" => 21707000, "label" => "Beijing"),
array("y" => 15029231, "label" => "Istanbul"),
array("y" => 14910352, "label" => "Karachi"),
array("y" => 14399000, "label" => "Dhaka"),
array("y" => 13200000, "label" => "Moscow"),
array("y" => 13081000, "label" => "Guangzhou"),
array("y" => 12528300, "label" => "Shenzhen"),
array("y" => 12528300, "label" => "Mumbai")
);
$dataPoints1 = array(
array("label" => "Chongqing", "y" => 30165500),
array("label" => "Shanghai", "y" => 24183300),
array("label" => "Beijing", "y" => 21707000),
array("label" => "Istanbul", "y" => 15029231),
array("label" => "Karachi","y" => 14910352),
array("label" => "Dhaka", "y" => 14399000),
array("label" => "Moscow", "y" => 13200000),
array("label" => "Guangzhou", "y" => 13081000),
array("label" => "Shenzhen", "y" => 12528300),
array("label" => "Mumbai", "y" => 12528300),
)
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Quiz4</title>
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
</head>
<script>
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
theme: "light2",
title: {
text: "Range by country"
},
data: [{
type: "column",
yValueFormatString: "#,##0.## tonnes",
dataPoints: <?php echo json_encode($dataPoints, JSON_NUMERIC_CHECK); ?>
}]
});
chart.render();
var chart1 = new CanvasJS.Chart("chartContainer1", {
theme: "light2",
animationEnabled: true,
data: [{
legendText: "{label}",
showInLegend: true,
type: "doughnut",
//indexLabel: "{symbol} - {y}",
//yValueFormatString: "#,##0.0\"%\"",
dataPoints: <?php echo json_encode($dataPoints1, JSON_NUMERIC_CHECK); ?>
}]
});
chart1.render();
}
</script>
<body>
<div id="chartContainer" style="height: 450px; width: 50%;"></div>
<div id="chartContainer1" style="height: 370px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="node_modules/popper.js/dist/umd/popper.min.js"></script>
</body>
</html>
|
| |
|
|
| |
| Date :
2020-07-19 11:43:40 |
By :
PhrayaDev |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 02
|
