Flexigrid in zend - json

i have a page post2.php which prints the json array like
{
page: 1,
total: 239,
rows: [{
id: '239',
cell: ['239', 'ZW', 'ZIMBABWE', 'Zimbabwe', 'ZWE', '716']
},
{
id: '238',
cell: ['238', 'ZM', 'ZAMBIA', 'Zambia', 'ZMB', '894']
},
{
id: '237',
cell: ['237', 'YE', 'YEMEN', 'Yemen', 'YEM', '887']
},
{
id: '236',
cell: ['236', 'EH', 'WESTERN SAHARA', 'Western Sahara', 'ESH', '732']
},
{
id: '235',
cell: ['235', 'WF', 'WALLIS AND FUTUNA', 'Wallis and Futuna', 'WLF', '876']
},
{
id: '234',
cell: ['234', 'VI', 'VIRGIN ISLANDS, U.S.', 'Virgin Islands, U.s.', 'VIR', '850']
},
{
id: '233',
cell: ['233', 'VG', 'VIRGIN ISLANDS, BRITISH', 'Virgin Islands, British', 'VGB', '92']
},
{
id: '232',
cell: ['232', 'VN', 'VIET NAM', 'Viet Nam', 'VNM', '704']
},
{
id: '231',
cell: ['231', 'VE', 'VENEZUELA', 'Venezuela', 'VEN', '862']
},
{
id: '230',
cell: ['230', 'VU', 'VANUATU', 'Vanuatu', 'VUT', '548']
}
]
}
and in zend views i am trying to do like
$(document).ready(function() {
$("#flex1").flexigrid({
url: '/public/**post2.ph**p',
dataType: 'json',
colModel: [{
display: 'ID',
name: 'id',
width: 40,
sortable: true,
align: 'center'
},
{
display: 'ISO',
name: 'iso',
width: 40,
sortable: true,
align: 'center'
},
{
display: 'Name',
name: 'name',
width: 180,
sortable: true,
align: 'left'
},
{
display: 'Printable Name',
name: 'printable_name',
width: 120,
sortable: true,
align: 'left'
},
{
display: 'ISO3',
name: 'iso3',
width: 130,
sortable: true,
align: 'left',
hide: true
},
{
display: 'Number Code',
name: 'numcode',
width: 80,
sortable: true,
align: 'right'
}
],
buttons: [{
name: 'Add',
bclass: 'add',
onpress: test
},
{
name: 'Delete',
bclass: 'delete',
onpress: test
},
{
separator: true
},
{
name: 'A',
onpress: sortAlpha
},
],
searchitems: [{
display: 'ISO',
name: 'iso'
},
{
display: 'Name',
name: 'name',
isdefault: true
}
],
sortname: "id"
sortorder: "asc",
usepager: true,
title: 'Countries',
useRp: true,
rp: 10,
showTableToggleBtn: true,
width: 700,
height: 255
});
});
this prints the flexigrid layout well.. but never gets the data.it keeps telling processing.
is there some problem in the json array or in the flexigrid calling... or in zend with json.
any suggestions to try out for this problem?
i tried out like this also
$.post("/public/server_processing1.php",{},function(data){
alert('hai');
alert(data);
}, "json");
and its not even alerting hai ..
full post2.php code is like this
<?
error_reporting(1);
function runSQL($rsql) {
$hostname = "localhost";
$username = "root";
$password = "root";
$dbname = "hms1";
$connect = mysql_connect($hostname,$username,$password) or die ("Error: could not connect to database");
$db = mysql_select_db($dbname);
$result = mysql_query($rsql) or die ('test');
return $result;
mysql_close($connect);
}
function countRec($fname,$tname,$where) {
$sql = "SELECT count($fname) FROM $tname $where";
$result = runSQL($sql);
while ($row = mysql_fetch_array($result)) {
return $row[0];
}
}
$page = $_POST['page'];
$rp = $_POST['rp'];
$sortname = $_POST['sortname'];
$sortorder = $_POST['sortorder'];
if (!$sortname) $sortname = 'pa_name';
if (!$sortorder) $sortorder = 'desc';
if($_POST['query']!=''){
$where = "WHERE `".$_POST['qtype']."` LIKE '%".$_POST['query']."%' ";
} else {
$where ='';
}
if($_POST['letter_pressed']!=''){
$where = "WHERE `".$_POST['qtype']."` LIKE '".$_POST['letter_pressed']."%' ";
}
if($_POST['letter_pressed']=='#'){
$where = "WHERE `".$_POST['qtype']."` REGEXP '[[:digit:]]' ";
}
$sort = "ORDER BY $sortname $sortorder";
if (!$page) $page = 1;
if (!$rp) $rp = 10;
$start = (($page-1) * $rp);
$limit = "LIMIT $start, $rp";
$sql = "SELECT pa_id,pa_name,pa_pd_patient_id,pa_name FROM patient_appointment $where $sort $limit";
$result = runSQL($sql);
$total = countRec('pa_id','patient_appointment',$where);
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT" );
header("Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" );
header("Cache-Control: no-cache, must-revalidate" );
header("Pragma: no-cache" );
header("Content-type: text/x-json");
$json = "";
$json .= "{\n";
$json .= "page: $page,\n";
$json .= "total: $total,\n";
$json .= "rows: [";
$rc = false;
while ($row = mysql_fetch_array($result)) {
if ($rc) $json .= ",";
$json .= "\n{";
/*$json .= "cell:['".$row['pa_name']."'";
$json .= ",'".addslashes($row['time'])."'";
$json .= ",'".addslashes($row['pa_um_id'])."'";
$json .= ",'".addslashes($row['pa_pd_patient_id'])."']";*/
$json .= "id:'".$row['pa_id']."',";
$json .= "cell:['".$row['pa_id']."','".$row['pa_name']."'";
$json .= ",'".addslashes($row['pa_pd_patient_id'])."']";
$json .= "}";
$rc = true;
}
$json .= "]\n";
$json .= "}";
echo $json;
?>

