Here is an example of a basic sparkline. I couldn't find any examples on
the net, so maybe this can be useful to someone. Copy and paste into
playground.
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable();
data.addColumn('date', 'xAxis');
data.addColumn('number', 'sparkline');
data.addColumn('number', '148');
data.addRow([new Date('10/14/2012'),149,null]);
data.addRow([new Date('10/15/2012'),147,null]);
data.addRow([new Date('10/16/2012'),148,null]);
data.addRow([new Date('10/17/2012'),148,null]);
data.addRow([new Date('10/18/2012'),149,null]);
data.addRow([new Date('10/19/2012'),148,null]);
data.addRow([new Date('10/20/2012'),148,null]);
data.addRow([new Date('10/21/2012'),150,null]);
data.addRow([new Date('10/22/2012'),150,null]);
data.addRow([new Date('10/23/2012'),149,null]);
data.addRow([new Date('10/24/2012'),147,null]);
data.addRow([new Date('10/25/2012'),148,148]);
// Create and draw the visualization.
new google.visualization.LineChart(document.getElementById('visualization'
)).
draw(data, {curveType: "function",
width: 100, height: 22,
vAxis: {maxValue: 10},
hAxis: {textPosition: 'none', gridlines: {color:
'transparent'}},
vAxis: {textPosition: 'none', gridlines: {color:
'transparent'}},
baselineColor: 'transparent',
enableInteractivity: false,
legend: 'none',
series: {0:{color: 'blue', visibleInLegend: false,
lineWidth:1}, 1:{color: 'red', visibleInLegend: true, lineWidth:0, pointSize
:3}}
}
);
}
On Tuesday, 17 July 2012 12:24:28 UTC-3, asgallant wrote:
>
> Set vAxis.baselineColor to 'transparent':
>
> vAxis: {
> textPosition: 'none',
> gridlines: {
> color: 'transparent'
> },
> baselineColor: 'transparent'
> }
>
> On Monday, July 16, 2012 7:46:02 PM UTC-4, billsaysthis wrote:
>>
>> Given the deprecation notice we are switching our sparkline
>> implementation to linechart. However I cannot see what option to use to
>> remove the black horizontal line at the bottom of the chart.
>>
>> To help understand what I mean, in the Visualization Playground I changed
>> the default linechart options to these:
>>
>> new google.visualization.LineChart(document.getElementById(
>> 'visualization')).
>> draw(data, {
>> hAxis: {textPosition: 'none'},
>> vAxis: {textPosition: 'none', gridlines: {color: 'transparent'}},
>> });
>>
>> The result is fine, except for the black line across the bottom. How do I
>> remove it?
>>
>> Thanks,
>> Bill
>>
>
--
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/-/raE4EaEva9QJ.
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.
