almende / vis

⚠️ This project is not maintained anymore! Please go to https://github.com/visjs
7.85k stars 1.48k forks source link

Min and Max graph in vis.Graph2d #634

Closed DivyashreeMS closed 9 years ago

DivyashreeMS commented 9 years ago

Hi,

I had a small requirement, I am using vis.Graph2d to plot the graph items, But I need a small information to highlight like Min Range and Max Range. Please provide the sample for this.

minmaxrange

Thanks Divya

AlexDM0 commented 9 years ago

Hi,

This is not exactly possible at the moment BUT you could 'fake' it. You could make two extra groups, called min and max, with two points each: one point in the past (say 2005-01-01) and one in the future (say 2020-01-01). Give the points in the max group the max y value and the points in the min group the min y value.

Regards

DivyashreeMS commented 9 years ago

Hi Alex,

Thank you for the solution provided, but I could not follow you. as per the example the y axis values are 72.0, 36.0,32.0 and also I will be providing the Min value for example 20.0 and max value will be 80,what i all need is to show some indication in the graph that Minimum and Maximum values in the graph. I hope I am clear with this.

var container = document.getElementById('visualization');

  var group = new vis.DataSet();
//How to show the Min value in the Group?-20
  group.add({
        id: 3,
        content: 'Group 1'

      });
  //How to show the Max value in the Group?-80
  group.add({
        id: 1,
        content: 'Group 3'

      });

  var items = [
      {x: '02/24/2015', y: 72.0,id:1},
      {x: '03/03/2015', y: 36.0,id:2},
      {x: '03/10/2015', y: 32.0,id:3},
  ];

  var dataset = new vis.DataSet(items);
  var options = {
      start: '2015-02-24',
      end: '2015-03-12',
      hiddenDates: [
                    {start: '2015-02-25', end: '2015-03-03'},
                    {start: '2015-03-04', end: '2015-03-10'},
                    {start: '2015-03-11', end: '2015-03-12'}// daily weekly monthly yearly

                ],
                width: '1350px',

      drawPoints: {
          style: 'square' // square, circle
      },

  };
  var Graph2d = new vis.Graph2d(container, dataset,options,group);
AlexDM0 commented 9 years ago

Hi,

Pretty much exactly as I said:

http://jsbin.com/hijefakaza/2/edit?html,output

For next time, could you setup your code in a jsbin like the one I just made for you?

Regards,

Alex

DivyashreeMS commented 9 years ago

Hi Alex,

Thanks you for the quick solution. It is working fine as expected, unfortunately i will not be able to setup code in a jsbin due to access restrictions.

Thanks & Regards Divya