I'm guessing you're using IE browser. If so IE does not like <div id="flex1"></div> container. Change it to <table id="flex1"></table> and all should work.

Related

How To generate json format from model in codeigniter

I Have Database :
enter image description here
how to query mysql in codeigniter model so that it can output json data like this :
enter code here</script">
$.ajax({
url: '?grid=true&tahun=' + tahuncikarang,
method: "GET",
success: function(data) {
var obj = JSON.parse(data);
}
Highcharts.chart('cikarang', {
chart: {
type: 'bar'
},
title: {
text: 'Highcharts multi-series drilldown'
},
subtitle: {
text: 'The <em>allowPointDrilldown</em> option makes point clicks drill to the whole category'
},
xAxis: {
type: 'category'
},
plotOptions: {
series: {
borderWidth: 0,
dataLabels: {
enabled: true
}
}
},
series: [{
name: '2010',
data: obj.tahun1
}, {
name: '2014',
data: obj.tahun2
}],
drilldown: {
allowPointDrilldown: false,
series: [{
id: 'republican-2010',
name: 'Republican 2010',
data: [
['East', 4],
['West', 2],
['North', 1],
['South', 4]
]
}, {
id: 'democrats-2010',
name: 'Republican 2010',
data: ''
}, ]
}
});
}
});
I try in model :
function index($tahuncikarang)
{
$this->db->select('nama AS nama, CONCAT(nama,"-", tahun) AS drilldown, sum(nilai) AS y');
$this->db->where('tahun=2010');
$this->db->group_by('nama')
->group_by('tahun');
$tahuna1 = $this->db->get(self::$table5);
$tahuna2 = array();
foreach ($tahuna1->result() as $row) {
array_push($tahuna2, $row);
}
$this->db->select('nama AS nama, CONCAT(nama,"-", tahun) AS drilldown, sum(nilai) AS y');
$this->db->where('tahun=2014');
$this->db->group_by('nama')
->group_by('tahun');
$tahunb1 = $this->db->get(self::$table5);
$tahunb2 = array();
foreach ($tahunb1->result() as $row) {
array_push($tahunb2, $row);
}
$result = array();
$result['tahun1'] = $tahuna2;
$result['tahun2'] = $tahunb2;
return json_encode($result, JSON_NUMERIC_CHECK);
}
I read your question just before.
If you could use this query, you maybe get good results.
Thank you
$qy = $this->db->query("select concat(lower(nama),'-',tahun) as id,concat(nama,'-',tahun) as name,group_concat(concat(zone,'-' ,nilai),',') as data group by nama, tahun")->result_array();
$result = array();
foreach($qy as $row) {
$temp = array(
"id"=>$row['id'],
"name"=>$row['name'],
"data"=>array()
);
$array = explode(',',$row['data']);
foreach($array as $el) {
$temp['data'][]=explode('-',$el);
}
$result[] = $temp;
}
echo json_encode($result);

