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";

// 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.