Highcharts - Pie/Donut Chart group small portion - highcharts

A Pie/Donut chart will be easier to read if small portions could be grouped together to others. I would like to add this feature to zeppelin-highcharts
In this example Donut Chart. There are small portions for Safari which are impossible to read. Its better to group it together to "Safari Other Versions"
{
name: 'Safari versions',
categories: ['Safari v5.0', 'Safari v5.1', 'Safari v6.1',
'Safari v6.2', 'Safari v7.0', 'Safari v7.1', 'Safari v8.0'],
data: [0.3, 0.42, 0.29, 0.17, 0.26, 0.77, 2.56],
}
I'd like to group the small portions to others like this jsfiddle
{
name: 'Safari versions',
categories: ['Safari Other Versions', 'Safari v8.0'],
data: [2.21, 2.56],
}
I go through Highcharts API doc, but I have not found any configuration which could enable this.
How can I implement this feature in Highcharts?

I think that you can add filter function before making your chart. You can also filter your data on load event callback function.
Here you can find simple example of code filtering data in callback function:
var groupSmallData = function(series, number) {
var groupValue = 0,
newData = [];
Highcharts.each(series.data, function(p) {
if (p.y < number) {
groupValue += p.y;
} else {
newData.push([p.name, p.y])
}
});
newData.push(['others', groupValue]);
series.setData(newData)
}
Here you can find live example how it can work: http://jsfiddle.net/b33ynvaq/1/

Related

Highchart zoom feature is not working. It is in https://jsfiddle.net/f0n31uqx/