Highcharts drilldown data from mysql

Im trying to use the drill down method for my chart similar to this: https://www.highcharts.com/demo/column-drilldown/sand-signika%5d%5b1%5d.
But I want to drilldown my data from YEARS,MONTHS,WEEKS & DAYS. How can I execute that? Heres my code:
$query = "SELECT sum(product_total) as total, YEAR(`date`) as year FROM confirm_order_product GROUP BY YEAR(date) ORDER BY date";
$result = $mysqli->query($query);
while($row = $result->fetch_array(MYSQLI_ASSOC))
{
$salestotal[] = $row['total'];
$sdate[] = $row['year'];
}
$salesdate = json_encode($sdate, JSON_NUMERIC_CHECK);
$sales = json_encode($salestotal, JSON_NUMERIC_CHECK);
Container:
$(function() {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Sales Report'
},
xAxis: {
categories: <?php echo $salesdate; ?>
},
yAxis: {
title: {
text: 'Value'
},
},
tooltip: {
valuePrefix: '₱'
},
series: [{
name: 'Sales',
colorByPoint: true,
data:<?php echo $sales; ?>,
}],
});
});
This only displays per year.

passsing data to https by JSON using JSONP

i had try many diffrent tutarials and examples from http://api.jquery.com/jQuery.getJSON/ and Post data to JsonP and saw many staffs about how to convert json data to jasonP but still i can not do it,is there any one could see how should i pass my data over https within my codes here which i am using highcharts to get data from my domain sql server which is in diffrent server than my webpages host.here is my codes:(i know which i should use ajax request but i dont know how in my case,if anyone know please HELP!) tnx.
getting data by getJASON over data.php which request from sql server to grab data:
var Options;
$(document).ready(function() {
Options = {
chart: {
renderTo: 'container2',
type: 'area',
borderColor: "#3366ff",
borderWidth:5,
zoomType : 'x'
},
title: {
text: 'Total Meeting_Logs Duration of Organization1 '
},
subtitle: {
text: ' '
},
credits:{
enabled:false
},
xAxis: {
categories: [],
labels: {
align: 'center',
x: -3,
y: 20,
//format data based on #datepicker which is html jquery ui date
//picker
formatter: function() {
return Highcharts.dateFormat('%l%p',
Date.parse(this.value +' UTC'));
}
}
},
yAxis: {
title: {
text: ''
}
},
tooltip: {
backgroundColor: '#FCFFC5',
borderColor: 'black',
borderRadius: 10,
borderWidth: 3
},
// Enable for both axes
tooltip: {
crosshairs: [true,true]
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: false
}
},
series: [{
type: 'area',
name: '',
data: []
}]
}
// here i get my data from data.php within same server
$.getJSON("data.php", function(json){
Options.xAxis.categories = json['category'];
Options.series[0].name = json['name'];
Options.series[0].data = json['data'];
chart = new Highcharts.Chart(Options);
});
});
//this function get user request for input time period and
//update in my domain
$(function() {
$( "#datepicker2" ).datepicker({
dateFormat: "yy-mm-dd",
showOn: "button",
buttonImage: "calendar.gif",
buttonImageOnly: true,
onSelect: function(dateText, inst) {
$.getJSON("data.php?dateparam1="+dateText, function(json){
Options.xAxis.categories = json['category'];
Options.series[0].name = json['name'];
Options.series[0].data = json['data'];
chart = new Highcharts.Chart(Options);
});
}
});
});
data.php:
`
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db("moh1368_Mrs_Lemoine", $con);
if (isset($_GET["dateparam"])) {
$sql = mysql_query("SELECT timestamp_value, traffic_count FROM
foot_traffic WHERE timestamp_value LIKE '".$_GET["dateparam"]."%'");
} else {
$sql = mysql_query("SELECT timestamp_value, traffic_count FROM
foot_traffic WHERE timestamp_value LIKE '2013-02-01%'");
}
$result['name'] = 'Foot Traffic Count';
while($r = mysql_fetch_array($sql)) {
$datetime = $r['timestamp_value'];
$result['category'][] = $datetime;
$result['data'][] = $r['traffic_count'];
}
print json_encode($result, JSON_NUMERIC_CHECK);
mysql_close($con);
?>`

