Ananya,

Can you read my embedded comments, which are:

You can change the color of all the data points by using the 'colors'
option, with one color. e.g. colors: ['red']

The best way to make overlapping points distinguishable might be to use the
dataOpacity option.  This seemed to work well: dataOpacity: 0.3
You can also make the point size smaller, or change its shape.  See:
https://developers.google.com/chart/interactive/docs/gallery/scatterchart

re zooming to milliseconds: there are some bugs in the timeofday axis when
used with the explorer mode.  I have fixes that should be available in a
few weeks.



On Thu, Jun 5, 2014 at 5:40 AM, Ananya Ojha <[email protected]>
wrote:

> How to zoom upto millisecond.. PLease  give me some idea. And can you
> please tell me how to change individual data point's size and color in
> scatter chart?
>
>
> On Wednesday, 4 June 2014 20:07:08 UTC+5:30, Daniel LaLiberte wrote:
>>
>>
>>
>> On Wednesday, June 4, 2014 3:51:59 AM UTC-4, Ananya Ojha wrote:
>>>
>>> 1) How to change scatter chart's data point's color?
>>>
>>
>> You can change the color of all the data points by using the 'colors'
>> option, with one color. e.g. colors: ['red']
>>
>>
>>> 2) How to change overlapped data point's color so they can be
>>> distinguished easier?
>>>
>>
>> The best way to make overlapping points distinguishable might be to use
>> the dataOpacity option.  This seemed to work well: dataOpacity: 0.3
>> You can also make the point size smaller, or change its shape.  See:
>> https://developers.google.com/chart/interactive/docs/gallery/scatterchart
>>
>> 3) How to zoom this chart up to nano seconds?
>>>
>>
>> The 'nano' level is smaller than the timeofday values will support.  If
>> you mean 'milli' seconds, it should work, but there are some bugs in the
>> timeofday axis when used with the explorer mode.  I have fixes that should
>> be available in a few weeks.
>>
>>
>>
>>> Here is the code:
>>>
>>> <html>
>>>   <head>
>>>     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/
>>> jquery.min.js"></script>
>>>     <script type="text/javascript" src="https://www.google.com/jsapi
>>> "></script>
>>>     <script type="text/javascript">
>>>       var jdata = [ { "file": "1a24ae6b3e6fafe458ce680d9b472b85",
>>> "type": "Opened", "pc": 0, "details": "C:\\Sandbox\\briefdocument.pdf",
>>> "timestart": "2014-04-03 15:02:00" }, { "file": "
>>> 1a24ae6b3e6fafe458ce680d9b472b85", "type": "Renamed", "pc": 0,
>>> "details": "C:\\Sandbox\\briefdocument.pdf", "timestart": "2014-04-03
>>> 14:58:47" }, { "file": "3fcdd1ee5efc6c9a400bae4ba25b137d", "type":
>>> "Printed", "pc": 0, "details": "C:\\pdf_commenting_new.pdf", "timestart":
>>> "2014-04-03 14:54:43" }, { "file": "58dd597d395e898d2d573bf17b61d55e",
>>> "type": "Opened", "pc": 0, "details": "C:\\PDFs\\WebConfig789.pdf",
>>> "timestart": "2014-04-03 14:57:39" }, { "file": "
>>> 58dd597d395e898d2d573bf17b61d55e", "type": "Renamed", "pc": 0,
>>> "details": "C:\\PDFs\\WebConfig789.pdf", "timestart": "2014-04-03 14:55:44"
>>> }, { "file": "738b2ed34cc03fc98089a178db08490d", "type": "Created",
>>> "pc": 0, "details": "C:\\Autoship-chrg-stock-orders.pdf", "timestart":
>>> "2014-04-02 20:18:23" }, { "file": "738b2ed34cc03fc98089a178db08490d",
>>> "type": "Opened", "pc": 0, "details": "C:\\Autoship-chrg-stock-orders.pdf",
>>> "timestart": "2014-04-03 13:26:14" }, { "file": "
>>> 738b2ed34cc03fc98089a178db08490d", "type": "Printed", "pc": 0,
>>> "details": "C:\\Autoship-chrg-stock-orders.pdf", "timestart":
>>> "2014-04-03 13:26:45" }, { "file": "be2a2db6fa5a6ba360f66abdbe903ba5",
>>> "type": "Opened", "pc": 0, "details": "C:\\LINQ+Introduction.pdf",
>>> "timestart": "2014-04-02 20:20:56" }, { "file": "
>>> be2a2db6fa5a6ba360f66abdbe903ba5", "type": "Opened", "pc": 0,
>>> "details": "C:\\LINQ+Introduction.pdf", "timestart": "2014-04-03 14:55:21"
>>> }, { "file": "bf491f0f97ecb717ea937cf3339ff119", "type": "Opened",
>>> "pc": 0, "details": "C:\\designerrenaming.pdf", "timestart": "2014-04-02
>>> 20:27:32" }, { "file": "bf491f0f97ecb717ea937cf3339ff119", "type":
>>> "Opened", "pc": 0, "details": "C:\\designerrenaming.pdf", "timestart":
>>> "2014-04-03 13:08:36" }, { "file": "c1d481d512f70392cd03336fd77c56d4",
>>> "type": "Created", "pc": 0, "details": "C:\\Sandbox\\Kentico Document
>>> Database.pdf", "timestart": "2014-04-03 14:57:31" }, { "file": "
>>> c1d481d512f70392cd03336fd77c56d4", "type": "Opened", "pc": 0,
>>> "details": "C:\\Sandbox\\Kentico Document Database.pdf", "timestart":
>>> "2014-04-03 14:57:31" }, { "file": "d7668f16f4ce5cd589773d682899d30d",
>>> "type": "Created", "pc": 0, "details": "C:\\Globalization.pdf",
>>> "timestart": "2014-04-03 14:53:00" } ];
>>> google.load("visualization", "1", {packages:["corechart"]});
>>> google.setOnLoadCallback(drawChart);
>>>
>>> function drawChart() {
>>>     var data = new google.visualization.DataTable();
>>>     //data.addColumn('string', 'ID');
>>>     data.addColumn('date', 'Date');
>>>     data.addColumn('timeofday', 'Time');
>>>     data.addColumn({type: 'string', role: 'tooltip'});
>>>
>>>
>>>     $.each(jdata, function(k,v) {
>>>
>>>         // assumes your date strings are in the format "yyyy-MM-dd
>>> HH:mm:ss"
>>>         var dateTimeArr = v.timestart.split(' ');
>>>         var dateArr = dateTimeArr[0].split('-');
>>>         var timeArr = dateTimeArr[1].split(':');
>>>         var year = parseInt(dateArr[0]);
>>>         var month = parseInt(dateArr[1]) - 1; // subtract 1 to change to
>>> javascript's 0-indexed months
>>>         var day = parseInt(dateArr[2]);
>>>         var hours = parseInt(timeArr[0]);
>>>         var minutes = parseInt(timeArr[1]);
>>>         var seconds = parseInt(timeArr[2]);
>>>         data.addRow([new Date(year, month, day), [hours, minutes,
>>> seconds],v.details]);
>>>     });
>>>     var numberOfPoints = data.getNumberOfRows();
>>>     var options = {
>>>         title: 'Date vs. Time comparison',
>>>         explorer: {
>>>              actions: ['dragToZoom', 'rightClickToReset']
>>>          }
>>>     };
>>>
>>>     var chart = new google.visualization.ScatterChart(document.
>>> getElementById('chart_div'));
>>>     chart.draw(data, options);
>>> }
>>>     </script>
>>>   </head>
>>>   <body>
>>>     <div id="chart_div" style="width: 900px; height: 500px;"></div>
>>>   </body>
>>> </html>
>>>
>>>
>>> Please help..
>>>
>>>
>>>  --
> You received this message because you are subscribed to the Google Groups
> "Google Chart API" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To post to this group, send email to [email protected].
> Visit this group at http://groups.google.com/group/google-chart-api.
> For more options, visit https://groups.google.com/d/optout.
>



-- 
Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2>  -
978-394-1058
[email protected] <[email protected]>   5CC, Cambridge MA
[email protected] <[email protected]> 9 Juniper Ridge
Road, Acton MA

-- 
You received this message because you are subscribed to the Google Groups 
"Google Chart API" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-chart-api.
For more options, visit https://groups.google.com/d/optout.

Reply via email to