JSON DATA
const rawData = [{"eventId":"c0nmqcdsvg8q9deq0m30","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.05,"updateTime":"2021-02-19T07:48:01.072000Z"}},"timestamp":"2021-02-19T07:48:01.072000Z"},{"eventId":"c0nmimfae9qf8j0ni8ug","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.05,"updateTime":"2021-02-19T07:31:37.195000Z"}},"timestamp":"2021-02-19T07:31:37.195000Z"},{"eventId":"c0nmb0cmksjn6fnmek40","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.1,"updateTime":"2021-02-19T07:15:13.736000Z"}},"timestamp":"2021-02-19T07:15:13.736000Z"},{"eventId":"c0nm3ani3sc4tff6o5lg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.05,"updateTime":"2021-02-19T06:58:50.348000Z"}},"timestamp":"2021-02-19T06:58:50.348000Z"},{"eventId":"c0nlrknae9qf8j0jd61g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.2,"updateTime":"2021-02-19T06:42:26.798000Z"}},"timestamp":"2021-02-19T06:42:26.798000Z"},{"eventId":"c0nljuu4aaj3ehi66l70","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.15,"updateTime":"2021-02-19T06:26:03.456000Z"}},"timestamp":"2021-02-19T06:26:03.456000Z"},{"eventId":"c0nlc90snrvnmlvjjrp0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.1,"updateTime":"2021-02-19T06:09:40.150000Z"}},"timestamp":"2021-02-19T06:09:40.150000Z"},{"eventId":"c0nl4je4aaj3ehi3fbl0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.15,"updateTime":"2021-02-19T05:53:17.235000Z"}},"timestamp":"2021-02-19T05:53:17.235000Z"},{"eventId":"c0nkstgd11ttvapiroi0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.2,"updateTime":"2021-02-19T05:36:54.196000Z"}},"timestamp":"2021-02-19T05:36:54.196000Z"},{"eventId":"c0nkl7um6o2p5rlk17pg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.15,"updateTime":"2021-02-19T05:20:31.239000Z"}},"timestamp":"2021-02-19T05:20:31.239000Z"},{"eventId":"c0nkdi4mksjn6fnbecvg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.25,"updateTime":"2021-02-19T05:04:08.318000Z"}},"timestamp":"2021-02-19T05:04:08.318000Z"},{"eventId":"c0nk5ser46k56lsj00d0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.35,"updateTime":"2021-02-19T04:47:45.487000Z"}},"timestamp":"2021-02-19T04:47:45.487000Z"},{"eventId":"c0nju6l9m1grbnmn3pf0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.3,"updateTime":"2021-02-19T04:31:22.857000Z"}},"timestamp":"2021-02-19T04:31:22.857000Z"},{"eventId":"c0njmh4mksjn6fn7djmg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.35,"updateTime":"2021-02-19T04:15:00.072000Z"}},"timestamp":"2021-02-19T04:15:00.072000Z"},{"eventId":"c0njerbpv76emv1io31g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.3,"updateTime":"2021-02-19T03:58:37.434000Z"}},"timestamp":"2021-02-19T03:58:37.434000Z"},{"eventId":"c0nj75od11ttvap97fm0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.4,"updateTime":"2021-02-19T03:42:15.454000Z"}},"timestamp":"2021-02-19T03:42:15.454000Z"},{"eventId":"c0nivg3pv76emv1g2gt0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.4,"updateTime":"2021-02-19T03:25:52.666000Z"}},"timestamp":"2021-02-19T03:25:52.666000Z"},{"eventId":"c0ninqg9scdqsoh00jog","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.4,"updateTime":"2021-02-19T03:09:30.356000Z"}},"timestamp":"2021-02-19T03:09:30.356000Z"},{"eventId":"c0nig50d11ttvap50q6g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.4,"updateTime":"2021-02-19T02:53:08.042000Z"}},"timestamp":"2021-02-19T02:53:08.042000Z"},{"eventId":"c0ni8flolbcr7u23mffg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.5,"updateTime":"2021-02-19T02:36:45.869000Z"}},"timestamp":"2021-02-19T02:36:45.869000Z"},{"eventId":"c0ni0q7i3sc4tfefc000","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.45,"updateTime":"2021-02-19T02:20:23.995000Z"}},"timestamp":"2021-02-19T02:20:23.995000Z"},{"eventId":"c0nhp4mr46k56ls5aong","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.55,"updateTime":"2021-02-19T02:04:02.166000Z"}},"timestamp":"2021-02-19T02:04:02.166000Z"},{"eventId":"c0nhhf2b02gddfvc6au0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.55,"updateTime":"2021-02-19T01:47:40.400000Z"}},"timestamp":"2021-02-19T01:47:40.400000Z"},{"eventId":"c0nh9pgsnrvnmlusb56g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.6,"updateTime":"2021-02-19T01:31:18.726000Z"}},"timestamp":"2021-02-19T01:31:18.726000Z"},{"eventId":"c0nh24ab02gddfv9dvm0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.55,"updateTime":"2021-02-19T01:14:57.091000Z"}},"timestamp":"2021-02-19T01:14:57.091000Z"},{"eventId":"c0ngqeu4aaj3ehhafq50","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.65,"updateTime":"2021-02-19T00:58:35.434000Z"}},"timestamp":"2021-02-19T00:58:35.434000Z"},{"eventId":"c0ngipgsnrvnmluo7otg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.6,"updateTime":"2021-02-19T00:42:13.986000Z"}},"timestamp":"2021-02-19T00:42:13.986000Z"},{"eventId":"c0ngb43pv76emv114au0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.7,"updateTime":"2021-02-19T00:25:52.898000Z"}},"timestamp":"2021-02-19T00:25:52.898000Z"},{"eventId":"c0ng3f5svg8q9ddk16ng","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.75,"updateTime":"2021-02-19T00:09:32.116000Z"}},"timestamp":"2021-02-19T00:09:32.116000Z"},{"eventId":"c0nfrpvi3sc4tfe31530","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.7,"updateTime":"2021-02-18T23:53:11.261000Z"}},"timestamp":"2021-02-18T23:53:11.261000Z"},{"eventId":"c0nfk4lsvg8q9ddhammg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T23:36:50.630000Z"}},"timestamp":"2021-02-18T23:36:50.630000Z"},{"eventId":"c0nfcfgsnrvnmluhea40","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.75,"updateTime":"2021-02-18T23:20:30.265000Z"}},"timestamp":"2021-02-18T23:20:30.265000Z"},{"eventId":"c0nf4qdsvg8q9ddei0q0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.85,"updateTime":"2021-02-18T23:04:09.819000Z"}},"timestamp":"2021-02-18T23:04:09.819000Z"},{"eventId":"c0net56r46k56lrkrjs0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.75,"updateTime":"2021-02-18T22:47:48.885000Z"}},"timestamp":"2021-02-18T22:47:48.885000Z"},{"eventId":"c0nelfsmksjn6fmas22g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.65,"updateTime":"2021-02-18T22:31:27.612000Z"}},"timestamp":"2021-02-18T22:31:27.612000Z"},{"eventId":"c0nedqlolbcr7u1djesg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.65,"updateTime":"2021-02-18T22:15:06.439000Z"}},"timestamp":"2021-02-18T22:15:06.439000Z"},{"eventId":"c0ne658snrvnmlua76t0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T21:58:45.352000Z"}},"timestamp":"2021-02-18T21:58:45.352000Z"},{"eventId":"c0ndufum6o2p5rkcvib0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T21:42:23.890000Z"}},"timestamp":"2021-02-18T21:42:23.890000Z"},{"eventId":"c0ndmqmm6o2p5rkbjcog","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T21:26:02.848000Z"}},"timestamp":"2021-02-18T21:26:02.848000Z"},{"eventId":"c0ndf5mr46k56lrc84pg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T21:09:41.947000Z"}},"timestamp":"2021-02-18T21:09:41.947000Z"},{"eventId":"c0nd7g5olbcr7u16ltkg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.9,"updateTime":"2021-02-18T20:53:20.943000Z"}},"timestamp":"2021-02-18T20:53:20.943000Z"},{"eventId":"c0ncvr0snrvnmlu3afmg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.9,"updateTime":"2021-02-18T20:37:00.188000Z"}},"timestamp":"2021-02-18T20:37:00.188000Z"},{"eventId":"c0nco5tolbcr7u13tuv0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22,"updateTime":"2021-02-18T20:20:39.569000Z"}},"timestamp":"2021-02-18T20:20:39.569000Z"},{"eventId":"c0ncggod11ttvao1vr50","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.1,"updateTime":"2021-02-18T20:04:19.446000Z"}},"timestamp":"2021-02-18T20:04:19.446000Z"},{"eventId":"c0nc8rjpv76emv09ik1g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.9,"updateTime":"2021-02-18T19:47:58.911000Z"}},"timestamp":"2021-02-18T19:47:58.911000Z"},{"eventId":"c0nc16ms4leui3od2c6g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.9,"updateTime":"2021-02-18T19:31:38.286000Z"}},"timestamp":"2021-02-18T19:31:38.286000Z"},{"eventId":"c0nbphfi3sc4tfdb5tpg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T19:15:17.605000Z"}},"timestamp":"2021-02-18T19:15:17.605000Z"},{"eventId":"c0nbhs09scdqsonmdp30","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.75,"updateTime":"2021-02-18T18:58:56.400000Z"}},"timestamp":"2021-02-18T18:58:56.400000Z"},{"eventId":"c0nba6p0niu96p24p2e0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T18:42:35.054000Z"}},"timestamp":"2021-02-18T18:42:35.054000Z"},{"eventId":"c0nb2hdolbcr7u0qa9f0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.85,"updateTime":"2021-02-18T18:26:13.835000Z"}},"timestamp":"2021-02-18T18:26:13.835000Z"},{"eventId":"c0naqs6s4leui3o5q6t0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.85,"updateTime":"2021-02-18T18:09:52.888000Z"}},"timestamp":"2021-02-18T18:09:52.888000Z"},{"eventId":"c0naj75olbcr7u0ngqjg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T17:53:32.020000Z"}},"timestamp":"2021-02-18T17:53:32.020000Z"},{"eventId":"c0nabhosnrvnmltk37ug","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.7,"updateTime":"2021-02-18T17:37:10.986000Z"}},"timestamp":"2021-02-18T17:37:10.986000Z"},{"eventId":"c0na3sdsvg8q9dch76e0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.8,"updateTime":"2021-02-18T17:20:49.740000Z"}},"timestamp":"2021-02-18T17:20:49.740000Z"},{"eventId":"c0n9s77ae9qf8j6dvblg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.9,"updateTime":"2021-02-18T17:04:28.841000Z"}},"timestamp":"2021-02-18T17:04:28.841000Z"},{"eventId":"c0n9ki6r46k56lqm58sg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.95,"updateTime":"2021-02-18T16:48:08.240000Z"}},"timestamp":"2021-02-18T16:48:08.240000Z"},{"eventId":"c0n9csvae9qf8j6b4sog","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.95,"updateTime":"2021-02-18T16:31:47.772000Z"}},"timestamp":"2021-02-18T16:31:47.772000Z"},{"eventId":"c0n957tolbcr7u0f4kq0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.95,"updateTime":"2021-02-18T16:15:27.199000Z"}},"timestamp":"2021-02-18T16:15:27.199000Z"},{"eventId":"c0n8timr46k56lqhncc0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.95,"updateTime":"2021-02-18T15:59:06.487000Z"}},"timestamp":"2021-02-18T15:59:06.487000Z"},{"eventId":"c0n8ltfi3sc4tfcojh00","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.85,"updateTime":"2021-02-18T15:42:45.815000Z"}},"timestamp":"2021-02-18T15:42:45.815000Z"},{"eventId":"c0n8e8fi3sc4tfcn2gi0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22,"updateTime":"2021-02-18T15:26:25.358000Z"}},"timestamp":"2021-02-18T15:26:25.358000Z"},{"eventId":"c0n86jem6o2p5rjati6g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.1,"updateTime":"2021-02-18T15:10:05.164000Z"}},"timestamp":"2021-02-18T15:10:05.164000Z"},{"eventId":"c0n7uue4aaj3ehnleue0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.1,"updateTime":"2021-02-18T14:53:45.280000Z"}},"timestamp":"2021-02-18T14:53:45.280000Z"},{"eventId":"c0n7n9er46k56lq9v0vg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.15,"updateTime":"2021-02-18T14:37:25.432000Z"}},"timestamp":"2021-02-18T14:37:25.432000Z"},{"eventId":"c0n7fk89scdqsomtc1eg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.15,"updateTime":"2021-02-18T14:21:05.624000Z"}},"timestamp":"2021-02-18T14:21:05.624000Z"},{"eventId":"c0n77vgsnrvnmlt0h5lg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.1,"updateTime":"2021-02-18T14:04:46.013000Z"}},"timestamp":"2021-02-18T14:04:46.013000Z"},{"eventId":"c0n70adsvg8q9dbtfmu0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.95,"updateTime":"2021-02-18T13:48:25.891000Z"}},"timestamp":"2021-02-18T13:48:25.891000Z"},{"eventId":"c0n6oler46k56lq3fu4g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.7,"updateTime":"2021-02-18T13:32:05.042000Z"}},"timestamp":"2021-02-18T13:32:05.042000Z"},{"eventId":"c0n6gvtolbcr7u7tpcrg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.55,"updateTime":"2021-02-18T13:15:43.313000Z"}},"timestamp":"2021-02-18T13:15:43.313000Z"},{"eventId":"c0n69a6s4leui3v7bbs0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.45,"updateTime":"2021-02-18T12:59:20.800000Z"}},"timestamp":"2021-02-18T12:59:20.800000Z"},{"eventId":"c0n61ker46k56lpuha3g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.3,"updateTime":"2021-02-18T12:42:57.819000Z"}},"timestamp":"2021-02-18T12:42:57.819000Z"},{"eventId":"c0n5pumm6o2p5riqi370","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.25,"updateTime":"2021-02-18T12:26:34.618000Z"}},"timestamp":"2021-02-18T12:26:34.618000Z"},{"eventId":"c0n5i8us4leui3v21kdg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.1,"updateTime":"2021-02-18T12:10:11.221000Z"}},"timestamp":"2021-02-18T12:10:11.221000Z"},{"eventId":"c0n5aismksjn6fki583g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21.1,"updateTime":"2021-02-18T11:53:47.493000Z"}},"timestamp":"2021-02-18T11:53:47.493000Z"},{"eventId":"c0n52stolbcr7u7k6gdg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21,"updateTime":"2021-02-18T11:37:23.492000Z"}},"timestamp":"2021-02-18T11:37:23.492000Z"},{"eventId":"c0n4r6ur46k56lpmqen0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":21,"updateTime":"2021-02-18T11:20:59.393000Z"}},"timestamp":"2021-02-18T11:20:59.393000Z"},{"eventId":"c0n4jgvae9qf8j5bmc1g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.85,"updateTime":"2021-02-18T11:04:35.010000Z"}},"timestamp":"2021-02-18T11:04:35.010000Z"},{"eventId":"c0n4bqlsvg8q9dbcht60","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.75,"updateTime":"2021-02-18T10:48:10.452000Z"}},"timestamp":"2021-02-18T10:48:10.452000Z"},{"eventId":"c0n444dolbcr7u7emrpg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.7,"updateTime":"2021-02-18T10:31:45.431000Z"}},"timestamp":"2021-02-18T10:31:45.431000Z"},{"eventId":"c0n3se7i3sc4tfbpemog","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.65,"updateTime":"2021-02-18T10:15:20.160000Z"}},"timestamp":"2021-02-18T10:15:20.160000Z"},{"eventId":"c0n3knm4aaj3ehmp9t9g","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.55,"updateTime":"2021-02-18T09:58:54.786000Z"}},"timestamp":"2021-02-18T09:58:54.786000Z"},{"eventId":"c0n3d1ab02gddfsn6shg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.55,"updateTime":"2021-02-18T09:42:29.261000Z"}},"timestamp":"2021-02-18T09:42:29.261000Z"},{"eventId":"c0n35asmksjn6fk5mgmg","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.45,"updateTime":"2021-02-18T09:26:03.369000Z"}},"timestamp":"2021-02-18T09:26:03.369000Z"},{"eventId":"c0n2tkvae9qf8j51p9og","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":22.35,"updateTime":"2021-02-18T09:09:39.064000Z"}},"timestamp":"2021-02-18T09:09:39.064000Z"},{"eventId":"c0n2s3nlq0bla05dqod0","targetName":"projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60","eventType":"temperature","data":{"temperature":{"value":20.5,"updateTime":"2021-02-18T09:06:22.336000Z"}},"timestamp":"2021-02-18T09:06:22.336000Z”}];
Highchart source code which is also in https://jsfiddle.net/f0n31uqx/
Zoom feature is not working.
Also rangeselector also not working
function formatData(data) {
let formattedData = [];
for(i = 0; i < data.length; i++) {
formattedData.push([
Math.floor(Date.parse(data[i]['data']['temperature']['updateTime'])),
data[i]['data']['temperature']['value']
])
}
return formattedData;
}
const formattedData = formatData(rawData);
console.log(formattedData);
Highcharts.stockChart('container', {
rangeSelector: {
selected: 1
},
title: {
text: 'Temprature'
},
series: [{
name: 'Temp',
data: formattedData,
tooltip: {
valueDecimals: 2
}
}]
});
For the record, I have checked the "include dependencies with Provided scope" option in Intellij. Also, I have excluded log4j-over-slf4j from my Dependencies so as not to cause conflicts in SLF4J, using the following line
You have unsorted data - Highcharts error #15 in a console: https://www.highcharts.com/errors/15/. You need to sort it before creating a chart.
formattedData.sort(function(a, b) {
return a[0] - b[0];
});
Live demo: https://jsfiddle.net/BlackLabel/859zy6vw/

Drilldown in Sankey Diagram

I'm looking for example code on how to implement a drilldown in a sankey diagram.
I tried using the drilldown code from the column drilldown demo but it didn't work for sankey.
The intended functionality is very similar to a dendogram, i.e- click a node to hide reveal child nodes.
Example:
https://jsfiddle.net/y_tddel/d7jby2z1/5/
.
In this example each node in the second column will be clickable and have their own child nodes.The expanded view of Indo-Iranian node is shown as as an example.
Series.point.events can be used to trigger the event when the user clicks on any node, and update the series data, and adding a back button.
Link: https://api.highcharts.com/highcharts/series.sankey.point.events.click
Look at the following code sample:
Highcharts.chart('container', {
series: [{
point: {
events: {
click: function (e) {
console.log(e, 'e')
let series = this.series,
chart = series.chart;
if (this.isNode) {
if (isDrilldown[isDrilldown.length - 1] != this.name && drilldown_data.hasOwnProperty(this.name)) {
chart.backButton = chart.renderer.button('back', chart.plotLeft, 20, function () {
isDrilldown.pop();
d = JSON.parse(JSON.stringify(drilldown_data[isDrilldown[isDrilldown.length - 1]]));
series.update({data: d});
chart.backButton.destroy();
chart.title.show();
}).add()
isDrilldown.push(this.name);
chart.title.hide()
this.series.update({
data: JSON.parse(JSON.stringify(drilldown_data[this.name]))
})
}
}
}
}
},
keys: ['from', 'to', 'weight', 'drilldown'],
data: JSON.parse(JSON.stringify(plot_data)),
type: 'sankey'
}],
});
Demo: https://jsfiddle.net/deveshgoyal/1zcnuq5b/2/
Current drilldown module is not compatible with the sankey series. You will need to create your own drilldown logic. Below is a basic demo which shows how to update series on click event - which could be treated as an drilldown to other series.
Demo: https://jsfiddle.net/BlackLabel/hn19xga5/
events: {
click() {
let series = this.series,
chart = series.chart;
if (!isDrilldown) {
chart.backButton = chart.renderer.button('back', 20, 20, function() {
series.update({
data: initialData
})
chart.backButton.destroy();
isDrilldown = false;
}).add()
isDrilldown = true;
}
this.series.update({
data: drilldown1
})
}
}
API: https://api.highcharts.com/highcharts/series.sankey.data.events.click
API: https://api.highcharts.com/class-reference/Highcharts.SVGRenderer#button
API: https://api.highcharts.com/class-reference/Highcharts.Series#update

High charts multiple values in X-axis

I need to display multiple set of values in High charts x-axis.Please find image attached.
You can use formatter function to add some additional values to labels:
xAxis: {
type: 'datetime',
labels: {
rotation: 90,
formatter: function() {
return 'additionalValue ' + Highcharts.dateFormat(
this.dateTimeLabelFormat,
this.pos
)
}
}
}
Live demo: http://jsfiddle.net/BlackLabel/ktbnq0uw/
API Reference: https://api.highcharts.com/highcharts/xAxis.labels.formatter

Highcharts tooltip is not working for large data

Need your help.
I am using Highcharts to generate graphs in that I am facing following issue. For large data, tooltip is not working for the first time. after i zoom in, the tooltip is working as expected.Please help. following is the fiddle
http://jsfiddle.net/615Lfz15/
$(document).ready(function() {
var data1 =[{"maximumLean":4.7,"usl":5.5,"framesFlag":0,"emptyConesFlag":0,"ninetyFivePFlag":0,"inSpec":100.0,"arrow":0,"ninetyFivePValue":0.3,"mean":4.5,"meanFlag":0,"addDate":"08-12-2014 10:00:01","conesFlag":0,"targetSpec":4.5,"cpm":54.0,"emptyCone":13.7,"ninetyPFlag":0,"lsl":3.5,"minimumLean":4.2,"sampleSize":30,"ninetyPValue":0.2,"sd":0.1,"fpm":46.6,"fc":466,"lean":3.8,"median":4.5,"medianFlag":0,"inspecFlag":0,"cl":4.5,"sdFlag":0,"cc":540},{"lean":4.9,"addDate":"08-12-2014 10:00:01"},{"lean":4.2,"addDate":"08-12-2014 10:00:01"},{"lean":3.5,"addDate":"08-12-2014 10:00:01"},{"lean":3.9,"addDate":"08-12-2014 10:00:01"},{"lean":3.2,"addDate":"08-12-2014 10:00:01"},{"lean":4.3,"addDate":"08-12-2014 10:00:01"},{"lean":3.9,"addDate":"08-12-2014 10:00:01"},{"lean":4.6,"addDate":"08-12-2014 10:00:01"},{"lean":4.6,"addDate":"08-12-2014 10:00:01"},{"lean":4.0,"addDate":"08-12-2014 10:00:01"},{"lean":3.9,"addDate":"08-12-2014 10:00:01"},{"lean":3.5,"addDate":"08-12-2014 10:00:01"},{"lean":5.1,"addDate":"08-12-2014 10:00:01"},{"lean":4.0,"addDate":"08-12-2014 10:00:01"},{"lean":4.1,"addDate":"08-12-2014 10:00:01"},{"lean":4.1,"addDate":"08-12-2014 10:00:01"},{"lean":4.4,"addDate":"08-12-2014 10:00:01"},{"lean":4.3,"addDate":"08-12-2014 10:00:01"},{"lean":3.8,"addDate":"08-12-2014 10:00:01"},{"lean":4.8,"addDate":"08-12-2014 10:00:01"},{"lean":4.7,"addDate":"08-12-2014 10:00:01"},{"lean":5.2,"addDate":"08-12-2014 10:00:01"},{"lean":4.8,"addDate":"08-12-2014 10:00:01"},{"lean":3.1,"addDate":"08-12-2014 10:00:01"},{"lean":3.9,"addDate":"08-12-2014 10:00:01"},{"lean":5.9,"addDate":"08-12-2014 10:00:01"},{"lean":3.8,"addDate":"08-12-2014 10:00:01"},{"lean":3.6,"addDate":"08-12-2014 10:00:01"},{"lean":5.1,"addDate":"08-12-2014 10:00:01"},{"lean":4.1,"addDate":"08-12-2014 10:00:01"},{"lean":4.1,"addDate":"08-12-2014 10:00:01"},{"lean":5.1,"addDate":"08-12-2014 10:00:01"},{"lean":4.1,"addDate":"08-12-2014 10:00:01"},{"lean":5.1,"addDate":"08-12-2014 10:00:01"},{"lean":3.7,"addDate":"08-12-2014 10:00:01"},{"lean":5.0,"addDate":"08-12-2014 10:00:01"},{"lean":4.5,"addDate":"08-12-2014 10:00:01"},{"lean":5.2,"addDate":"08-12-2014 10:00:01"},{"lean":3.8,"addDate":"08-12-2014 10:00:01"},{"lean":4.3,"addDate":"08-12-2014 10:00:01"},{"lean":5.3,"addDate":"08-12-2014 10:00:01"},{"lean":4.2,"addDate":"08-12-2014 10:00:01"},{"lean":5.7,"addDate":"08-12-2014 10:00:01"},{"lean":3.7,"addDate":"08-12-2014 10:00:01"},{"lean":3.8,"addDate":"08-12-2014 10:00:01"},{"lean":4.0,"addDate":"08-12-2014 10:00:01"},{"lean":4.8,"addDate":"08-12-2014 10:00:01"},{"lean":5.5,"addDate":"08-12-2014 10:01:01"},{"lean":3.8,"addDate":"08-12-2014 10:01:01"},{"lean":5.0,"addDate":"08-12-2014 10:01:01"},{"lean":4.1,"addDate":"08-12-2014 10:01:01"},{"lean":4.1,"addDate":"08-12-2014 10:01:01"},{"lean":4.8,"addDate":"08-12-2014 10:01:01"},{"lean":4.2,"addDate":"08-12-2014 10:01:01"},{"lean":4.7,"addDate":"08-12-2014 10:01:01"},{"lean":4.7,"addDate":"08-12-2014 10:01:01"},{"lean":3.7,"addDate":"08-12-2014 10:01:01"},{"lean":3.9,"addDate":"08-12-2014 10:01:01"},{"lean":4.8,"addDate":"08-12-2014 10:01:01"},{"lean":4.5,"addDate":"08-12-2014 10:01:01"},{"lean":5.0,"addDate":"08-12-2014 10:01:01"},{"lean":4.7,"addDate":"08-12-2014 10:01:01"},{"lean":4.4,"addDate":"08-12-2014 10:01:01"},{"lean":3.8,"addDate":"08-12-2014 10:01:01"},{"lean":4.8,"addDate":"08-12-2014 10:01:01"},{"lean":5.6,"addDate":"08-12-2014 10:01:01"},{"lean":4.2,"addDate":"08-12-2014 10:01:01"},{"lean":3.8,"addDate":"08-12-2014 10:01:01"},{"lean":4.2,"addDate":"08-12-2014 10:01:01"},{"lean":4.0,"addDate":"08-12-2014 10:01:01"},{"lean":6.1,"addDate":"08-12-2014 10:01:01"},{"lean":4.1,"addDate":"08-12-2014 10:01:01"},{"lean":4.9,"addDate":"08-12-2014 10:01:01"},{"lean":4.4,"addDate":"08-12-2014 10:01:01"},{"lean":4.8,"addDate":"08-12-2014 10:01:01"},{"lean":3.7,"addDate":"08-12-2014 10:01:01"},{"lean":4.6,"addDate":"08-12-2014 10:01:01"},{"lean":4.9,"addDate":"08-12-2014 10:01:01"},{"lean":5.0,"addDate":"08-12-2014 10:01:01"},{"lean":3.9,"addDate":"08-12-2014 10:01:01"},{"lean":5.2,"addDate":"08-12-2014 10:01:01"},{"lean":4.9,"addDate":"08-12-2014 10:01:01"},{"lean":4.4,"addDate":"08-12-2014 10:01:01"},{"lean":5.4,"addDate":"08-12-2014 10:01:01"},{"lean":4.5,"addDate":"08-12-2014 10:01:01"},{"lean":4.6,"addDate":"08-12-2014 10:01:01"},{"lean":4.6,"addDate":"08-12-2014 10:01:01"},{"lean":5.3,"addDate":"08-12-2014 10:01:01"},{"lean":5.2,"addDate":"08-12-2014 10:01:01"},{"lean":4.8,"addDate":"08-12-2014 10:01:01"},{"lean":5.2,"addDate":"08-12-2014 10:01:01"},{"lean":5.2,"addDate":"08-12-2014 10:01:01"},{"lean":3.8,"addDate":"08-12-2014 10:01:01"},{"lean":5.7,"addDate":"08-12-2014 10:01:01"},{"lean":4.3,"addDate":"08-12-2014 10:02:01"},{"lean":4.4,"addDate":"08-12-2014 10:02:01"},{"lean":4.6,"addDate":"08-12-2014 10:02:01"},{"lean":5.0,"addDate":"08-12-2014 10:02:01"},{"lean":4.1,"addDate":"08-12-2014 10:02:01"},{"lean":4.9,"addDate":"08-12-2014 10:02:01"},{"lean":4.4,"addDate":"08-12-2014 10:02:01"},{"lean":3.5,"addDate":"08-12-2014 10:02:01"},{"lean":5.8,"addDate":"08-12-2014 10:02:01"},{"lean":4.1,"addDate":"08-12-2014 10:02:01"},{"lean":3.6,"addDate":"08-12-2014 10:02:01"},{"lean":5.4,"addDate":"08-12-2014 10:02:01"},{"lean":3.6,"addDate":"08-12-2014 10:02:01"},{"lean":5.1,"addDate":"08-12-2014 10:02:01"},{"lean":4.9,"addDate":"08-12-2014 10:02:01"},{"lean":5.6,"addDate":"08-12-2014 10:02:01"},{"lean":4.6,"addDate":"08-12-2014 10:02:01"},{"lean":4.6,"addDate":"08-12-2014 10:02:01"},{"lean":4.8,"addDate":"08-12-2014 10:02:01"},{"lean":3.6,"addDate":"08-12-2014 10:02:01"},{"lean":4.5,"addDate":"08-12-2014 10:02:02"},{"lean":5.0,"addDate":"08-12-2014 10:02:02"},{"lean":5.1,"addDate":"08-12-2014 10:02:02"},{"lean":5.9,"addDate":"08-12-2014 10:02:02"},{"lean":4.6,"addDate":"08-12-2014 10:02:02"},{"lean":4.7,"addDate":"08-12-2014 10:02:02"},{"lean":5.7,"addDate":"08-12-2014 10:02:02"},{"lean":5.7,"addDate":"08-12-2014 10:02:02"},{"lean":4.1,"addDate":"08-12-2014 10:02:02"},{"lean":3.4,"addDate":"08-12-2014 10:02:02"},{"lean":4.9,"addDate":"08-12-2014 10:02:02"},{"lean":6.1,"addDate":"08-12-2014 10:02:02"},{"lean":3.8,"addDate":"08-12-2014 10:02:02"},{"lean":4.1,"addDate":"08-12-2014 10:02:02"},{"lean":4.8,"addDate":"08-12-2014 10:02:02"},{"lean":4.5,"addDate":"08-12-2014 10:02:02"},{"lean":3.4,"addDate":"08-12-2014 10:02:02"},{"lean":3.5,"addDate":"08-12-2014 10:02:02"},{"lean":4.3,"addDate":"08-12-2014 10:02:02"},{"lean":4.0,"addDate":"08-12-2014 10:02:02"},{"lean":4.7,"addDate":"08-12-2014 10:02:02"},{"lean":4.6,"addDate":"08-12-2014 10:02:02"},{"lean":4.3,"addDate":"08-12-2014 10:02:02"},{"lean":4.7,"addDate":"08-12-2014 10:02:02"},{"lean":3.3,"addDate":"08-12-2014 10:02:02"},{"lean":4.6,"addDate":"08-12-2014 10:02:02"},{"lean":5.0,"addDate":"08-12-2014 10:02:02"},{"lean":4.6,"addDate":"08-12-2014 10:03:01"},{"lean":5.2,"addDate":"08-12-2014 10:03:01"},{"lean":4.4,"addDate":"08-12-2014 10:03:01"},{"lean":5.9,"addDate":"08-12-2014 10:03:01"},{"lean":3.1,"addDate":"08-12-2014 10:03:01"},{"lean":4.0,"addDate":"08-12-2014 10:03:01"},{"lean":4.2,"addDate":"08-12-2014 10:03:01"},{"lean":4.9,"addDate":"08-12-2014 10:03:01"},{"lean":4.1,"addDate":"08-12-2014 10:03:01"},{"lean":4.6,"addDate":"08-12-2014 10:03:01"},{"lean":3.6,"addDate":"08-12-2014 10:03:01"},{"lean":4.1,"addDate":"08-12-2014 10:03:01"},{"lean":5.4,"addDate":"08-12-2014 10:03:01"},{"lean":4.7,"addDate":"08-12-2014 10:03:01"},{"lean":5.0,"addDate":"08-12-2014 10:03:01"},{"lean":5.0,"addDate":"08-12-2014 10:03:01"},{"lean":4.4,"addDate":"08-12-2014 10:03:01"},{"lean":3.6,"addDate":"08-12-2014 10:03:01"},{"lean":5.0,"addDate":"08-12-2014 10:03:01"},{"lean":5.1,"addDate":"08-12-2014 10:03:01"},{"lean":5.5,"addDate":"08-12-2014 10:03:01"},{"lean":4.6,"addDate":"08-12-2014 10:03:01"},{"lean":4.7,"addDate":"08-12-2014 10:03:01"},{"lean":5.5,"addDate":"08-12-2014 10:03:01"},{"lean":3.9,"addDate":"08-12-2014 10:03:01"},{"lean":4.8,"addDate":"08-12-2014 10:03:01"},{"lean":5.3,"addDate":"08-12-2014 10:03:01"},{"lean":4.7,"addDate":"08-12-2014 10:03:01"},{"lean":3.2,"addDate":"08-12-2014 10:03:01"},{"lean":4.6,"addDate":"08-12-2014 10:03:01"},{"lean":3.4,"addDate":"08-12-2014 10:03:01"},{"lean":5.4,"addDate":"08-12-2014 10:03:01"},{"lean":4.9,"addDate":"08-12-2014 10:03:01"},{"lean":4.9,"addDate":"08-12-2014 10:03:01"},{"lean":5.1,"addDate":"08-12-2014 10:03:01"},{"lean":5.5,"addDate":"08-12-2014 10:03:01"},{"lean":3.5,"addDate":"08-12-2014 10:03:01"},{"lean":3.7,"addDate":"08-12-2014 10:03:01"},{"lean":4.9,"addDate":"08-12-2014 10:03:01"},{"lean":5.7,"addDate":"08-12-2014 10:03:02"},{"lean":4.0,"addDate":"08-12-2014 10:03:02"},{"lean":3.8,"addDate":"08-12-2014 10:03:02"},{"lean":3.6,"addDate":"08-12-2014 10:03:02"},{"lean":5.1,"addDate":"08-12-2014 10:03:02"},{"lean":3.6,"addDate":"08-12-2014 10:03:02"},{"lean":5.1,"addDate":"08-12-2014 10:03:02"},{"lean":4.8,"addDate":"08-12-2014 10:03:02"},{"lean":5.4,"addDate":"08-12-2014 10:03:02"},{"lean":5.6,"addDate":"08-12-2014 10:04:02"},{"lean":5.2,"addDate":"08-12-2014 10:04:02"},{"lean":4.8,"addDate":"08-12-2014 10:04:02"},{"lean":5.0,"addDate":"08-12-2014 10:04:02"},{"lean":5.1,"addDate":"08-12-2014 10:04:02"},{"lean":4.6,"addDate":"08-12-2014 10:04:02"},{"lean":3.6,"addDate":"08-12-2014 10:04:02"},{"lean":4.8,"addDate":"08-12-2014 10:04:02"},{"lean":4.1,"addDate":"08-12-2014 10:04:02"},{"lean":3.9,"addDate":"08-12-2014 10:04:02"},{"lean":4.5,"addDate":"08-12-2014 10:04:02"},{"lean":3.6,"addDate":"08-12-2014 10:04:02"},{"lean":4.5,"addDate":"08-12-2014 10:04:02"},{"lean":3.7,"addDate":"08-12-2014 10:04:02"},{"lean":4.8,"addDate":"08-12-2014 10:04:02"},{"lean":4.5,"addDate":"08-12-2014 10:04:02"},{"lean":5.4,"addDate":"08-12-2014 10:04:02"},{"lean":5.5,"addDate":"08-12-2014 10:04:02"},{"lean":5.4,"addDate":"08-12-2014 10:04:02"},{"lean":4.3,"addDate":"08-12-2014 10:04:02"},{"lean":3.7,"addDate":"08-12-2014 10:04:02"},{"lean":3.9,"addDate":"08-12-2014 10:04:02"},{"lean":4.2,"addDate":"08-12-2014 10:04:02"},{"lean":5.3,"addDate":"08-12-2014 10:04:02"},{"lean":5.1,"addDate":"08-12-2014 10:04:02"},{"lean":5.0,"addDate":"08-12-2014 10:04:02"},{"lean":5.7,"addDate":"08-12-2014 10:04:02"},{"lean":4.0,"addDate":"08-12-2014 10:04:02"},{"lean":5.0,"addDate":"08-12-2014 10:04:02"},{"lean":4.5,"addDate":"08-12-2014 10:04:02"},{"lean":4.6,"addDate":"08-12-2014 10:04:02"},{"lean":5.6,"addDate":"08-12-2014 10:04:02"},{"lean":5.7,"addDate":"08-12-2014 10:04:02"},{"lean":4.0,"addDate":"08-12-2014 10:04:02"},{"lean":4.8,"addDate":"08-12-2014 10:04:02"},{"lean":3.9,"addDate":"08-12-2014 10:04:02"},{"lean":3.5,"addDate":"08-12-2014 10:04:02"},{"lean":5.6,"addDate":"08-12-2014 10:04:02"},{"lean":3.5,"addDate":"08-12-2014 10:04:02"},{"lean":4.7,"addDate":"08-12-2014 10:04:02"},{"lean":4.7,"addDate":"08-12-2014 10:04:02"},{"lean":4.3,"addDate":"08-12-2014 10:04:02"},{"lean":3.5,"addDate":"08-12-2014 10:04:02"},{"lean":5.1,"addDate":"08-12-2014 10:04:02"},{"lean":3.8,"addDate":"08-12-2014 10:04:02"},{"lean":4.3,"addDate":"08-12-2014 10:05:01"},{"lean":4.7,"addDate":"08-12-2014 10:05:01"},{"lean":3.8,"addDate":"08-12-2014 10:05:01"},{"lean":4.6,"addDate":"08-12-2014 10:05:01"},{"lean":4.6,"addDate":"08-12-2014 10:05:01"},{"lean":3.5,"addDate":"08-12-2014 10:05:01"},{"lean":4.3,"addDate":"08-12-2014 10:05:01"},{"lean":5.5,"addDate":"08-12-2014 10:05:01"},{"lean":4.3,"addDate":"08-12-2014 10:05:01"},{"lean":4.6,"addDate":"08-12-2014 10:05:01"},{"lean":4.4,"addDate":"08-12-2014 10:05:01"},{"lean":3.8,"addDate":"08-12-2014 10:05:01"},{"lean":4.2,"addDate":"08-12-2014 10:05:01"},{"lean":4.6,"addDate":"08-12-2014 10:05:01"},{"lean":3.7,"addDate":"08-12-2014 10:05:01"},{"lean":3.8,"addDate":"08-12-2014 10:05:01"},{"lean":5.0,"addDate":"08-12-2014 10:05:01"},{"lean":4.4,"addDate":"08-12-2014 10:05:01"},{"lean":4.0,"addDate":"08-12-2014 10:05:01"},{"lean":5.6,"addDate":"08-12-2014 10:05:01"},{"lean":4.9,"addDate":"08-12-2014 10:05:01"},{"lean":4.3,"addDate":"08-12-2014 10:05:01"},{"lean":4.2,"addDate":"08-12-2014 10:05:01"},{"lean":4.0,"addDate":"08-12-2014 10:05:01"},{"lean":5.3,"addDate":"08-12-2014 10:05:01"},{"lean":3.4,"addDate":"08-12-2014 10:05:01"},{"lean":5.0,"addDate":"08-12-2014 10:05:01"},{"lean":4.2,"addDate":"08-12-2014 10:05:01"},{"lean":4.7,"addDate":"08-12-2014 10:05:02"},{"lean":4.8,"addDate":"08-12-2014 10:05:02"},{"lean":5.5,"addDate":"08-12-2014 10:05:02"},{"lean":3.9,"addDate":"08-12-2014 10:05:02"},{"lean":5.3,"addDate":"08-12-2014 10:05:02"},{"lean":4.0,"addDate":"08-12-2014 10:05:02"},{"lean":3.9,"addDate":"08-12-2014 10:05:02"},{"lean":3.7,"addDate":"08-12-2014 10:05:02"},{"lean":6.2,"addDate":"08-12-2014 10:05:02"},{"lean":4.6,"addDate":"08-12-2014 10:05:02"},{"lean":4.4,"addDate":"08-12-2014 10:05:02"},{"lean":4.5,"addDate":"08-12-2014 10:05:02"},{"lean":4.8,"addDate":"08-12-2014 10:05:02"},{"lean":4.8,"addDate":"08-12-2014 10:05:02"},{"lean":3.9,"addDate":"08-12-2014 10:05:02"},{"lean":4.7,"addDate":"08-12-2014 10:05:02"},{"lean":3.6,"addDate":"08-12-2014 10:05:02"},{"lean":5.3,"addDate":"08-12-2014 10:05:02"},{"lean":4.5,"addDate":"08-12-2014 10:05:02"},{"lean":3.4,"addDate":"08-12-2014 10:06:01"},{"lean":4.6,"addDate":"08-12-2014 10:06:01"},{"lean":5.4,"addDate":"08-12-2014 10:06:01"},{"lean":4.0,"addDate":"08-12-2014 10:06:01"},{"lean":4.0,"addDate":"08-12-2014 10:06:01"},{"lean":4.9,"addDate":"08-12-2014 10:06:01"},{"lean":5.9,"addDate":"08-12-2014 10:06:01"},{"lean":4.1,"addDate":"08-12-2014 10:06:01"},{"lean":4.9,"addDate":"08-12-2014 10:06:01"},{"lean":3.3,"addDate":"08-12-2014 10:06:01"},{"lean":3.9,"addDate":"08-12-2014 10:06:01"},{"lean":3.9,"addDate":"08-12-2014 10:06:01"},{"lean":4.0,"addDate":"08-12-2014 10:06:01"},{"lean":4.5,"addDate":"08-12-2014 10:06:01"},{"lean":4.2,"addDate":"08-12-2014 10:06:01"},{"lean":4.1,"addDate":"08-12-2014 10:06:01"},{"lean":4.8,"addDate":"08-12-2014 10:06:01"},{"lean":4.8,"addDate":"08-12-2014 10:06:01"},{"lean":5.2,"addDate":"08-12-2014 10:06:01"},{"lean":4.6,"addDate":"08-12-2014 10:06:01"},{"lean":4.3,"addDate":"08-12-2014 10:06:01"},{"lean":4.3,"addDate":"08-12-2014 10:06:01"},{"lean":3.8,"addDate":"08-12-2014 10:06:01"},{"lean":3.7,"addDate":"08-12-2014 10:06:01"},{"lean":4.7,"addDate":"08-12-2014 10:06:01"},{"lean":5.3,"addDate":"08-12-2014 10:06:01"},{"lean":4.7,"addDate":"08-12-2014 10:06:02"},{"lean":4.0,"addDate":"08-12-2014 10:06:02"},{"lean":5.1,"addDate":"08-12-2014 10:06:02"},{"lean":4.6,"addDate":"08-12-2014 10:06:02"},{"lean":5.1,"addDate":"08-12-2014 10:06:02"},{"lean":4.3,"addDate":"08-12-2014 10:06:02"},{"lean":5.3,"addDate":"08-12-2014 10:06:02"},{"lean":4.9,"addDate":"08-12-2014 10:06:02"},{"lean":4.0,"addDate":"08-12-2014 10:06:02"},{"lean":4.1,"addDate":"08-12-2014 10:06:02"},{"lean":5.4,"addDate":"08-12-2014 10:06:02"},{"lean":4.1,"addDate":"08-12-2014 10:06:02"},{"lean":4.9,"addDate":"08-12-2014 10:06:02"},{"lean":3.6,"addDate":"08-12-2014 10:06:02"},{"lean":4.0,"addDate":"08-12-2014 10:06:02"},{"lean":4.1,"addDate":"08-12-2014 10:06:02"},{"lean":4.1,"addDate":"08-12-2014 10:06:02"},{"lean":4.2,"addDate":"08-12-2014 10:06:02"},{"lean":4.2,"addDate":"08-12-2014 10:06:02"},{"lean":4.2,"addDate":"08-12-2014 10:06:02"},{"lean":4.7,"addDate":"08-12-2014 10:06:02"},{"lean":4.5,"addDate":"08-12-2014 10:06:02"},{"lean":4.0,"addDate":"08-12-2014 10:06:02"},{"lean":2.9,"addDate":"08-12-2014 10:07:01"},{"lean":4.8,"addDate":"08-12-2014 10:07:01"},{"lean":5.2,"addDate":"08-12-2014 10:07:01"},{"lean":4.1,"addDate":"08-12-2014 10:07:01"},{"lean":5.6,"addDate":"08-12-2014 10:07:01"},{"lean":4.2,"addDate":"08-12-2014 10:07:01"},{"lean":5.5,"addDate":"08-12-2014 10:07:01"},{"lean":5.1,"addDate":"08-12-2014 10:07:01"},{"lean":4.4,"addDate":"08-12-2014 10:07:01"},{"lean":5.0,"addDate":"08-12-2014 10:07:01"},{"lean":4.0,"addDate":"08-12-2014 10:07:01"},{"lean":4.1,"addDate":"08-12-2014 10:07:01"},{"lean":4.4,"addDate":"08-12-2014 10:07:01"},{"lean":3.2,"addDate":"08-12-2014 10:07:01"},{"lean":3.9,"addDate":"08-12-2014 10:07:01"},{"lean":5.2,"addDate":"08-12-2014 10:07:01"},{"lean":4.0,"addDate":"08-12-2014 10:07:01"},{"lean":4.2,"addDate":"08-12-2014 10:07:01"},{"lean":4.5,"addDate":"08-12-2014 10:07:01"},{"lean":5.2,"addDate":"08-12-2014 10:07:01"},{"lean":5.7,"addDate":"08-12-2014 10:07:01"},{"lean":3.6,"addDate":"08-12-2014 10:07:01"},{"lean":3.3,"addDate":"08-12-2014 10:07:01"},{"lean":4.2,"addDate":"08-12-2014 10:07:02"},{"lean":5.7,"addDate":"08-12-2014 10:07:02"},{"lean":4.7,"addDate":"08-12-2014 10:07:02"},{"lean":3.8,"addDate":"08-12-2014 10:07:02"},{"lean":5.0,"addDate":"08-12-2014 10:07:02"},{"lean":3.8,"addDate":"08-12-2014 10:07:02"},{"lean":5.1,"addDate":"08-12-2014 10:07:02"},{"lean":4.6,"addDate":"08-12-2014 10:07:02"},{"lean":4.0,"addDate":"08-12-2014 10:07:02"},{"lean":4.4,"addDate":"08-12-2014 10:07:02"},{"lean":5.7,"addDate":"08-12-2014 10:07:02"},{"lean":5.5,"addDate":"08-12-2014 10:07:02"},{"lean":3.7,"addDate":"08-12-2014 10:07:02"},{"lean":4.7,"addDate":"08-12-2014 10:07:02"},{"lean":4.3,"addDate":"08-12-2014 10:07:02"},{"lean":4.0,"addDate":"08-12-2014 10:07:02"},{"lean":5.2,"addDate":"08-12-2014 10:07:02"},{"lean":5.2,"addDate":"08-12-2014 10:07:02"},{"lean":4.5,"addDate":"08-12-2014 10:07:02"},{"lean":4.6,"addDate":"08-12-2014 10:07:02"},{"lean":5.6,"addDate":"08-12-2014 10:07:02"},{"lean":4.6,"addDate":"08-12-2014 10:08:01"},{"lean":4.2,"addDate":"08-12-2014 10:08:01"},{"lean":4.6,"addDate":"08-12-2014 10:08:01"},{"lean":5.4,"addDate":"08-12-2014 10:08:01"},{"lean":3.6,"addDate":"08-12-2014 10:08:01"},{"lean":3.0,"addDate":"08-12-2014 10:08:01"},{"lean":5.6,"addDate":"08-12-2014 10:08:01"},{"lean":3.9,"addDate":"08-12-2014 10:08:01"},{"lean":5.3,"addDate":"08-12-2014 10:08:01"},{"lean":5.2,"addDate":"08-12-2014 10:08:01"},{"lean":4.7,"addDate":"08-12-2014 10:08:01"},{"lean":4.3,"addDate":"08-12-2014 10:08:01"},{"lean":5.5,"addDate":"08-12-2014 10:08:01"},{"lean":6.0,"addDate":"08-12-2014 10:08:01"},{"lean":4.7,"addDate":"08-12-2014 10:08:01"},{"lean":4.1,"addDate":"08-12-2014 10:08:01"},{"lean":5.5,"addDate":"08-12-2014 10:08:01"},{"lean":5.5,"addDate":"08-12-2014 10:08:01"},{"lean":3.8,"addDate":"08-12-2014 10:08:01"},{"lean":4.5,"addDate":"08-12-2014 10:08:01"},{"lean":5.1,"addDate":"08-12-2014 10:08:01"},{"lean":3.5,"addDate":"08-12-2014 10:08:01"},{"lean":5.2,"addDate":"08-12-2014 10:08:01"},{"lean":3.7,"addDate":"08-12-2014 10:08:01"},{"lean":4.0,"addDate":"08-12-2014 10:08:01"},{"lean":4.3,"addDate":"08-12-2014 10:08:01"},{"lean":4.6,"addDate":"08-12-2014 10:08:01"},{"lean":4.5,"addDate":"08-12-2014 10:08:01"},{"lean":5.1,"addDate":"08-12-2014 10:08:01"},{"lean":4.2,"addDate":"08-12-2014 10:08:01"},{"lean":3.7,"addDate":"08-12-2014 10:08:01"},{"lean":3.4,"addDate":"08-12-2014 10:08:01"},{"lean":4.7,"addDate":"08-12-2014 10:08:01"},{"lean":4.2,"addDate":"08-12-2014 10:08:01"},{"lean":5.3,"addDate":"08-12-2014 10:08:01"},{"lean":5.2,"addDate":"08-12-2014 10:08:01"},{"lean":3.6,"addDate":"08-12-2014 10:08:01"},{"lean":5.0,"addDate":"08-12-2014 10:08:01"},{"lean":4.6,"addDate":"08-12-2014 10:08:01"},{"lean":5.0,"addDate":"08-12-2014 10:08:01"},{"lean":5.3,"addDate":"08-12-2014 10:08:01"},{"lean":3.4,"addDate":"08-12-2014 10:08:01"},{"lean":4.5,"addDate":"08-12-2014 10:08:01"},{"lean":4.9,"addDate":"08-12-2014 10:09:01"},{"lean":5.5,"addDate":"08-12-2014 10:09:01"},{"lean":4.8,"addDate":"08-12-2014 10:09:01"},{"lean":4.0,"addDate":"08-12-2014 10:09:01"},{"lean":3.6,"addDate":"08-12-2014 10:09:01"},{"lean":5.6,"addDate":"08-12-2014 10:09:01"},{"lean":4.7,"addDate":"08-12-2014 10:09:01"},{"lean":3.2,"addDate":"08-12-2014 10:09:01"},{"lean":3.7,"addDate":"08-12-2014 10:09:01"},{"lean":3.6,"addDate":"08-12-2014 10:09:01"},{"lean":3.5,"addDate":"08-12-2014 10:09:01"},{"lean":5.0,"addDate":"08-12-2014 10:09:01"},{"lean":5.0,"addDate":"08-12-2014 10:09:01"},{"lean":3.6,"addDate":"08-12-2014 10:09:01"},{"lean":4.3,"addDate":"08-12-2014 10:09:01"},{"lean":4.9,"addDate":"08-12-2014 10:09:01"},{"lean":3.7,"addDate":"08-12-2014 10:09:01"},{"lean":3.4,"addDate":"08-12-2014 10:09:01"},{"lean":4.6,"addDate":"08-12-2014 10:09:01"},{"lean":4.2,"addDate":"08-12-2014 10:09:01"},{"lean":5.0,"addDate":"08-12-2014 10:09:01"},{"lean":4.3,"addDate":"08-12-2014 10:09:02"},{"lean":4.1,"addDate":"08-12-2014 10:09:02"},{"lean":4.4,"addDate":"08-12-2014 10:09:02"},{"lean":4.4,"addDate":"08-12-2014 10:09:02"},{"lean":5.3,"addDate":"08-12-2014 10:09:02"},{"lean":3.2,"addDate":"08-12-2014 10:09:02"},{"lean":4.1,"addDate":"08-12-2014 10:09:02"},{"lean":4.0,"addDate":"08-12-2014 10:09:02"},{"lean":3.5,"addDate":"08-12-2014 10:09:02"},{"lean":4.1,"addDate":"08-12-2014 10:09:02"},{"lean":4.3,"addDate":"08-12-2014 10:09:02"},{"lean":5.6,"addDate":"08-12-2014 10:09:02"},{"lean":4.3,"addDate":"08-12-2014 10:09:02"},{"lean":3.9,"addDate":"08-12-2014 10:09:02"},{"lean":4.7,"addDate":"08-12-2014 10:09:02"},{"lean":5.6,"addDate":"08-12-2014 10:09:02"},{"lean":4.5,"addDate":"08-12-2014 10:09:02"},{"lean":4.2,"addDate":"08-12-2014 10:09:02"},{"lean":4.9,"addDate":"08-12-2014 10:09:02"},{"lean":5.2,"addDate":"08-12-2014 10:09:02"},{"lean":5.1,"addDate":"08-12-2014 10:09:02"},{"lean":4.2,"addDate":"08-12-2014 10:09:02"},{"lean":5.3,"addDate":"08-12-2014 10:09:02"},{"lean":3.9,"addDate":"08-12-2014 10:09:02"},{"lean":5.4,"addDate":"08-12-2014 10:09:02"},{"lean":4.4,"addDate":"08-12-2014 10:09:02"},{"lean":3.3,"addDate":"08-12-2014 10:09:02"},{"start":"08-12-2014 10:00:00","end":"08-12-2014 10:10:00"}];
var x=1;
var dataofHighChart = [];
var meandataofHighChart = 0;
for(var event in data1){
var dataCopy = data1[event];
if(x==1){
meandataofHighChart =(dataCopy.mean);
console.info(meandataofHighChart);
}
dataofHighChart.push({
y:dataCopy.lean,
dateVal:dataCopy.addDate
});
x++;
}
var qaChart = new Highcharts.Chart({
chart: {
zoomType: "x",
renderTo: 'chart_div', // like
},
title: {
text: 'QA Chart', style: { "font-weight": "bold","font-size": "16px;"},
x: -20 //center
},
xAxis: {
floor: 1,
allowDecimals:false,
title: {
text: 'Frame Number',style: { "font-weight": "bold","font-size": "14px;"}
}
},
plotOptions: {
line: {
turboThreshold: x
}
},
tooltip: {
formatter: function () {
return 'Frame Number : '+this.point.x+'<br/> % Lean : '+this.point.y+ ' % <br/> Added Date : '+this.point.dateVal;
}
},
yAxis: {
title: {
text: '% Lean',style: { "font-weight": "bold","font-size": "14px;"}
},
plotLines: [{
value:meandataofHighChart,
color: 'red',
width:2,
zIndex:4,
label:{text:''}}]
},
series: [{
name: '% Lean',
data: dataofHighChart
}]
});
});
The problem is that in you loop you push a object with undefined point (y value) so you receive and error in highcharts (wrong path of line). Only what you need is add a condition which check a value of pushed y param.
if(dataCopy.lean!==UNDEFINED) {
dataofHighChart.push({
y: dataCopy.lean,
dateVal: dataCopy.addDate
});
}
Correct example: http://jsfiddle.net/sbochan/615Lfz15/1/

Is there a way to load data into Highstock without the use of PHP?

I've been bashing my head for 3 days trying all three methods of loading data into Highstock chart. Is there a way to import data without using PHP? I'm on an IIS Server with no PHP installed.
When I use the $j.getJSON() method pointing to http://www.highcharts.com/samples/data/jsonp.php it works fine. However, when I started trying to add my own data (I tried CSV and XML) I can see everything runs without a problem via the firebug console, but I get a weird result.
http://i.imgur.com/qj5y8bM.png
Can I please get a sample (3 plot points) for a Stockchart chart. All the samples I can find are for a Highchart Barchart. Which is a completely different beast than what I'm doing with StockChart. Please, I need a sample CSV and sample JSON to base this off of. Somebody please help.
Take a look the docs, there're some demos and explanation about how to do it.
First, create the csv.
Categories,Apples,Pears,Oranges,Bananas
John,8,4,6,5
Jane,3,4,2,3
Joe,86,76,79,77
Janet,3,16,13,15
Second, define the basic chart options.
var options = {
chart: {
renderTo: 'container',
defaultSeriesType: 'column'
},
title: {
text: 'Fruit Consumption'
},
xAxis: {
categories: []
},
yAxis: {
title: {
text: 'Units'
}
},
series: []
};
Third, process data.
$.get('data.csv', function(data) {
// Split the lines
var lines = data.split('\n');
// Iterate over the lines and add categories or series
$.each(lines, function(lineNo, line) {
var items = line.split(',');
// header line containes categories
if (lineNo == 0) {
$.each(items, function(itemNo, item) {
if (itemNo > 0) options.xAxis.categories.push(item);
});
}
// the rest of the lines contain data with their name in the first position
else {
var series = {
data: []
};
$.each(items, function(itemNo, item) {
if (itemNo == 0) {
series.name = item;
} else {
series.data.push(parseFloat(item));
}
});
options.series.push(series);
}
});
// Create the chart
var chart = new Highcharts.Chart(options);
});
And here is the result.
You should be able to load data into a Highcharts/Highstock object by using an array or a named-value object. The PHP sample URL on highcharts.com returns JSON data that can be understood by Highcharts/Highstock, but you can use any data source that returns JSON data.
As an example, here is some code that uses a simple array for the series data:
$(function() {
window.chart = new Highcharts.StockChart({
chart : {
renderTo : 'container'
},
title : {
text : 'My chart'
},
series : [{
name : 'My Series',
data : [
[Date.UTC(2006, 0, 29, 0, 0, 0), 30.14],
[Date.UTC(2006, 0, 29, 1, 0, 0), 34.76],
[Date.UTC(2006, 0, 29, 2, 0, 0), 34.34],
[Date.UTC(2006, 0, 29, 3, 0, 0), 33.9]
]
}]
});
});
Here's a live sample: http://jsfiddle.net/fF9Ru/1/
If you have an existing data source, please post a sample of the data it is returning. The chart may not be rendering if the data is not properly formatted.

Resources