Retrieving JSON data for Highcharts with multiple series and show it in google map infoWindow

I would like to show multiple series of datas in a hightcharts in a google map infowindow.
It works for one serie but I would like to had a second one.
Anybody to help me? MANY THAAANKS!
Here's my code, but it didn't work.
index.php
<script>
var dataSeries=null;
var dataRank=null;
var selectedname="";
$(document).ready(function() {
var locations =
<?php
$query->execute();
echo ("[");
while ($data = $query->fetch()) {
echo("[".$data['hot_webid'].",'".addslashes($data['hot_name'])."',".$data['hot_starrating'].",".$data['hot_latitude'].",".$data['hot_longitude']."],");
}
echo("];");
$query->closeCursor();
?>;
var iw = new google.maps.InfoWindow();
var centerMap = new google.maps.LatLng(0,0);
google.maps.event.addListener(iw,'domready',function(e) {
// Convert date into JS UTC date
for (var k=0; k<dataSeries.length; k++) {
var d=dataSeries[k][0].split(/[- :]/);
dataSeries[k][0]=Date.UTC(d[0], d[1]-1, d[2], d[3], d[4], d[5]);
}
for (var k=0; k<dataRank.length; k++) {
var d=dataRank[k][0].split(/[- :]/);
dataRank[k][0]=Date.UTC(d[0], d[1]-1, d[2], d[3], d[4], d[5]);
}
dataChart = {
chart: {
borderWidth: 2,
renderTo: document.getElementById('container'),
zoomType: 'x',
type:"spline",
lineWidth:0,
height:600,
width:500,
marginRight:40
},
legend: {
enabled: true,
align: 'right',
backgroundColor: '#FCFFC5',
borderColor: 'black',
borderWidth: 0,
layout: 'vertical',
verticalAlign: 'top',
y: 0,
x: -140,
shadow: false,
floating : true
},
rangeSelector: {
enabled: false
},
title: {
text: selectedname
},
subtitle: {
text: 'Prices'
},
legend: {
enabled: true,
align: 'right',
backgroundColor: '#FCFFC5',
borderColor: 'black',
borderWidth: 0,
layout: 'vertical',
verticalAlign: 'top',
y: 0,
x: -140,
shadow: false,
floating : true
},
xAxis: {
title: {
text: 'Date/Time'
}
},
yAxis: [{
title: {
text: 'Rank'
},
height: 200,
lineWidth: 2,
opposite:false
}, {
title: {
text: 'Price'
},
top: 300,
height: 200,
offset: 0,
lineWidth: 2,
opposite:false
}],
navigator: {
enabled: false,
},
credits: {
enabled: false
},
series: [{
name: 'Rank',
color: '#4572A7',
type: 'spline',
yAxis: 0,
marker: {
enabled:true,
radius:2
},
tooltip: {
valueDecimals : 0
},
data: dataRank,
}, {
name: 'Price',
color: '#89A54E',
type: 'spline',
yAxis: 1,
marker: {
enabled:true,
radius:2
},
tooltip: {
valueSuffix: '$',
valueDecimals : 0
},
data: dataSeries,
}]
};
chart = new Highcharts.StockChart(dataChart);
});
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 3,
center: new google.maps.LatLng(0.0, 0.0),
mapTypeId : google.maps.MapTypeId.ROADMAP, // Type de carte, diff�rentes valeurs possible HYBRID, ROADMAP, SATELLITE, TERRAIN
streetViewControl: false,
center: centerMap,
panControl: false,
zoomControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
}
});
var inputLocation = /** #type {HTMLInputElement} */(document.getElementById('search-city'));
// Link it to the UI element.
// map.controls[google.maps.ControlPosition.TOP_LEFT].push(inputLocation);
var autocompleteLocation = new google.maps.places.Autocomplete(inputLocation);
autocompleteLocation.bindTo('bounds', map);
/******************** LISTENER ************************/
google.maps.event.addListener(autocompleteLocation, 'place_changed', function() {
inputLocation.className = '';
var placeStart = autocompleteLocation.getPlace();
if (!placeStart.geometry) {
// Inform the user that the place was not found and return.
inputLocation.className = 'notfound';
return;
}
// If the place has a geometry, then present it on a map.
if (placeStart.geometry.viewport) {
map.fitBounds(placeStart.geometry.viewport);
} else {
map.setCenter(placeStart.geometry.location);
map.setZoom(13); // Why 13? Because it looks good.
}
var address = '';
if (placeStart.address_components) {
address = [
(placeStart.address_components[0] && placeStart.address_components[0].short_name || ''),
(placeStart.address_components[1] && placeStart.address_components[1].short_name || ''),
(placeStart.address_components[2] && placeStart.address_components[2].short_name || '')
].join(' ');
}
});
/******************** END LISTENER ************************/
var marker, i;
var markers = [];
var contentDiv = '<center><h2>Price and Rank Evolution</h2></center><div id="container" class="info-box"></div>';
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][3], locations[i][4]),
map: map,
title: locations[i][1]+ " (" + locations[i][2] + " stars)"
});
markers.push(marker);
google.maps.event.addListener(marker, 'click', (
function(marker, i) {
return function() {
selectedname = locations[i][1];
stopAnimation(marker);
var requestR = $.ajax({
url: "../ajax/map/get-rank.php",
type: "POST",
dataType: "json",
data: { HotelId: locations[i][0] }
});
var requestS = $.ajax({
url: "../ajax/map/get-prices.php",
type: "POST",
dataType: "json",
data: { HotelId: locations[i][0] }
});
requestR.done(
requestS.done(
function(dataS, dataR, textStatus, jqXHR) {
dataRank=dataR;
dataSeries=dataS;
iw.setContent(contentDiv);
iw.open(map, marker);
}));
requestS.fail(function(jqXHR, textStatus, errorThrown) {});
return false;
}
}
)
(marker, i)
);
}
var markerCluster = new MarkerClusterer(map, markers);
google.maps.event.addListener(iw, 'closeclick', function() {});
function stopAnimation(marker) {
setTimeout(function () {
marker.setAnimation(null);
}, 3000);
}
});
</script>
And my JSON php files
<?php
header("Content-type: application/json");
include('../../db.php');
if (isset($_POST['HotelId'])) $res_idHotel=$_POST['HotelId'];
$query = $bdd->prepare("SELECT res_date, res_price ".
"FROM exp_result ".
"WHERE res_idHotel = $res_idHotel ".
"AND res_date ".
//"BETWEEN DATE( DATE_SUB( NOW() , INTERVAL 7 DAY ) ) ".
//"AND DATE ( NOW() ) ".
"GROUP BY res_date ORDER BY res_date;");
$query->execute();
$data = $query->fetch();
if ($data) {
echo "[ ";
do {
echo "[ \"".$data['res_date']."\", ".$data['res_price']." ]";
$data = $query->fetch();
if ($data) echo ",";
} while ($data);
echo "]";
} else {
echo "[]";
}
$query->closeCursor();
?>
and
<?php
header("Content-type: application/json");
include('../../db.php');
if (isset($_POST['HotelId'])) $res_idHotel=$_POST['HotelId'];
$query = $bdd->prepare("SELECT res_date, res_rank ".
"FROM exp_result ".
"WHERE res_idHotel = $res_idHotel ".
"AND res_date ".
//"BETWEEN DATE( DATE_SUB( NOW() , INTERVAL 7 DAY ) ) ".
//"AND DATE ( NOW() ) ".
"GROUP BY res_date ORDER BY res_date;");
$query->execute();
$dataR = $query->fetch();
if ($dataR) {
echo "[ ";
do {
echo "[ \"".$dataR['res_date']."\", ".$dataR['res_rank']." ]";
$dataR = $query->fetch();
if ($dataR) echo ",";
} while ($dataR);
echo "]";
} else {
echo "[]";
}
$query->closeCursor();
?>

