I have a Google LineChart with multiple lines. These points do not share the same X value's so i have to format my data in a certain way to make it work:
var data = google.visualization.arrayToDataTable([
["Y", "Your X & Y", "Product 1", "Product 2", "Product 3"],
[419, 589, null, null, null],
[386, null, 504, null, null],
[386, null, 526, null, null],
[387, null, 543, null, null],
[395, null, 564, null, null],
[402, null, 591, null, null],
[408, null, 612, null, null],
[378, null, null, 501, null],
[398, null, null, null, 600],
[460, null, null, null, 500]
]);
Now i want to add custom tooltips to these lines, i've tried adding an extra column and setting the role to tooltip.. but this only affects the first line.
see both charts (with and without tooltip): http://jsfiddle.net/TD92C/8/
How do i add custom tooltips for all lines? Thanks
SOLVED:
http://jsfiddle.net/asgallant/TD92C/14/
you have to make your variable like this
var data = google.visualization.arrayToDataTable([
//Columns
["Y", //Name of the X-axis marker
"Your X & Y",{type: 'string', role: 'tooltip'},
"Product 1",{type: 'string', role: 'tooltip'},
"Product 2",{type: 'string', role: 'tooltip'},
"Product 3",{type: 'string', role: 'tooltip'},],
//Rows
//Add tooltip column after every value in each row
[419,589,"tooltip info about your x & y",null,'',null,'',null,''],
[386,null,'',504,'','Custom Tooltip',null,'',null,''],
[386,null,'',526,'Custom Tooltip',null,'',null,''],
[387,null,'',543,'Custom Tooltip',null,'',null,''],
[378,null,'',null,'',501,'Custom Tooltip',null,''],
[383,null,'',null,'',511,'Custom Tooltip',null,''],
[368,null,'',null,'',null,'',526,'Custom Tooltip'],
[373,null,'',null,'',null,'',547,'Custom Tooltip'],
]);
Fiddle
Data is looking different but if you correct the first element to a string which is exactly as the columns displayed in 1st column index it will be correct
Related
We're using the following code to add a table with 3 columns and a number of rows determined by the number of items in a collection. The first row in the table has headers. We want to bold them but I can't figure out how to do that. I was reading through this but it wasn't making sense on how to get the start and end index of the text in the header row.
var body = new BatchUpdateDocumentRequest {Requests = new List<Request>()
{
new Request()
{
InsertTable = new InsertTableRequest()
{
EndOfSegmentLocation = new EndOfSegmentLocation
{
SegmentId = ""
},
Columns = 3,
Rows = contractAddendums.Items.Count
}
}
}};
docService.Documents.BatchUpdate(body, docId).Execute();
var doc = docService.Documents.Get(newDocId).Execute();
var table = doc.Body.Content.FirstOrDefault(x => x.Table != null).Table;
var requests = new List<Request>();
for (var i = contractAddendums.Items.Count - 1; i > -1; i--){
var row = contractAddendums.Items[i];
var r1 = new Request()
{
InsertText = new InsertTextRequest()
{
Text = row.Text,
Location = new Location()
{
Index = table.TableRows[i].TableCells[2].Content[0].StartIndex
}
}
};
var r2 = new Request()
{
InsertText = new InsertTextRequest()
{
Text = row.Variable,
Location = new Location()
{
Index = table.TableRows[i].TableCells[1].Content[0].StartIndex
}
}
};
var r3 = new Request()
{
InsertText = new InsertTextRequest()
{
Text = row.Title,
Location = new Location()
{
Index = table.TableRows[i].TableCells[0].Content[0].StartIndex
}
}
};
requests.Add(r1);
requests.Add(r2);
requests.Add(r3);
}
As requested here's a sample of the request body. The actual request is much longer but essentially the same as it's simply an array of the same type of request objects.
[{
"createNamedRange": null,
"createParagraphBullets": null,
"deleteContentRange": null,
"deleteNamedRange": null,
"deleteParagraphBullets": null,
"deletePositionedObject": null,
"deleteTableColumn": null,
"deleteTableRow": null,
"insertInlineImage": null,
"insertPageBreak": null,
"insertTable": null,
"insertTableColumn": null,
"insertTableRow": null,
"insertText": {
"endOfSegmentLocation": null,
"location": {
"index": 15806,
"segmentId": null,
"ETag": null
},
"text": "asdfasdfad",
"ETag": null
},
"replaceAllText": null,
"updateParagraphStyle": null,
"updateTableColumnProperties": null,
"updateTableRowStyle": null,
"updateTextStyle": null,
"ETag": null
}, {
"createNamedRange": null,
"createParagraphBullets": null,
"deleteContentRange": null,
"deleteNamedRange": null,
"deleteParagraphBullets": null,
"deletePositionedObject": null,
"deleteTableColumn": null,
"deleteTableRow": null,
"insertInlineImage": null,
"insertPageBreak": null,
"insertTable": null,
"insertTableColumn": null,
"insertTableRow": null,
"insertText": {
"endOfSegmentLocation": null,
"location": {
"index": 15804,
"segmentId": null,
"ETag": null
},
"text": "asdfasdf",
"ETag": null
},
"replaceAllText": null,
"updateParagraphStyle": null,
"updateTableColumnProperties": null,
"updateTableRowStyle": null,
"updateTextStyle": null,
"ETag": null
}]
You want to modify the text style of texts in a table.
You want to modify the text style of the header which is the first row of the table.
You have already been able to put and get for Google Document using Google Docs API.
If my understanding is correct, how about this answer? Please think of this as just one of several answers.
Issue:
At your request body, it is found that the text is inserted. In order to achieve above, it is required to update the text style. But at first, it is required to retrieve the indexes of cells of the header row.
Solution:
Here, I would like to explain this flow using a sample situation. As the sample situation, it uses the following Google Document. As a test case for your situation, the texts of header1, header2 and header3 of the header row are modified as the bold style.
Flow:
Retrieve the table using the method of documents.get of Docs API.
At that time, when the following "fields" parameter is used, the readability of data can be increased.
body(content(table(tableRows(tableCells(content(paragraph(elements(endIndex,startIndex,textRun/content))))))))
The endpoint is as follows.
GET https://docs.googleapis.com/v1/documents/{documentId}?fields=body(content(table(tableRows(tableCells(content(paragraph(elements(endIndex%2CstartIndex%2CtextRun%2Fcontent))))))))
When the method of documents.get is requested with above endpoint, the following value is returned.
{"body":{"content":[{},{},{},{},
{"table":{
"tableRows":[
{"tableCells":[
{"content":[{"paragraph":{"elements":[{"startIndex":14,"endIndex":22,"textRun":{"content":"header1\n"}}]}}]},
{"content":[{"paragraph":{"elements":[{"startIndex":23,"endIndex":31,"textRun":{"content":"header2\n"}}]}}]},
{"content":[{"paragraph":{"elements":[{"startIndex":32,"endIndex":40,"textRun":{"content":"header3\n"}}]}}]}
]},
{"tableCells":[
{"content":[{"paragraph":{"elements":[{"startIndex":42,"endIndex":49,"textRun":{"content":"value1\n"}}]}}]},
{"content":[{"paragraph":{"elements":[{"startIndex":50,"endIndex":57,"textRun":{"content":"value2\n"}}]}}]},
{"content":[{"paragraph":{"elements":[{"startIndex":58,"endIndex":65,"textRun":{"content":"value3\n"}}]}}]}
]},
{"tableCells":[
{"content":[{"paragraph":{"elements":[{"startIndex":67,"endIndex":74,"textRun":{"content":"value4\n"}}]}}]},
{"content":[{"paragraph":{"elements":[{"startIndex":75,"endIndex":82,"textRun":{"content":"value5\n"}}]}}]},
{"content":[{"paragraph":{"elements":[{"startIndex":83,"endIndex":90,"textRun":{"content":"value6\n"}}]}}]}
]}
]
}},
{},{},{},{}]}}
The first index of tableRows is the header row.
Retrieve the indexes of header1, header2 and header3.
From the retrieved table data, it was found that "startIndex":14,"endIndex":22, "startIndex":23,"endIndex":31 and "startIndex":32,"endIndex":40 are the indexes for header1, header2 and header3, respectively.
By using the method of documents.batchUpdate with these values, the text style of texts of the header row can be modified to the bold style.
The endpoint is as follows.
POST https://docs.googleapis.com/v1/documents/{documentId}:batchUpdate
The request body is as follows.
{"requests":[
{"updateTextStyle":{"range":{"startIndex":14,"endIndex":22},"textStyle":{"bold":true},"fields":"bold"}},
{"updateTextStyle":{"range":{"startIndex":23,"endIndex":31},"textStyle":{"bold":true},"fields":"bold"}},
{"updateTextStyle":{"range":{"startIndex":32,"endIndex":40},"textStyle":{"bold":true},"fields":"bold"}}
]}
When this endpoint with the request body is requested, the following result can be obtained.
Result:
References:
Method: documents.get
Method: documents.batchUpdate
UpdateTextStyleRequest
If you want to bold some text. You need to submit a request similar to the following:
requests = [
{
'updateTextStyle': {
'range': {
'startIndex': 1,
'endIndex': 5
},
'textStyle': {
'bold': True,
},
'fields': 'bold'
}
},
]
The range: {'startIndex': 1, 'endIndex':5} should reference the range of text that should be bold.
i am trying to query the data created in a particular month.
#events = Event.aggregates([
{
'$project': {
_id: 1,
created_at: 1,
'month': {'$month': '$created_at'}
},
},
{month: {'$match': 05}}
])
the aggregates is not giving me any result.
I get response in postman,
{
"count": 0,
"sum": null,
"avg": null,
"min": null,
"max": null
}
Personally I prefer collection.aggregate over aggregates. Secondly, the $match pipeline was wrong. Lastly, even though it does work in ruby, don't write 05 ans some languages might interpret that as octal rather than decimal.
#events = Event.collection.aggregate([
{
'$project': {
_id: 1,
created_at: 1,
'month': {'$month': '$created_at'}
},
},
{"$match" => {"month" => {'$eq': 5}}}
]).to_a
I am using an API call which returns a JSON response. I want to access the data inside the response so I can create some nice display cards showing the info and pictures. Here is a snippet from the response, the response property is populated with about 20 objects I'll include just two for brevity:
{
"success": true,
"message": "",
"result": [
{
"MarketCurrency": "LTC",
"BaseCurrency": "BTC",
"MarketCurrencyLong": "Litecoin",
"BaseCurrencyLong": "Bitcoin",
"MinTradeSize": 1e-8,
"MarketName": "BTC-LTC",
"IsActive": true,
"Created": "2014-02-13T00:00:00",
"Notice": null,
"IsSponsored": null,
"LogoUrl": "https://i.imgur.com/R29q3dD.png"
},
{
"MarketCurrency": "DOGE",
"BaseCurrency": "BTC",
"MarketCurrencyLong": "Dogecoin",
"BaseCurrencyLong": "Bitcoin",
"MinTradeSize": 1e-8,
"MarketName": "BTC-DOGE",
"IsActive": true,
"Created": "2014-02-13T00:00:00",
"Notice": null,
"IsSponsored": null,
"LogoUrl": "https://i.imgur.com/e1RS4Hn.png"
},
In my Rails controller I'm using JSON.parse and I'm trying to turn it into an object with the Open struct option:
#markets = JSON.parse(markets.to_json, object_class: OpenStruct)
In my view I'll do this <%=#markets.class%> and it shows Array and not object. So I try this <%=#markets.size%> and it shows 1. If I do <%=#markets[0]['success']%> I would expect it to return true but it returns 'success'. So, I'm not understanding why the ostruct library isn't working like I would expect or how I can get to the objects stored in the result array. Any help is greatly appreciated!
You already have a JSON response, isn't needed to use to_json again, try just parsing that object, and then use the dot . to access its fields, as an OpenStruct object now then you can access them as methods:
require 'json'
a = '{
"success": true,
"message": "",
"result": [{
"MarketCurrency": "LTC",
"BaseCurrency": "BTC",
"MarketCurrencyLong": "Litecoin",
"BaseCurrencyLong": "Bitcoin",
"MinTradeSize": 1e-8,
"MarketName": "BTC-LTC",
"IsActive": true,
"Created": "2014-02-13T00:00:00",
"Notice": null,
"IsSponsored": null,
"LogoUrl": "https://i.imgur.com/R29q3dD.png"
}, {
"MarketCurrency": "DOGE",
"BaseCurrency": "BTC",
"MarketCurrencyLong": "Dogecoin",
"BaseCurrencyLong": "Bitcoin",
"MinTradeSize": 1e-8,
"MarketName": "BTC-DOGE",
"IsActive": true,
"Created": "2014-02-13T00:00:00",
"Notice": null,
"IsSponsored": null,
"LogoUrl": "https://i.imgur.com/e1RS4Hn.png"
}]
}'
b = JSON.parse(a, object_class: OpenStruct)
p b.success
# => true
After much debugging and some assistance, I was able to get it to work. The response from the API call was an array with one item. The item was a long string of the entire dataset.
In order to get the expected behavior of "true" when calling #markets.success, I first had to
raw_markets = JSON.parse(markets.to_json)
followed by
#markets = raw_markets.map do |market|
JSON.parse(market, object_class: OpenStruct)
Note: the variable markets holds the original api call:
markets = open('url-to-api')
After this I would get #markets.success = "true" and #markets.result[0] held the first result, #markets.result[1] held the second result, and so on.
I am trying to retrieve data from 2 buckets, no error but nothing shows up (I do have documents I need in these buckets).
1st bucket: a_bucket
here is the document I am interested in (I do have 3 different docs)
author_ID document:
{
"author_ID": 1,
"profil_creation_date": "2017/01/01/01:23:05/+5",
"prefix": "Mr.",
"first_name": "Dylan",
"middle_name_s": "Alfred",
"last_name": "Kerr",
"date_of_birth": "1974/01/02",
"sex": "M",
"marital_status": "Single",
"mobile_phone": "(860) 231-3336",
"address": [
{
"address_1": {
"address_ID": 1,
"home_address": "338 Counts Lane",
"city": "West Hartford",
"province/state": "CT",
"postal_code": "06105"
}
},
{
"address_2": {
"address_ID": 2,
"work_address": "977 Copperhead Rd",
"city": "Newington",
"province/state": "CT",
"postal_code": "06111"
}
}
]
}
2nd bucket: b_bucket
here are the 2 docs I am interested in:
p_output_ID document:
{
"p_output_ID": 1,
"author_ID": 2,
"overall_score": 4.41,
"status": {
"r_status_first": "TRUE",
"r_status_second": "FALSE",
"r_status_third": "YES",
"y_status_second": "TRUE",
"y_status_third": "FALSE",
"g_status_third": "TRUE"
}
}
timing_ID document:
{
"timing_ID": 1,
"p_output_ID": 1,
"author_ID": 1,
"date_and_time": "2017-06-06/23:45:25.25/+5",
"time_in_seconds": 12525,
"incremental_time_in_seconds": "time_in_seconds",
"current_state_and_duration": {
"state": "RED",
"duration_in_seconds": 33333
}
}
my goal is to grab these informations in one query ():
prefix, first_name, middle_name_s, last_name (from author_ID document in a_bucket)
overall_score (from p_output_ID document in b_bucket)
date_and_time, state (from timing_ID document in b_bucket)
Here is my query:
select p2.current_state_and_duration.state, p1.overall_score, p2.date_and_time
from proc_data_bucket p1 USE KEYS "p_output_ID"
JOIN proc_data_bucket p2 ON KEYS "author_ID";
The syntax is OK, but I am getting no data
Please help me with that...
CREATE INDEX ix1 ON b_bucket(timing_ID);
SELECT p1.prefix, p1.first_name, p1.middle_name_s, p1.last_name,
p2.date_and_time,p2.state,
p3.overall_score
FROM b_bucket p2
JOIN a_bucket p1 ON KEYS ("author_" || TO_STRING(p2.author_ID))
JOIN b_bucket p3 ON KEYS ("p_output_" || TO_STRING(p2.p_output_ID))
WHERE p2.timing_ID BETWEEN 10 AND 50;
I am building a helpdesk application. I have a model called TicketDetail, with a table which uses datatables to get its data via JSON. This is in order to periodically recalculate the time a ticket has been open. The time taken is formatted by a simple helper so it's in the format "dd:hh:mm", but it should be sorted by the time (stored as a decimal) multiplied by a weighting. Here's the datatables definition
var table = $('#ticket_details').DataTable({
order: [[ 8, "desc" ], [ 9, "desc" ], [ 2, "asc" ]],
stateSave: true,
deferRender: true,
ajax: $('#ticket_details').data('source'),
"columns": [
{ "data": "reference_number" },
{ "data": "location" },
{ "data": "title" },
{ "data": "parent", className: "hidden-md hidden-sm hidden-xs" },
{ "data": { _:"time_display.time", sort: "time_display.decimal_time"}},
{ "data": "created_by", className: "hidden-md hidden-sm hidden-xs" }
]
} );
setInterval( function () {
table.ajax.reload( null, false ); }, 60000 );
Here's a simplified sample record, where the ticket has been open 3 days and 6 hours, with a weighting of x2 (i.e. 3.25 * 2 = 6.5:
{
data: [
{
id: 140,
parent: null,
title: "[",
location: "Bond St",
ticket_sla: "16 Hours",
reference_number: "1606210001",
ticket_sla_weighting: 2,
time_display: {
time: "<span class = "label label-danger">03:06:00</span>",
decimal_time: 6.5
}
]
}
The problem is that the datatable sorts correctly if I display the decimal_time, but as soon as I put the formatted time in the class, it sorts simply by the number of days, immediately to the left of the colon. (So 03:06:00 and 03:18:00 would not get sorted properly).
For Date/Time sorting in DataTable You need to use it's Sorting plug-ins
For Example,
You need to include this js files :
//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js
//cdn.datatables.net/plug-ins/1.10.12/sorting/datetime-moment.js
and then, In your jQuery use this as
$.fn.dataTable.moment( 'HH:mm MMM D, YY' ); // Pass your date time format as param
For Deeper reference please check :
Sorting Plugins
Ultimate date / time sorting plugin