Линейный график не показывает данные из базы данных
Я пытаюсь нарисовать линейный график, используя высокие графики. Я сталкиваюсь со странной проблемой: содержимое или данные, извлекаемые из базы данных, не отображаются или график вообще не отображается.
Нет никакого PHP ошибка, как я уже проверил сообщения об ошибках на. Также нет никаких ошибок на консоли.
Но когда я обращаюсь к моему файлу data.php. Это показывает содержание, как это
[{"name":"Month","data":["Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Mar","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","Apr","","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul","Jul"]},
{"name":"Name","data":["Direct Sales","Search Engine Marketing","PPC Advertising","Website Marketing","Blog Marketing","Social Media Marketing","Email Marketing","Online PR","Multimedia Marketing","Mobile Marketing","Display Advertising","Direct Sales","Search Engine Marketing","PPC Advertising","Website Marketing","Blog Marketing","Social Media Marketing","Email Marketing","Online PR","Multimedia Marketing","Mobile Marketing","Display Advertising"]}]
На самом деле это контент, который я хочу показать на графике.
Я не нашел никакого решения для этого.
Пожалуйста, помогите мне узнать, где я иду не так.
Надеюсь, я хорошо объяснил свою проблему!
index.php
<?php
ini_set('display_errors', 1);
include './includes/db_connection.php';
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var chart;
$(document).ready(function() {
$.getJSON("data.php", function(json) {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'line',
marginRight: 130,
marginBottom: 25
},
title: {
text: 'Month Vs Names',
x: -20 //center
},
subtitle: {
text: '',
x: -20
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Amount'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
this.x +': '+ this.y;
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: json
});
});
});
});
</script>
</head>
<body>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
</body>
</html>
data.php
ini_set('display_errors', 1);
include './includes/db_connection.php';
//$check = "SELECT month FROM activities";
$sth1 = mysqli_query($link,"SELECT month FROM activities");
//print_r($sth1);
//die($check."<br/><br/>".mysql_error());$rows = array();
$rows['name'] = 'Month';
while($r = mysqli_fetch_array($sth1)) {
$rows['data'][] = $r['month'];
}
//$check1 = ;
$sth = mysqli_query($link,"SELECT name FROM web_marketing");
//print_r($sth);
//die($check."<br/><br/>".mysql_error());
$rows1 = array();
$rows1['name'] = 'Name';
while($rr = mysqli_fetch_assoc($sth)) {
$rows1['data'][] = $rr['name'];
}
$result = array();
array_push($result,$rows);
array_push($result,$rows1);
echo json_encode($result,JSON_NUMERIC_CHECK);
Решение
Вам необходимо проверить формат json этот набор в серии объектов.
series: jsonВо-первых, данные объекта Series должны быть в числовом формате (и т. д. 0,23 или 6).
и я не понял, где вы хотите установить отображение этого содержимого (название или всплывающая подсказка на графике?),
Во всяком случае, под содержанием будет отображаться в диаграмме, если вы установите name's value объекта серии или же объект категории xAxis.
«Прямые продажи», «Маркетинг в поисковых системах», «Реклама PPC», «Маркетинг сайтов», «Маркетинговый маркетинг», «Маркетинг в социальных сетях», «Маркетинг по электронной почте», «Онлайн PR», «Мультимедийный маркетинг», «Мобильный маркетинг». «,» Медийная реклама «,» Прямые продажи «,» Маркетинг в поисковых системах «,» Реклама PPC «,» Маркетинг на веб-сайте «,» Маркетинг в блогах «,» Маркетинг в социальных сетях «,» Маркетинг по электронной почте «,» Онлайн PR «,» Мультимедийный маркетинг »,« Мобильный маркетинг »,« Дисплейная реклама »
Я написал пример диаграммы ниже. надеюсь, что это работает для вас.
http://jsfiddle.net/uv7cvfsb/1/
Также, возможно, эта картина поможет понять структуру Highchart.
http://4.bp.blogspot.com/-8U9LxYsbp1k/UDUYsSJxN_I/AAAAAAAAAtk/SNWsEJUIGu8/s1600/highcharts.png
Если вы хотите задать разные вещи, пожалуйста, оставьте комментарий.
Другие решения
Других решений пока нет …