Changing from Highcharts to Highstock - Now Json problems

I had finished my site using highcharts, but as it only could happen... I need to switch to Highstock.
Unfortunately I've got problems to change the code although it's mostly the same... I had 3 line series and now want to switch it to one candlestick and two spline area series.
php file looks like this and the output seems to be fine:
<?php
session_start();
?>
<?php
define('DB_SERVER',"");
define('DB_NAME',"");
define('DB_USER',"");
define('DB_PASSWORD',"");
$con = mysql_connect(DB_SERVER, DB_USER, DB_PASSWORD);
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db(DB_NAME, $con);
if (isset($_GET["dateParam"])) {
$sql = mysql_query("SELECT unix_timestamp(datetime)*1000 as ts, OpenBid AS open, HighBid AS high, LowBid AS low, CloseBid AS close FROM ger30 WHERE datetime LIKE '".$_GET["dateParam"]."%' ORDER BY datetime");
} else {
$sql = mysql_query("SELECT unix_timestamp(datetime)*1000 as ts, OpenBid AS open, HighBid AS high, LowBid AS low, CloseBid AS close FROM ger30 WHERE DATE(datetime) = CURDATE() ORDER BY datetime");
}
while ($row = mysql_fetch_assoc($sql)) {
if ($row['ts'] == ""){
$row['ts'] = "0";
}
if ($row['open'] == ""){
$row['open'] = 0;
}
if ($row['high'] == ""){
$row['high'] = 0;
}
if ($row['low'] == ""){
$row['low'] = 0;
}
if ($row['close'] == ""){
$row['close'] = 0;
}
$t = $row['ts'];
$o = $row['open'];
$h = $row['high'];
$l = $row['low'];
$c = $row['close'];
$result['data1'][] = array( $t, $o, $h, $l, $c );
}
if (isset($_GET["dateParam"])) {
$sql = mysql_query("SELECT reference FROM kalender WHERE date LIKE '".$_GET["dateParam"]."%'");
} else {
$sql = mysql_query("SELECT reference FROM kalender WHERE DATE(date) = CURDATE()");
}
while ($row = mysql_fetch_assoc($sql)) {
$ref1 = $row['reference'];
}
if (isset($_GET["dateParam"])) {
$sql = mysql_query("SELECT unix_timestamp(datetime)*1000 as ts2, HighBid AS high2, LowBid AS low2 FROM ger30 WHERE DATE(datetime) LIKE DATE('$ref1') ORDER BY datetime");
} else {
$sql = mysql_query("SELECT unix_timestamp(datetime)*1000 as ts2, HighBid AS high2, LowBid AS low2 FROM ger30 WHERE DATE(datetime) = CURDATE() ORDER BY datetime");
}
while ($row = mysql_fetch_assoc($sql)) {
if ($row['ts2'] == ""){
$row['ts2'] = "0";
}
if ($row['high2'] == ""){
$row['high2'] = 0;
}
if ($row['low2'] == ""){
$row['low2'] = 0;
}
$t2 = $row['ts2'];
$h2 = $row['high2'];
$l2 = $row['low2'];
$result['data2'][] = array( $t2, $h2, $l2 );
$result['data3'][] = array( $t2, $h2, $l2 );
}
print json_encode($result, JSON_NUMERIC_CHECK);
mysql_close($con);
?>
so far I recieve 3 correct arrays looking like this:
data1: [1389250800000,9484,9484,9480,9483],[1389250860000,9483,9484,9480,9482]...
data2: [1389078120000,9444,9441],[1389078180000,9444,9442]...
data3: [1389078120000,9444,9441],[1389078180000,9444,9442]
and my java code looks like this:
var options;
$(document).ready(function() {
$.getJSON("testdata2.php", function(json){
options.series[0].data = json['data1'];
chart = new Highcharts.Chart(options);
});
// create the chart
$('#container').highcharts('StockChart', {
options = {
chart:
{
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, 'rgb(51, 51, 51)'],
[1, 'rgb(16, 16, 16)']
]
},
borderColor: '#666666',
borderWidth: 1,
borderRadius: 0,
zoomType: 'x',
maxZoom: 60000,
renderTo: 'container'
},
rangeSelector : {
enabled: false
},
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, 'rgb(51, 51, 51)'],
[1, 'rgb(16, 16, 16)']
]
},
xAxis: {
type: 'datetime',
lineColor: '#666666',
dateTimeLabelFormats: { // don't display the dummy year
month: '%e. %b',
year: '%b'
}
},
yAxis: { // first yAxis
alternateGridColor: null,
minorTickInterval: null,
gridLineColor: 'rgba(255, 255, 255, .1)',
minorGridLineColor: 'rgba(255,255,255,0.07)',
lineWidth: 0,
tickWidth: 0,
labels: {
style: {
color: '#999',
fontWeight: 'bold'
}
},
title: {
text: 'DAX',
style: {
color: '#eeeeee'
}
}
},
tooltip: {
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, 'rgba(96, 96, 96, .8)'],
[1, 'rgba(16, 16, 16, .8)']
]
},
borderWidth: 0,
style: {
color: '#FFF'
}
},
title: {
text: 'GER30 Tageschart',
margin: 50,
style: {
fontFamily: 'Verdana',
fontSize: '20px',
fontWeight: 'bold',
color: '#cccccc'
}
},
navigator: {
enabled: false
},
scrollbar: {
enabled: false
},
plotOptions: {
series: {
shadow: true
},
line: {
dataLabels: {
color: '#CCC'
},
marker: {
lineColor: '#333'
}
},
spline: {
marker: {
lineColor: '#333'
}
},
scatter: {
marker: {
lineColor: '#333'
}
},
candlestick: {
lineColor: '#666666'
}
},
series : [{
type : 'candlestick',
name : 'GER30',
data : [],
}]
}
});
});
});
Javascript is updated, to show how it looks like at the moment.
I try to get only one series data work so that I only need to add the others.
The Problem must be somewhere here:
$.getJSON("testdata2.php", function(json){
options.series[0].data = json['data1'];
chart = new Highcharts.Chart(options);
});
If I use
$.getJSON('testdata2.php', function(test) {
instead, and "data: test," in the series part, it works fine.