You have to redraw the chart with the new dimensions before printing - they
don't scale automatically when the CSS changes. If users are printing by
clicking a print button in your page, you can call a redraw from the event
handler on that button. If they are printing via file->print, it is harder
to do, as there is no standard means to detect a print request from the
browser. This thread might help, though:
http://stackoverflow.com/questions/534977/javascript-event-handler-for-print
On Tuesday, July 24, 2012 9:53:51 AM UTC-4, Wesley Chin wrote:
>
> Hi guys,
>
> I have a stylesheet where I do all my formatting to print a page. I want
> to resize the Google chart I made.
>
> Here is part of my CSS for the printing:
>
> @media print {
>
> .navbar{
> display: none;
> }
>
> .heading{
> display: none;
> }
>
> .hiddenVariables{
> display: none:
> }
>
> .printVisible {
> display: block;
> }
>
> .printHide {
> display: none;
> }
>
> .mouse-over-button {
> display: none;
> }
>
> .well{
> border: none;
> -webkit-box-shadow: 0px 0px 0px 0px transparent;
> box-shadow: 0px 0px 0px 0px transparent;
> background-color: transparent;
> margin:0px;
> -webkit-border-radius: 0px;
> -moz-border-radius: 0px;
> border-radius: 0px;
> }
>
> Here is my HTML for the chart:
>
> <div class="offset1 span4" id="oppSplitPieChart1_div">
>
> Here is the Javascript that makes the chart:
>
> function drawOppSplitBuildingSegmentChart(oppSplitBuildStage,
> oppSplitBuildFrom, oppSplitBuildTo) {
> $(function ()
> {
> $.ajax({
> url: 'queries/OppSplitBuildingChartQuery.php',
>
> data: "oppSplitBuildStageID=" +
> oppSplitBuildStage + "&oppSplitBuildFrom=" + oppSplitBuildFrom +
> "&oppSplitBuildTo=" + oppSplitBuildTo,
> dataType: 'json',
> success: function(result)
> {
> //console.log(result);
> var oppSplitBuildingData =
> JSON.parse(result);
> var data =
> google.visualization.arrayToDataTable(oppSplitBuildingData);
>
>
> var formatter = new
> google.visualization.NumberFormat(
> {prefix: 'R'});
> formatter.format(data, 1);
>
> var options = {'title':'Market Segment',
> 'titleTextStyle':{fontSize:15},
> 'width':420,
> 'height':330,
>
> 'chartArea':{left:0,top:60,width:"100%"},
> 'legend':{alignment:'center'}
> };
>
> var chart = new
> google.visualization.PieChart(document.getElementById('oppSplitPieChart1_div'));
>
>
>
> function selectHandler() {
> var selectedItem =
> chart.getSelection()[0];
> if (selectedItem) {
> var buildingSegmentName =
> data.getValue(selectedItem.row, 0);
>
> populateHiddenVariables(oppSplitBuildStage, oppSplitBuildFrom,
> oppSplitBuildTo, buildingSegmentName, "", "");
> }
> //console.log(buildingSegmentName);
>
> drawOppSplitMarketingSegmentChart(oppSplitBuildStage, oppSplitBuildFrom,
> oppSplitBuildTo, buildingSegmentName);
> drawOppSplitRegionChart(0, 0, 0, 0, 0);
> drawOppSplitBranchChart(0, 0, 0, 0, 0,
> 0);
> }
>
>
> google.visualization.events.addListener(chart, 'select', selectHandler);
> chart.draw(data, options);
> }
> });
>
>
> });
> }
>
> Any help is appreciated.
>
> Many thanks in advance,
> Wesley
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-visualization-api/-/61zOEmRa1igJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
