Sample code for 30+ languages & platforms
JavaScript

Multimodal Input: Image Data

See more AI Examples

Demonstrates sending a request that includes both text and image data for the AI to analyze.
Note
This example is intended for running within a Chilkat.Js embedded JavaScript engine. All Chilkat JavaScript examples require Chilkat v11.4.0 or greater.
JavaScript
var success = false;

//  This example assumes the Chilkat API to have been previously unlocked.
//  See Global Unlock Sample for sample code.

var ai = new CkAi();

//  The provider can be "openai", "google", "claude", "deepseek", "xai", or "perplexity".
//  Support for additional providers will be added in future versions of Chilkat.
//  xAI (Grok) will be used here..
ai.Provider = "xai";

//  Use your provider's API key.
ai.ApiKey = "MY_API_KEY";

//  Choose a model.
ai.Model = "grok-4.5";

//  Add both text input, and image data
ai.InputAddText("Describe what you see in the following image.");

var bd = new CkBinData();
//  We're passing a relative local file path here.. (relative the the app's current working directory)
success = bd.LoadFile("qa_data/jpg/starfish.jpg");
if (success == false) {
    console.log(bd.LastErrorText);
    return;
}

ai.InputAddImageData(bd,"");

//  Ask the AI for text output.
success = ai.Ask("text");
if (success == false) {
    console.log(ai.LastErrorText);
    return;
}

//  Get the text response.
var sbResponse = new CkStringBuilder();
ai.GetOutputTextSb(sbResponse);
console.log(sbResponse.GetAsString());

//  -------------------------------------------------------------
//  The response is in markdown format.
//  Also see Markdown to HTML Conversion Examples.
//  -------------------------------------------------------------

//  Sample output:

//  The image depicts a small, bright orange starfish (also known as a sea star) with five symmetrical arms radiating from a central disc. 
//  It has a textured, bumpy surface that gives it a realistic, almost spiky appearance, and there's a small hole or indentation at the center, 
//  which might represent the mouth or a natural feature. The starfish is shown against a plain white background, and it appears to be a simple, 
//  illustrative or clipart-style graphic rather than a photograph.