Hello Daniel,

Thanks for suggesting the work around. Can you please help me with a sample 
code that does my required functionality..




On Wednesday, June 15, 2016 at 10:39:58 AM UTC-5, Daniel LaLiberte wrote:
>
> Hi Steve,
>
> Sounds like you have found a bug.  I haven't tried to reproduce it yet, 
> but I would suspect this is caused by the fact that the ScatterChart is 
> actually implemented internally using a LineChart with lineWidth of 0 and 
> pointSize of 8.  Perhaps on redrawing, it gets confused about part of this 
> internal hack.    As a workaround, you might try doing the same thing 
> explicitly.  That is, use LineChart instead, and set the lineWidth option 
> to 0.
>
> Another possible workaround is to use LineChart with a 'series' option and 
> set the 'type' of series 0 to 'scatter'.
>
>
> On Wed, Jun 15, 2016 at 9:38 AM, <[email protected] <javascript:>> 
> wrote:
>
>> When building the original chart, I have specified the style, shape and 
>> size of the Point in my data.. and it rendered perfectly. Onclick,I change 
>> the fill color of the clicked point and redraw the chart. While redrawing 
>> the chart, default point size (0) is being rendered.. Is there anyway that 
>> I can redraw the chart by keeping the size of the point.?
>> Please find the attached images and code below.
>>
>> <script type="text/javascript">
>>  google.charts.load('current', {'packages':['corechart']});
>>  google.charts.setOnLoadCallback(drawChart);
>>  function drawChart() {
>>         var data = google.visualization.arrayToDataTable([
>>           ['M', 'MC,{'type':'string','role':'legend'},{'type': 'string', 
>> 'role': 'tooltip'}, {'type': 'string', 'role': 'style'}],
>>           [-2,-10,'Tr','A1','point { size:14;shape-type: circle; 
>> fill-color: none;stroke-color:#66dcff  }'],
>>           [5,14,'Tr','A2','point { size:14;shape-type: circle; 
>> fill-color: none;stroke-color:#66dcff  }'],
>>           [11,7,'Tr','A3','point { size:14;shape-type: circle; 
>> fill-color: none;stroke-color:#66dcff  }'],...........................]);
>>         
>>        var options = {
>> is3D: true,
>>                   title: 'With PP',
>>  titleTextStyle:{color: 'white'},
>>  width:800,height:750,         
>>                   legend: 'none',        
>>   backgroundColor: '#191919',
>>    explorer: { maxZoomOut:2,
>>                                   keepInBounds: true },
>> textStyle: {
>>                    fontName: 'Times-Roman',
>>                    fontSize: 18,
>>                    bold: true,
>>                    italic: true,
>>                     }
>>         };
>>
>>     var chart = new 
>> google.visualization.ScatterChart(document.getElementById('chart_div'));
>>     function selectHandler() {
>>           var selectedItem = chart.getSelection()[0];
>>  var row=selectedItem.row;
>>           if (selectedItem) {
>>             var pr= data.getValue(selectedItem.row, 3);
>>             alert('The user selected ' + pr);
>> var view = new google.visualization.DataView(data);
>> console.log(view);
>>             view.setColumns([0, 1, {
>>                 type: 'string',
>>                 role: 'style',
>>                 calc: function (dt, i) {
>>                     return (i == row) ? 'fill-color: red' : 
>> 'fill-color:grey'
>>                 }
>>             }]);
>> chart.draw(view, {
>>               is3D: true,
>>                   title: 'With PP',
>>   titleTextStyle:{color: 'white'},
>>   width:800,height:750,         
>>                   legend: 'none',        
>>    backgroundColor: '#191919',
>>     explorer: { maxZoomOut:2,
>>                                   keepInBounds: true },
>> textStyle: {
>>                    fontName: 'Times-Roman',
>>                    fontSize: 18,
>>                    bold: true,
>>                    italic: true,
>>                     }
>>         }
>>
>>         google.visualization.events.addListener(chart, 'select', 
>> selectHandler); 
>>
>>         chart.draw(data, options);
>>       }
>> </script>
>>
>> Thank you!!!
>>
>> -- 
>> You received this message because you are subscribed to the Google Groups 
>> "Google Visualization API" group.
>> To unsubscribe from this group and stop receiving emails from it, send an 
>> email to [email protected] 
>> <javascript:>.
>> To post to this group, send email to [email protected] 
>> <javascript:>.
>> Visit this group at 
>> https://groups.google.com/group/google-visualization-api.
>> To view this discussion on the web visit 
>> https://groups.google.com/d/msgid/google-visualization-api/12a589c0-a618-4838-8036-bc4f5c0b4bef%40googlegroups.com
>>  
>> <https://groups.google.com/d/msgid/google-visualization-api/12a589c0-a618-4838-8036-bc4f5c0b4bef%40googlegroups.com?utm_medium=email&utm_source=footer>
>> .
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>
>
> -- 
> Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2>
> [email protected] <javascript:>   5CC, Cambridge MA
>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Visualization 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 https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/d39efc17-f7c2-4713-8d28-797dab86e5c0%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to